It all starts with a wireframe. However you make them—with a sharpie or Omnigraffle—wireframes help you create products, applications, and experiences that aren’t just user friendly but are also truly engaging.
At Language in Common, when we’re designing websites, applications, user experiences and the like, we always begin with the wireframe. We start here because it’s a super quick way to imagine, conceptualize and design a holistic user experience that not only benefits future interface design challenges but also begins—at the concept level—to create a final product that people actually want to use. We happen to be big fans of doing it (heh) with a sharpie because it makes the prototyping process faster, more iterative, and more collaborative—always good things when it comes to designing for usability.
Here are some resources to help you get the most from wireframing:
Wireframes Magazine: Covers a variety of topics related to wireframes and template tools, with respective sections for wireframe samples, UI tools, templates, and reader sharing.
Get Wireframing: The All-In-One Guide by Designer Grace Smith: Comprehensive list of techniques, tools, articles, etc.
20 Steps to Better Wireframing: Helpful step-by-step guide that breaks down a basic wireframing process.
Sketchy Wireframes: A look at computer-based sketchy wireframes.
The 7 Wonders Of Wireframes: A quick look at the benefits of hand-drawn (vs HTML) wireframing.
Thanks to Katharine N. for the post and tips!