Aprovecha tu beca de hasta 25% Becas hasta 25%

Titulación Universitaria + 16 Créditos ECTS

Curso Superior en Diseño Web

Curso Superior en Diseño Web

¿Te gustaría crear sitios web atractivos, funcionales y accesibles, aplicando usabilidad y diseño responsivo? Fórmate en principios de diseño web y herramientas como Adobe XD y Bootstrap 4.

  • 100% Online
  • 400 Horas
  • Conv. abierta
  • Becas
  • Titulación Universitaria
  • 100% Online y Flexible
  • 16 Créditos ECTS
  • Sin compromiso · Respuesta en menos de 24 h
Curso Superior en Diseño Web

Un máster respaldado por datos reales del programa

  • 16 Créditos ECTS
  • Facultad de Diseño y Desarrollo Web
  • Prácticas en centros reales
  • Título propio Euroinnova

¿Qué vas a lograr con este máster?

Principios de diseño

Comprende los principios del diseño web y su aplicación para crear sitios atractivos y funcionales.

Elementos básicos

Aplica tipografía, color, iconos, formas, imágenes y contenido audiovisual en el diseño de interfaces.

Proceso y prototipado

Domina el proceso desde investigación inicial hasta el prototipado para pasar de idea a diseño.

UI y responsive

Diseña interfaces con Adobe XD y desarrolla webs responsivas con Bootstrap 4, aplicando guías y tendencias.

Temario del programa

3 módulos que cubren desde los fundamentos del diseño web y la usabilidad hasta el uso de Adobe XD para interfaces y Bootstrap 4 para sitios responsivos. Haz clic en cada módulo para ver el contenido completo.

01

Módulo 1. Diseño Web y Usabilidad

Unidad Didáctica 1. Introducción Al Diseño Web

  • Breve historia del diseño
  • Comunicación y publicidad
  • Teoría de la percepción
  • Elementos básicos que intervienen en el diseño
  • La composición
  • Fases del diseño
  • Diseño digital

Unidad Didáctica 2. Elementos Básicos para el Diseño Web

  • Tipografía
  • Color
  • Iconos
  • Formas
  • Imágenes
  • Contenido audiovisual
  • Efectos (sombras, D, flat y otros)

Unidad Didáctica 3. Layout

  • ¿Qué es el Layuot?
  • Rejilla
  • Composición
  • Elementos
  • Espacios vacíos
  • Coherencia y consistencia

Unidad Didáctica 4. Proceso

  • Introducción al proceso de diseño web
  • Aproximación e Investigación inicial
  • Idear
  • Bocetos
  • Arquitectura de la información
  • Card Storing
  • User flow o diagrama de flujo de usuario
  • Wireframing
  • Prototipado
  • Planificación

Unidad Didáctica 5. Directrices y Tendencias Digitales

  • Guías de estilo
  • Ventajas y Desventajas
  • Apple IOS Human Interface Guidelines
  • Google Material Design
  • Tendencias digitales
  • Tendencias del diseño UX/UI

Unidad Didáctica 6. Diseño en Dispositivos

  • Patrones de diseño y navegación
  • Especificaciones para móviles
  • Sitios, sitios par amóviles y apps
  • Diseñar para pantallas pequeñas
  • Eltimpo de respuesta y carga
  • Tablets y E-Readers

Unidad Didáctica 7. Lenguaje Html

  • Textos en HTML
  • Enlaces
  • Listas en HTML
  • Imágenes y Objetos
  • Tablas
  • Formularios
  • Marcos
  • Estructuras y layout
  • Otras etiquetas

Unidad Didáctica 8. Wireframes y Prototipos

  • ¿Qué son los wireframes?
  • Objetivos del wireframe
  • Relación con la UI
  • Clasificación de los wireframes
  • Arquitectura de la información
  • Wireframe para una app
02

Módulo 2. Diseño Ui con Adobe Xd

Unidad Didáctica 1. Primeros Pasos en Adobe Xd

  • Introducción a Adobe XD
  • Instalación y configuraciones principales
  • Menú Herramientas
  • Generación de Artboards y guía
  • Ejercicios

Unidad Didáctica 2. Herramientas Básicas

  • Formas: creación, modificación, colores, gradiantes y paletas
  • Textos: propiedades, línea o área, alineación, color y estilos
  • Imágenes y exportación: importanción, modificaciones y exportación de artboards
  • Ejercicios

Unidad Didáctica 3. Organización de Elementos I

  • Organización de capas nombres y grupos
  • Bloqueo y fusión
  • Tipos de máscaras y aplicación en proyectos
  • Ejercicios

Unidad Didáctica 4. Organización de Elementos Ii

  • Alineación de elementos, márgenes y distribución de formas
  • Funcionalidad de repetición
  • Aplicación y configuración de componentes
  • Ejercicios

Unidad Didáctica 5. Cuadrículas

  • Creación y aplicación
  • Diseño de páginas
  • Prototipo
  • Adaptación a mobile
  • Ejercicios

Unidad Didáctica 6. Interfaces

  • Constantes y variables de una interfaz
  • Header, footer y menú
  • Botones y galerías
  • Ejercicios
03

Módulo 3. Bootstrap 4: Desarrollo Web Responsive

Unidad Didáctica 1. Introducción a Css

  • Introducción CSS
  • Soporte de CSS en navegadores
  • Especificación oficial
  • Funcionamiento básico de CSS
  • ¿Cómo incluir CSS en la Web?
  • Estilo básico
  • Medios CSS
  • Comentarios
  • Sintaxis de la definición

Unidad Didáctica 2. Css: Selectores, Unidades de Medida y Colores

  • Selectores CSS
  • Unidades de medida
  • Colores

Unidad Didáctica 3. Css: Pseudoclases y Pseudoelementos Css

  • Pseudoclases
  • Pseudo-elementos
  • Otras pseudoclases y pseudoelementos

Unidad Didáctica 4. Css: Modelos de Caja, Posicionamiento y Visualización

  • Modelo de cajas
  • Propiedades de las cajas
  • Margen, relleno, bordes y modelo de cajas
  • Posicionamiento y visualización
  • Posicionamiento
  • Visualización

Unidad Didáctica 5. Css: Flexbox

  • En qué cosiste
  • Visualización: Display
  • Contenedores flexibles: flex e inline-flex
  • Orientación: flex-box, flex-direction y flex-wrap
  • La propiedad order
  • Alineación de los elementos flexibles
  • Soporte de los navegadores

Unidad Didáctica 6. Css: Hojas de Estilos

  • Crear y vincular hojas de estilos
  • Estructura
  • Propiedades CSS
  • Selectores
  • Posición y tamaño
  • Texto
  • Imágenes
  • Listas, tablas, formularios

Unidad Didáctica 7. Responsive Design

  • Introducción
  • Definición de Diseño Web Responsive
  • ¿En qué consiste el diseño responsive?
  • Ventajas del diseño responsive
  • SEO y diseño responsive

Unidad Didáctica 8. Introducción a Bootstrap 4

  • Introducción a Bootstrap 4
  • Diferencias entre Bootstrap 3 y Bootstrap 4
  • Generalidades de Bootstrap 4
  • Descarga e instalación de Bootstrap 4

Unidad Didáctica 9. Características y Uso del Layout

  • Uso de container y Media Queries (Responsive breakpoints)
  • Utilidades dentro de nuestro layout: flexbox, margin, padding and visibility
  • Estructura básica del Grid
  • Posibilidades de personalización del Grid

Unidad Didáctica 10. Creación de Elementos Html con Bootstrap 4

  • Tablas
  • Jumbotron
  • Alertas
  • Barras de progreso
  • Paginación
  • Listas de grupos
  • Desplegables
  • Barras de navegación
  • Formularios
  • Carruseles
  • Modales

Unidad Didáctica 11. Personalización de Elementos con Bootstrap 4

  • Tipografía
  • Colores
  • Imágenes
  • Botones
  • Formularios personalizados

Unidad Didáctica 12. Utilidades Avanzadas de Personalización

  • Bordes: color, posición y radio
  • Uso de Clearfix
  • Colores de fondo con grado de intensidad
  • Uso del atributo Display
  • Uso del sistema Flex
  • Fijación de elementos mediante posiciones
  • Modificaciones avanzadas del texto
  • Ejemplos combinados del uso de Bootstrap en nuestra página

Claustro docente

Facultad de Programación y Desarrollo de Software — profesionales con experiencia en Curso Superior en Diseño Web.

OMAR DAVID ESCÁMEZ MORENO

OMAR DAVID ESCÁMEZ MORENO

Facultad de Programación y Desarrollo de Software

Desarrollo de aplicaciones web

FRANCISCO COBOS

FRANCISCO COBOS

Facultad de Programación y Desarrollo de Software

Análisis de negocio en deporte

ALFREDO VELA

ALFREDO VELA

Facultad de Programación y Desarrollo de Software

Marketing digital

CRISTINA MUÑOZ AYCUENS

CRISTINA MUÑOZ AYCUENS

Facultad de Ciberseguridad y Cloud Computing

Seguridad y auditoría informática

JORGE CÓRDOBA MERINO

JORGE CÓRDOBA MERINO

Facultad de Ciberseguridad y Cloud Computing

Ethical Hacking

JORGE LÓPEZ BLASCO

JORGE LÓPEZ BLASCO

Facultad de Ciberseguridad y Cloud Computing

Cloud Computing

ABRAHAM BRAVO

ABRAHAM BRAVO

Facultad de Ciencia de Datos e Inteligencia Artificial

Inteligencia Artificial

DANIEL CABRERA ARMENTEROS

DANIEL CABRERA ARMENTEROS

Facultad de Ciencia de Datos e Inteligencia Artificial

Cloud DevOps SER

¿Dónde podrás trabajar?

Al finalizar el máster podrás desempeñar roles como:

  • Diseñador web en agencias digitales
  • Diseñador UI/UX
  • Diseñador web en estudios de diseño
  • Diseñador en departamentos de marketing
  • Diseñador web freelance
  • Profesional independiente UI/UX

Metodología

Una forma de estudiar pensada para ti

Estudiantes trabajando juntos con sus portátiles
100% online y flexible

Estudia a tu ritmo, desde donde quieras
y con acompañamiento real.

Aprendizaje 100% online

Plataforma web con todo el contenido: actividades prácticas, autoevaluaciones y evaluación final.

Campus virtual

Accede 24 horas al día desde cualquier dispositivo, con acceso ilimitado durante toda tu matrícula.

Equipo docente especializado

Acompañamiento personalizado de docentes especializados en arteterapia clínica y de intervención social.

Centro del estudiante

Atención por teléfono, chat y email, con respuesta en un máximo de 24/48 horas.

Testimonios

Lo que dicen nuestros alumnos

«Poder estudiar 100% online y compaginarlo con mi trabajo fue clave. Contenidos muy aplicables.»

Santiago Martín Cabrera

Promoción 2026

«Buscaba un Máster oficial sin desplazarme. Estuve atendida en todo momento, todo muy profesional.»

Patricia Ortiz Ruiz

Promoción 2025

+500Kestudiantes formados en Euroinnova
+45%estudiantes internacionales
+20años formando online
+50%ha vuelto a estudiar con nosotros

Becas y ayudas · Hasta 25% de descuento

¿Lista/o para formarte en Curso Superior en Diseño Web?

Un asesor académico resuelve tus dudas y te informa de las becas disponibles. Sin compromiso.