ReDsgn

Wireframes

What are they?

Wireframes show a bare-bones sketch of an entire application or web site. They’re intended to communicate preliminary design ideas without getting bogged down in fonts and colors. Wireframes enable the project team to develop common expectations about the project early on.

Who uses them?

Business Decision Makers use them to visualize their requirements and think about what might have been overlooked. They also use them to communicate their plans and gain business-side buy-in.

Developers use wireframes to understand the technical requirements. They’re also a conversation tool with the business when questions arise during the project.

QA Testers use wireframes to write test scripts. Usability Testers use wireframes for task-based evaluations with representative end-users. If the users can’t understand the wireframes, they won’t be able to use the application!

How It Works

  1. Start with requirements. Get 80% of the way there, then bring in a user interface designer.
  2. Develop visuals. The UI designer mocks-up visuals and the project team gives feedback. It’ll take a few rounds to get the wireframes solid.
  3. Start building. During build, issues will come up. Work with the UI designer to find consistent solutions.
  4. Keep things current. As designs decisions are made, update the wireframes. This helps in QA and user acceptance testing.

Getting More Information

Joel Lauman’s Presentation on Wireframing:
http://www.slideshare.net/piksels/wireframes-and-interaction-design-documents-presentation/

The what, when and why of wireframes:
http://userpathways.com/2008/06/26/the-what-when-and-why-of-wireframes/

This post is an edited extract from Leah Buley’s site IA One Sheeters with contributions from Tom Dell’Aringa. I am using the One Sheeter concepts here to showcase what I do as an IA and show examples of my work.

Looking for something?

Use the form below to search the site:

Still not finding what you're looking for? Drop a comment on a post or contact us so we can take care of it!

Find me here!

Social media sites...

Archives

All entries, chronologically...