Design, prototype, and style in browser

This week, Brad Frost released a blog post about The Principles of Adaptive Design, and his principles on creating the responsive web. He makes the apt analogy that although the core pieces of responsive web design (fluid grids, flexible media, and media queries) are extremely important, they are but the tip of the iceberg when it comes to creating the amazing experiences we all want across the web.

It was these same principles that drove Sam Richard, Chris Ruppel and me to ensure our responsive web design training delved into more than just building squishy sites. We have always focused on the latest tools, and emerging standards in our trainings, and our current training is no exception. Already given at DrupalCon Austin, this fall we are giving the an updated training on designing, prototyping and styling within the browser. This course expands upon the Sass and Compass training we provided at DrupalCon Prague, providing more focus on content strategy, component-based design and tools to prototype rapidly in the browser.

Content Strategy

The very base of starting out new projects is ensuring that we have a sturdy content strategy and we have found that starting here has given our projects a foundation that allows us to create better, faster, more performant designs. The first portion of our training will break down the important parts of content strategy. We’ll go through creating a content strategy together, just as we do for client projects. This process not only gives designers and developers a solid starting point, but also we show how it can be directly applied to creating sites in Drupal.

Component-based Design

At Four Kitchens, we focus on building our designs on a per-component basis. This strategy for design allows for us to break up our design process to reusable components, and allowing for more DRY code. We have found that focusing our design this way also helps meet our performance budget and have much better code maintainability. Our training will go over the principles for component-based design that have made the biggest design impact on the projects we have built.

Style Prototyping

We are building systems for the web, and as such, we should keep our design deliverables within the browser. The general rule of thumb we apply is that, while individual designers use various programs to aid their creative process, nothing gets demoed outside of the browser. Although this seems like a daunting task at first, do not fear! Our training goes into detail about how to use Style Prototypes to create a living component-based prototype, all within the browser. We go into the tools that run style prototypes to make your design and development process go fast and be headache-free. Using the power of Yeoman, Sass, Gulp.js, and more, we will train you on the tools needed to make designing in the browser a reality for your organization.

DrupalCon Amsterdam

Chris and I will be doing this training at DrupalCon Amsterdam this fall. If your team is looking to take the next step in responsive web design, we encourage you to register. If you have any questions about the training beforehand, feel free to contact me before you register. If you have taken our previous responsive web design courses, this course takes the Sass and Compass training we have done previously to the next level, and there will still be new content.