Specialization in No-Code Web Design

Resumen del curso

• U1: Inspirándose

  • Introducción

  • Influencias | Juan Mora

  • Influencias | Filip Felbar

  • Influencias | Jan Losert

  • Influencias | Mónica Durán

  • Influencias | Isa Macías

• U2: Diseño UX UI para landing pages: cuenta una historia única

  • Tipos de landing pages

  • ¿Qué es un buen landing page?

  • ¿Qué es la jerarquía en el contenido?

  • Contraste, balance visual y la regla de los 3 segundos

  • El brief y cómo investigar

  • Estructura de contenido para un landing page

  • Cómo hacer un mood board

  • La tipografía adecuada

  • Creación de la historia

  • ¡Pon todo el material en el canvas!

  • Crea los assets que necesites para tu landing page

  • Definición del diseño

  • Pulir tu diseño: feedback

  • Presentación al cliente

• U3: Sistemas de diseño para páginas web con Figma

  • Introducción a los sistemas de diseño

  • Cómo los sistemas de diseño pueden ayudarlo a acelerar su flujo de trabajo

  • Introducción al proyecto y enfoque

  • Configuración del archivo Figma y comienzo de las primeras exploraciones 1

  • Configuración del archivo Figma y comienzo de las primeras exploraciones 2

  • Expansión del sistema de exploraciones y diseño 1

  • Expansión del sistema de exploraciones y diseño 2

  • Organización de las páginas del sistema de diseño 1

  • Organización de las páginas del sistema de diseño 2

  • Exploración de variantes al crear componentes

  • Refinar el sistema de diseño con una página ensamblada 1

  • Refinar el sistema de diseño con una página ensamblada 2

  • Refinar el sistema de diseño con una página ensamblada 3

  • Configuración de nuevas páginas con el sistema de diseño completo 1

  • Configuración de nuevas páginas con el sistema de diseño completo 2

  • Configuración de nuevas páginas con el sistema de diseño completo 3

  • Cómo abordar la creación de documentación para el sistema de diseño

  • Limpieza y uso de un diseño automático

  • Utilización del diseño en otros elementos de la marca

  • Pensamientos finales

• U4: Creación de sitios web sin código con Webflow

  • Introducción a No-Code

  • Funciones principales de flujo web

  • Diseño

  • Guía de estilo

  • Creación de guía de estilo 1

  • Creación de guía de estilo 2

  • Sección de héroe

  • Navegación

  • Secciones de caso de estudio 1

  • Secciones de caso de estudio 2

  • Collage Sección 1

  • Collage Sección 2

  • Sección de clientes y formulario sencillo de newsletter

  • Pie de página

  • Vista de la tableta

  • Vista horizontal y vertical móvil

  • Formularios de prueba

  • Interacciones

  • Optimización SEO y hosting

  • Panel de mantenimiento, editor y activos

  • Explorar el CMS

• U5: Creación de una página web en Squarespace

  • Definiendo el objetivo y la estructura de nuestra web P1

  • Definiendo el objetivo y la estructura de nuestra web P2

  • El estilo general de nuestro sitio

  • Creación, organización y preparación de los archivos gráficos

  • Cambios en la interfaz de bloques de contenido de Squarespace

  • Cómo escoger la plantilla para tu web

  • Configuraciones iniciales en Squarespace

  • Creación de páginas en Squarespace: sus propiedades y ajustes

  • Los bloques de contenido en Squarespace

  • Las secciones de páginas en Squarespace

  • Diseño y configuración de las páginas de Inicio, Servicios, Sobre mí y Contacto P1

  • Diseño y configuración de las páginas de Inicio, Servicios, Sobre mí y Contacto P2

  • Diseño y configuración de las páginas de Inicio, Servicios, Sobre mí y Contacto P3

  • Configuración de la página de Portafolio P1

  • Configuración de la página de Portafolio P2

  • Configuración del Blog P1

  • Configuración del Blog P2

  • Configuración del Blog P3

  • Creación del Footer y ajustes a la navegación principal

  • Configuración de tipografías y colores del sitio P1

  • Configuración de tipografías y colores del sitio P2

  • Configuración de las imágenes y otros ajustes

  • Extra: Estilos de la web en Squarespace 7.0

  • Ajustes de marketing

  • Ajustes generales de privacidad

  • Hagamos el sitio público P1

  • Hagamos el sitio público P2

  • Seguimiento de analíticas del sitio

• U6: Diseño web sin código con Elementor y Wordpress

  • Referencias visuales: dónde buscar inspiración

  • Mapa del sitio y guía de estilo

  • Elaboración de la propuesta de diseño 1

  • Elaboración de la propuesta de diseño 2

  • Primeros pasos en WordPress

  • Instalar Elementor

  • Conociendo Elementor 1

  • Conociendo Elementor 2

  • Header y footer 1

  • Header y footer 2

  • Homepage

  • Plantilla para los proyectos 1

  • Plantilla para los proyectos 2

  • Archivo de proyectos

  • "About" y "Contacto"

  • Páginas secundarias: privacidad, 404 y mantenimiento

  • Testar y lanzar la web

  • Actualización del sitio

• Proyecto final

  • Especialización en creación de sitios web sin código