Diseño atomico en Drupal

Nivel
Principiante
Charlista

Cuantas veces como front-end developer te encuentras un diseño que no es consistente? Como diseñador, no te gustaria tener una mejor idea de como se va a comportar tu diseño cuando se haga en HTML? Una solucion para esto es Pattern Labs y el Diseño atomico

Pattern Lab (patternlab.io) es "un generador de sitio estático personalizado que construye una interfaz cosiendo átomos, moléculas y organismos para formar plantillas y páginas". Basado en el concepto atómico del diseño de Brad Frost (http://atomicdesign.bradfrost.com/table-of-contents/). La filosofía de Pattern Lab es paralela a varios principios fundamentales de OOP: "Don’t Repeat Yourself and Keep It Simple, Stupid."

La versión original de Pattern Lab utiliza plantillas de Mustache, pero ha habido una versión de Twig durante más de un año. Usando el kit de inicio de Pattern Lab para Twig (https://github.com/pattern-lab/edition-php-twig-standard), podemos crear patrones que se correspondan con las plantillas Twig de Drupal.

Puntos a ver:

  • Problemas comunes del diseño web
  • Que es diseño atomico
  • Introduccion a Pattern Labs
  • Integracion en Drupal 8
  • Ejemplo