If you are still making plain old static wireframes, it's time to start adding life to them: a clearer understanding of your project's flow will save you time and money later.
As you most likely know, wireframes are black-and-white box drawings that describe a screen (be it a web page, a mobile app, or anything else that needs to be laid out and designed). Traditionally, wireframes are created in the design process to show the client the functionality, process flow, and general layout of the application before the designers and developers go to work implementing the idea. Wireframes are great because they are easily changeable and help the client get a "hands-on" feel for what we are building so there will be no surprises once the system is built.
The only real drawback of wireframes is their implicit static quality: they tend to exist on a sheet of paper. In this day and age in which in-page interactivity has become the norm, and when some processes happen over a series of pages/screens, simple wireframes fall short. They traditionally aren't good at letting the user "feel" the application, and only trained eyes are really good at following wireframes across multiple pages to get a feel for where the eye goes as pages refresh during a specific task.
For the last 12 years, my company has used "interactive wireframes" as part of our design process. These have traditionally been simple HTML pages that contain graphic versions of the mockups, and use image-mapped hotspots to let the users click around. Sometimes we'll create full HTML versions instead of use images if the interactivity is easier shown in HTML. While this is a time-consuming task, interactive wireframes give our clients a much better sense of what the finished application, site, or process will feel like.
Recently, an iOS app called POP (short for Prototyping on Paper) was released that is the perfect tool to help us (and you) make this interactive wireframing task that much easier. The tool is simple: snap photos of your wireframes and link them to each other using rectangular hotspots. You can then walk through your prototype and click around as if it were a real application.
Of all the rapid prototyping tools we've tried, POP is certainly the easiest. But it's not without some major drawbacks. At the moment it is really geared toward app development, and when you share the prototypes, the screen shape/size reflects that of an iOS device. The system shows prototypes via any web browser, but puts an iPhone frame around the prototype. This makes the app unrealistic to use for any professional purpose beyond iOS prototyping.
It is my hope that the makers of this app will realize that its potential uses go far beyond mobile apps and they expand this to allow for full-page prototypes for regular websites.
Until then, we'll continue making our interactive wireframes by hand. If you are still making plain old static wireframes, it's time to start adding life to them. The ROI is simple: a clearer understanding of your project's flow will save you time and money later, as there will be no surprises in the development phase. Plus, clients like to interact with the work, and letting them do this in the wireframe stage adds to your wow factor, and gives them something more tangible to understand.
Until next time…
Editor's Note: As 2013 comes to a close, we feature our columnists' most helpful resources from previous months. This column was originally published March 29, 2013.
What's New for 2015?
You spoke, we listened! ClickZ Live New York (Mar 30-Apr 1) is back with a brand new streamlined agenda. Don't miss the latest digital marketing tips, tricks and tools that will make you re-think your strategy and revolutionize your marketing campaigns. Super Saver Rates are available now. Register today!
Jack Aaronson, CEO of The Aaronson Group and corporate lecturer, is a sought-after expert on enhanced user experiences, customer conversion, retention, and loyalty. If only a small percentage of people who arrive at your home page transact with your company (and even fewer return to transact again), Jack and his company can help. He also publishes a newsletter about multichannel marketing, personalization, user experience, and other related issues. He has keynoted most major marketing conferences around the world and regularly speaks at Shop.org and other major industry shows. You can learn more about Jack through his LinkedIn profile.
Singapore, 3-4 November
Hong Kong, 8-9 December
Hong Kong, 8-9 December
Google My Business Listings Demystified
To help brands control how they appear online, Google has developed a new offering: Google My Business Locations. This whitepaper helps marketers understand how to use this powerful new tool.
5 Ways to Personalize Beyond the Subject Line
82 percent of shoppers say they would buy more items from a brand if the emails they sent were more personalized. This white paper offer five tactics that will personalize your email beyond the subject line and drive real business growth.
December 9, 2014
1:00pm ET/10:00am PT