CursoMaqueta interfaces Web sin límites de diseño

$150.000

Módulos

1. Introducción al Framework Nigma

  • ¿Para qué sirve el Framework Nigma?
  • Herramientas necesarias
  • Editor de código y configuración
  • Instalar dependencias del Framework
  • Tu primer Hola mundo!
  • Estructura del Framework Nigma

2. Preprocesadores para HTML y CSS

  • Introducción a Pug
  • Modularizar HTML con Pug – include
  • Modularizar HTML con Pug – Extends y Block
  • Modularizar HTML con pug en el Framework
  • Introducción a Stylus
  • Modularizar CSS con Stylus
  • Introducción al nombramiento de clases CSS
  • Nombrar clases CSS como componentes
  • Nombrar clases CSS como objetos

3. Configuración de Stylus en el Framework

  • Rutas para imágenes y fuentes tipográficas
  • Tipografía personalizada con Google Fonts
  • Tipografía personalizada con el Framework
  • Icon Fonts de terceros
  • Crea tus propios icon-fonts
  • Tamaño y grosor por defecto para textos
  • Configurar paleta de colores
  • Grid layout con CSS nativo
  • Grid layout con Flexbox

4. Mobile First y Responsive Design

  • ¿Por qué Mobile First?
  • Media Queries usando +min()
  • Media Queries usando +max()
  • Media Queries +between()
  • Media Queries +at()
  • Media Queries +mobile()
  • Media Queries + tablet()
  • Media Queries +desktop()
  • Media Queries +hd()

5. Preparar proyecto para producción

  • Copyright automático en archivos CSS y JavaScript
  • Generación de archivos .htaccess y humans.txt
  • Comando para crear código listo para producción

6. Proyecto práctico de Maquetación usando el Framework

  • Maquetación Web de la vista home
  • Maquetación Web de la vista portafolio
  • Maquetación Web de la vista contacto
  • Maquetación Web de popups

Objetivos:

  • Aprender a codificar tus propios diseños usando un kit de herramientas tecnológicas modernas.
  • Maqueta cualquier diseño a medida para todos los tamaños de pantalla sin depender de 12 columnas.
  • Aumenta la velocidad de cada página al solo cargar la parte requerida usando XHR.
  • Implementa fuentes tipográficas o icon fonts personalizados de tu autoría o de terceros.
  • Optimiza tu código CSS y HTML y dejarlo listo para producción.

Perfil vocacional

Apasionado por la tecnología, te gusta crear desde cero tus diseños y no tienes límites para la creatividad.

Perfil profesional

Serás capaz de llevar a código cualquier interfaz Web por más compleja que esta sea, ya sea que tú mismo realices el diseño o que un diseñador te envíe el diseño para que lo maquetes desde cero y que este se pueda ver en todos los dispositivos. Puedes desempeñarte como Maquetador Web Senior ya que la experiencia que vas a adquirir en el curso es bastante avanzada, muy pocas personas saben realmente llevar a código una interfaz Web a medida por lo que te dará un plus a tu hoja de vida.

Metodología y duración

Clases en video para estudiar online y a tu ritmo.

Duración: 15 horas

Convenios Unihorizonte