By Simon Wright
Web sites are built by Web developers, and one of the challenges that business owners face is visualizing how the final Web pages will look before the expense is incurred of building them. The solution is to get wireframes mocked up that will give an indication of the layout of the proposed pages and will enable project stakeholders to comment on their design. Let’s look then at what exactly wireframes are and how they can best be used.
Wireframes explained
Wireframes are just a visual representation of how your proposed new Web pages will look and are often provided using something as simple as PowerPoint. It’s important to note that they’re generally static documents, so any hyperlinks contained on the real pages won’t be active in your wireframe pages. It’s also possible to build more complex electronic prototypes that allow users to click through from page to page. However, such prototypes are expensive to build and most small businesses will find that simpler wireframes will meet their needs better.
The primary purpose of wireframes is to showcase the content, navigational structure, and basic look and feel that will appear on the final Web pages. They usually follow on in the project life cycle from the provision of business requirements and will precede final authorization of the Web page development.
How to create wireframes
In most instances, the task of creating wireframes falls to the company you’re hiring to create your Web pages. However, as a business owner, you also have the option of creating wireframes, and it can be as simple as creating a hand-drawn depiction of the main components that you want on each page. In most cases, however, wireframes will be created electronically and this may involve the use of software packages such as Visio or Photoshop. Each wireframe page should have a reference number so it can be tied back to the submitted requirements, and so that changes can easily be flagged to the designer.
Making the most of wireframes
Wireframes are often used in storyboarding, where companies walk through a series of screens to replicate the customer journey. Indeed, you can also conduct focus groups where you present the wireframes to customers and ask for their feedback. This makes them an ideal way of incorporating feedback into the end design that is implemented.
However, it’s worth stressing that wireframes aren’t necessarily intended to depict the end screens in graphic exactness. Rather, they are a quick and easy (and relatively inexpensive) aid to Web usability. Incorporating wireframes into your development process should significantly reduce the probability of launching pages that fail to deliver either on your stated business objectives or the desires of your end customers. However, the true benefits will be realized only if you’re prepared to take onboard feedback (even if it’s unexpected) and have allowed time in your development cycle to then alter your designs to take advantage of the feedback. For more information, check out 20 Steps to Better Wireframing.
About the Author
Simon Wright works as Mobile Delivery Manager for Royal Bank of Scotland and has extensive experience across ecommerce and mcommerce, including the launch and promotion of Web sites.