One of these things is not like the other; identifying patterns in a mock-up

Kendall Totten

Pattern systems have brought exciting advances to working as a front-end developer.  No longer are we writing HTML and CSS for one page at a time; now we must write dynamic templates and styles to cover a variety of use-cases.  This requires we add a few more skills and tools to our toolbox!

Utilizing real-world examples from's blog redesign project, we will walk through the process of converting mockups into dynamic, reusable patterns step-by-step.  

  • What types of questions should you be asking designers during planning?  
  • How do you spot the subtle similarities that might tie two patterns together?  
  • How do you separate and solve for the needs of the pattern system and the perspective of the content administrator?  
  • How do you build massively flexible patterns that save you from having to build a new pattern for every piece of the project?

After this presentation, you should be able to build patterns so flexible that when the next project rolls around, you have only half the work to do because your existing patterns will be doing the heavy lifting for you.  Participants with a familiar with the theory of pattern systems will get the most out of this talk.


Session Track

Front End Development

Experience Level


Drupal Version

When & Where

Tuesday, 10 April, 2018 - 17:00 to 18:00
101AB | Pantheon