For most of the web’s short lifetime, the primary way to design a website has been to create wireframes and comps (design compositions) of a site’s key pages. This page-based approach is clearly broken. The proliferation of smartphones and the increasing complexity of the interfaces we create make page-based design extremely time-consuming. A relatively simple site can require 25+ page comps.

The last few years have seen designers move to a process that is more in tune with the way websites are actually built and function. They design overall styles and repeating elements that make up pages, instead of the pages themselves. This process is quicker, easier for front-end developers to implement, and provides maximum flexibility.

In this session we will:

• Introduce the concept of design systems
• Walk through real-world examples of sites using this approach
• Explain the design process for system-based projects
• Walk through ways to implement the completed designs in Drupal