Design and Prototyping for Drupal

Chapter 2. The Drupal Designer’s Toolkit

While every designer has their own set of applications and supplies that they use for everyday design and prototyping work, certain tools just seem to be particularly useful when working in Drupal. The following is the toolkit that I use for most of my work. Although the last two applications (Coda and Less.app) are Mac-specific, the others are available for Mac or PC.

Balsamiq Mockups

Balsamiq (http://balsamiq.com/products/mockups) is a relatively small, but robust, Adobe Air application that helps you create UI mockups incredibly quickly. The program itself contains many of the standard elements you’d expect in a web mockup (text boxes, headlines, video or image comps, etc.), but it’s all done in a simple, cartoonish style that helps clients and the design team focus on what’s important in the early stages of a project—content organization and hierarchy. Stephanie at Fusion by Top Notch Themes also put together a handy mockup of Drupal-specific components, which you can download here: http://fusiondrupalthemes.com/story/100325/easier-wireframing-drupal-components-balsamiq-mockups. I’ve used it extensively for some of the examples in this book. Figure 2-1 shows the entire set of components.

Figure 2-1. A set of standard Drupal components, for your rapid wireframing needs. Courtesy of the fine folks at Fusion by Top Notch themes. ...