Curso Superior en Diseño Web
100% Online
6 meses
360€
Curso Superior en Diseño Web
    Curso Superior en Diseño Web

    Curso Superior en Diseño Web

    100% Online
    12 ECTS
    6 meses
    360€

    Presentación

    En la actualidad, el diseño web se ha convertido en un componente esencial para el éxito de cualquier empresa o proyecto. La capacidad de crear sitios web atractivos, funcionales y accesibles es fundamental para garantizar una experiencia positiva del usuario y lograr los objetivos comerciales. El diseño web y la usabilidad son aspectos cruciales en la creación de sitios web efectivos. Este Curso en Diseño Web aborda en detalle los principios y elementos básicos del diseño, incluyendo la tipografía, el color, los iconos, las formas, las imágenes y el contenido audiovisual. Además, se explora la importancia de la composición visual y se analizan las teorías de la percepción para comprender cómo los usuarios interactúan con los diseños.

    Universidades colaboradoras

    Para qué te prepara
    Este Curso en Diseño Web te prepara para convertirte en un diseñador web competente y versátil. Aprenderás a aplicar los principios del diseño web y la usabilidad en la creación de sitios web atractivos y funcionales. Obtendrás habilidades prácticas en el uso de herramientas como Adobe XD para diseñar interfaces de usuario de alta calidad y dominarás Bootstrap 4 para desarrollar sitios web responsivos.
    Objetivos
    - Comprender los principios del diseño web y su aplicación en la creación de sitios atractivos y funcionales. - Aplicar los elementos básicos del diseño, como la tipografía, el color, los iconos y las imágenes. - Dominar el proceso de diseño web, desde la investigación inicial hasta el prototipado. - Mantenerse actualizado sobre las guías de estilo y las tendencias digitales para crear diseños modernos y atractivos. - Diseñar interfaces de usuario intuitivas y atractivas utilizando Adobe XD. - Desarrollar sitios web responsivos utilizando Bootstrap 4 y las diferentes utilidades que ofrece. - Aplicar los principios del diseño responsive para garantizar que los sitios web sean accesibles y funcionales.
    A quién va dirigido
    Este Curso en Diseño Web es adecuado tanto para principiantes que desean adquirir conocimientos fundamentales como para diseñadores y desarrolladores web que deseen ampliar sus habilidades en diseño UI, prototipado y desarrollo web responsivo. No se requieren conocimientos previos de diseño o programación, ya que el curso aborda los conceptos desde los fundamentos.
    Salidas Profesionales
    Las salidas laborales de este Curso en Diseño Web son muy amplias y diversas. Podrás trabajar como diseñador web en agencias digitales, estudios de diseño, departamentos de marketing o como profesional independiente. También podrás trabajar como diseñador UI/UX, creando interfaces de usuario intuitivas y atractivas e incluso ofrecer tus servicios como freelance.
    Temario

    MÓDULO 1. DISEÑO WEB Y USABILIDAD

    UNIDAD DIDÁCTICA 1. INTRODUCCIÓN AL DISEÑO WEB

    1. Breve historia del diseño
    2. Comunicación y publicidad
    3. Teoría de la percepción
    4. Elementos básicos que intervienen en el diseño
    5. La composición
    6. Fases del diseño
    7. Diseño digital

    UNIDAD DIDÁCTICA 2. ELEMENTOS BÁSICOS PARA EL DISEÑO WEB

    1. Tipografía
    2. Color
    3. Iconos
    4. Formas
    5. Imágenes
    6. Contenido audiovisual
    7. Efectos (sombras, D, flat y otros)

    UNIDAD DIDÁCTICA 3. LAYOUT

    1. ¿Qué es el Layuot?
    2. Rejilla
    3. Composición
    4. Elementos
    5. Espacios vacíos
    6. Coherencia y consistencia

    UNIDAD DIDÁCTICA 4. PROCESO

    1. Introducción al proceso de diseño web
    2. Aproximación e Investigación inicial
    3. Idear
    4. Bocetos
    5. Arquitectura de la información
    6. Card Storing
    7. User flow o diagrama de flujo de usuario
    8. Wireframing
    9. Prototipado
    10. Planificación

    UNIDAD DIDÁCTICA 5. DIRECTRICES Y TENDENCIAS DIGITALES

    1. Guías de estilo
    2. Ventajas y Desventajas
    3. Apple IOS Human Interface Guidelines
    4. Google Material Design
    5. Tendencias digitales
    6. Tendencias del diseño UX/UI

    UNIDAD DIDÁCTICA 6. DISEÑO EN DISPOSITIVOS

    1. Patrones de diseño y navegación
    2. Especificaciones para móviles
    3. Sitios, sitios par amóviles y apps
    4. Diseñar para pantallas pequeñas
    5. Eltimpo de respuesta y carga
    6. Tablets y E-Readers

    UNIDAD DIDÁCTICA 7. LENGUAJE HTML

    1. Textos en HTML
    2. Enlaces
    3. Listas en HTML
    4. Imágenes y Objetos
    5. Tablas
    6. Formularios
    7. Marcos
    8. Estructuras y layout
    9. Otras etiquetas

    UNIDAD DIDÁCTICA 8. WIREFRAMES Y PROTOTIPOS

    1. ¿Qué son los wireframes?
    2. Objetivos del wireframe
    3. Relación con la UI
    4. Clasificación de los wireframes
    5. Arquitectura de la información
    6. Wireframe para una app

    MÓDULO 2. DISEÑO UI CON ADOBE XD

    UNIDAD DIDÁCTICA 1. PRIMEROS PASOS EN ADOBE XD

    1. Introducción a Adobe XD
    2. Instalación y configuraciones principales
    3. Menú Herramientas
    4. Generación de Artboards y guía
    5. Ejercicios

    UNIDAD DIDÁCTICA 2. HERRAMIENTAS BÁSICAS

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

    UNIDAD DIDÁCTICA 3. ORGANIZACIÓN DE ELEMENTOS I

    1. Organización de capas nombres y grupos
    2. Bloqueo y fusión
    3. Tipos de máscaras y aplicación en proyectos
    4. Ejercicios

    UNIDAD DIDÁCTICA 4. ORGANIZACIÓN DE ELEMENTOS II

    1. Alineación de elementos, márgenes y distribución de formas
    2. Funcionalidad de repetición
    3. Aplicación y configuración de componentes
    4. Ejercicios

    UNIDAD DIDÁCTICA 5. CUADRÍCULAS

    1. Creación y aplicación
    2. Diseño de páginas
    3. Prototipo
    4. Adaptación a mobile
    5. Ejercicios

    UNIDAD DIDÁCTICA 6. INTERFACES

    1. Constantes y variables de una interfaz
    2. Header, footer y menú
    3. Botones y galerías
    4. Ejercicios

    MÓDULO 3. BOOTSTRAP 4: DESARROLLO WEB RESPONSIVE

    UNIDAD DIDÁCTICA 1. INTRODUCCIÓN A CSS

    1. Introducción CSS
    2. Soporte de CSS en navegadores
    3. Especificación oficial
    4. Funcionamiento básico de CSS
    5. ¿Cómo incluir CSS en la Web?
    6. Estilo básico
    7. Medios CSS
    8. Comentarios
    9. Sintaxis de la definición

    UNIDAD DIDÁCTICA 2. CSS: SELECTORES, UNIDADES DE MEDIDA Y COLORES

    1. Selectores CSS
    2. Unidades de medida
    3. Colores

    UNIDAD DIDÁCTICA 3. CSS: PSEUDOCLASES Y PSEUDOELEMENTOS CSS

    1. Pseudoclases
    2. Pseudo-elementos
    3. Otras pseudoclases y pseudoelementos

    UNIDAD DIDÁCTICA 4. CSS: MODELOS DE CAJA, POSICIONAMIENTO Y VISUALIZACIÓN

    1. Modelo de cajas
    2. Propiedades de las cajas
    3. Margen, relleno, bordes y modelo de cajas
    4. Posicionamiento y visualización
    5. Posicionamiento
    6. Visualización

    UNIDAD DIDÁCTICA 5. CSS: FLEXBOX

    1. En qué cosiste
    2. Visualización: Display
    3. Contenedores flexibles: flex e inline-flex
    4. Orientación: flex-box, flex-direction y flex-wrap
    5. La propiedad order
    6. Alineación de los elementos flexibles
    7. Soporte de los navegadores

    UNIDAD DIDÁCTICA 6. CSS: HOJAS DE ESTILOS

    1. Crear y vincular hojas de estilos
    2. Estructura
    3. Propiedades CSS
    4. Selectores
    5. Posición y tamaño
    6. Texto
    7. Imágenes
    8. Listas, tablas, formularios

    UNIDAD DIDÁCTICA 7. RESPONSIVE DESIGN

    1. Introducción
    2. Definición de Diseño Web Responsive
    3. ¿En qué consiste el diseño responsive?
    4. Ventajas del diseño responsive
    5. SEO y diseño responsive

    UNIDAD DIDÁCTICA 8. INTRODUCCIÓN A BOOTSTRAP 4

    1. Introducción a Bootstrap 4
    2. Diferencias entre Bootstrap 3 y Bootstrap 4
    3. Generalidades de Bootstrap 4
    4. Descarga e instalación de Bootstrap 4

    UNIDAD DIDÁCTICA 9. CARACTERÍSTICAS Y USO DEL LAYOUT

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

    UNIDAD DIDÁCTICA 10. CREACIÓN DE ELEMENTOS HTML CON BOOTSTRAP 4

    1. Tablas
    2. Jumbotron
    3. Alertas
    4. Barras de progreso
    5. Paginación
    6. Listas de grupos
    7. Desplegables
    8. Barras de navegación
    9. Formularios
    10. Carruseles
    11. Modales

    UNIDAD DIDÁCTICA 11. PERSONALIZACIÓN DE ELEMENTOS CON BOOTSTRAP 4

    1. Tipografía
    2. Colores
    3. Imágenes
    4. Botones
    5. Formularios personalizados

    UNIDAD DIDÁCTICA 12. UTILIDADES AVANZADAS DE PERSONALIZACIÓN

    1. Bordes: color, posición y radio
    2. Uso de Clearfix
    3. Colores de fondo con grado de intensidad
    4. Uso del atributo Display
    5. Uso del sistema Flex
    6. Fijación de elementos mediante posiciones
    7. Modificaciones avanzadas del texto
    8. Ejemplos combinados del uso de Bootstrap en nuestra página
    Titulación
    Titulación Universitaria:
    Diploma Universidad Católica de Murcia
    Solicitar información
    País
    Información básica sobre Protección de Datos . Haz clic aquí