Wireframing for Drupal Themer, Developer and Sitebuilder
What the heck is wireframing/mockups and why to use it
Mockups reproduces the experience of sketching interfaces on a whiteboard, but using your computer, so they're easier to share, modify, and get honest feedback on.
Wireframes made with Mockups look like sketches, so stakeholders won't get distracted by little details, and can focus on what's really important instead.
There is lots of software for wireframing out there!
Drupal wireframing components for Balsamiq Mockup
I have chosen to work with Balsamiq Mockup, so you will find only components for this peace of software here.
In Drupal we have lots of features Boxes/Fields/... which are not implemented in common wireframing tools... also not in Balsamiq... But...
...There are some free components that make our lives easier!
extend Balsamiq Mockup with special Drupal components
- Header with logo, site name, slogan, primary and secondary links
- Node teasers with submitted, tags, different types of links, feed icon
- Sidebar with common blocks like search, user login, menus
- A Drupal-style pager
- Footer menu and footer message
- Drupal messages: warning, help, status, error
- Breadcrumbs, local task tabs
- Full node page with comment thread and form
- A few extra blocks like Quicktabs, view of recent comments, and Ubercart shopping cart block
Balsamiq Mockup Components by Fusion Drupal Themes
Download Balsamiq Mockup Drupal Starter Set
- Filefield
- Imagefield
- Add This block
- Content administration
- WYSYWIG-editor with input format
Balsamiq Mockup Components by Boris Doesborg
Download more Drupal Balsamiq Components
and for our open atrium fraction, there is also a layout available
Balsamiq Mockup Layout by Greg Bosen
