* Fidelity
The term fidelity describes the level of detail of your deliverables. Low-fidelity deliverables are a rough approximation of the intended user experience. They’re quick and dirty, capturing the essential characteristics of the site. High-fidelity deliverables give a more accurate representation of the site, including not just core features but also specifics of the site’s behavior and even aspects of the final visual design.
The right fidelity for your deliverables will depend on your project. Before talking about that decision, let’s look at how fidelity affects the tools and techniques you use (and vice versa), and which fidelity is most suited to which deliverables.
Low Fidelity
Low-fidelity tools are increasingly popular in UX design. With no technical knowledge required, you can create lo-fi deliverables with very little fuss.
Pen and paper deliverables are extremely versatile: you can use them to produce almost any deliverable, from sitemaps to wireframes and even paper prototypes. Hand-drawn deliverables are very quick to produce and easy to improve upon, but production time will quickly mount up if you need to redraw the same elements over and over again.
Low-fidelity deliverables don’t make for good formal documentation, but they’re ideal when you need to convey decisions quickly. In Chapter 3 we explained how to use a detailed sketch to convey an idea; the hand-drawn wireframe uses the same techniques and tools but offers more detail, proposing a solution rather than exploring a concept. It includes annotations that explain the major components of the page and how they work together.
Paper prototypes are an easy way to test complex systems without the time and expense of making a digital prototype. Use sticky notes to represent panels that open and close, use overhead-projector transparencies for pop-up windows, and cut out your navigation and tape it to a background “master” so you don’t have to recreate it on every page. Paper prototypes need someone “behind the scenes” to operate the system based on the actions of the user: opening dropdown menus, entering data, and so on.
Medium Fidelity
When you need more detail than a sketch, it’s time to pull out the professional tools. Although they demand more investment of time and money than a simple sketch, they provide professional output and the flexibility to make changes without having to redraw everything from scratch.
If you want to create a family of deliverables with shared elements, you’ll immediately benefit from being able to copy and paste elements between documents. Many of these tools offer sophisticated functionality such as master layers and shared libraries, allowing you to create your own collection of templates and stencils to reuse across projects. If you’re producing lots of deliverables, this efficiency alone is probably a good enough reason to adopt medium-fidelity tools.
Professional tools let you export to a wide range of formats including graphics files, PDF, and even HTML, making it easy to share your deliverables with stakeholders across the world.
The medium-fidelity wireframe , created using the Omni Group’s OmniGraffle software, shows a page with placeholder images and annotations.
If you want to demonstrate basic interactivity, you can also use medium-fidelity tools to create simple clickable wireframes
Presentation tools like Keynote and PowerPoint, although not specifically designed for creating design mockups, make this surprisingly easy. Keynote in particular has several built-in motion transitions that mimic the visual behavior of interactive web applications.
Dedicated tools like OmniGraffle, Visio, and Fireworks include basic prototyping features and can easily be extended with shared libraries and stencils.
High Fidelity
If your product includes particularly nuanced interactions, or you need to include significant visual detail, you should create high-fidelity deliverables. In the UX world, this high level of fidelity usually means creating a prototype.
Specialist prototyping tools such as Axure can reduce the steep learning curve often associated with high-fidelity prototyping. Like some of the medium-fidelity tools, these specialist tools provide a WYSIWYG interface and generate functional HTML to allow your prototype to run in a browser.
Alternatively, you can get your hands dirty with HTML, CSS, and JavaScript yourself . This can be daunting, but fortunately there are a number of libraries and frameworks that can reduce the legwork involved in layout, cross-browser compatibility, and interaction.
Choosing Fidelity
A useful principle for undercover work is to adopt the lowest fidelity necessary to get the job done. What you lose in detail you’ll gain back in time and effort. However, the most appropriate level of fidelity for your deliverables will depend on several factors.
Audience
Your deliverables should be tailored for your stakeholders, so that you don’t underdeliver or waste time that you could use elsewhere.
Stakeholders will have differing needs from your deliverables; specifically, they’ll need enough information to do their jobs. For example, product owners will be eager to see whether solutions meet business objectives. Content specialists will want to know what copy needs to be created and where it should go. Developers will want to learn about required functionality.
In some instances, you’ll be able to provide further detail and clear up ambiguity with a discussion. There’s no point creating glossy deliverables for the person sitting next to you; sometimes, a simple picture and a conversation is all you need to get your message across.
Also consider what you learned in your cultural analysis of the organization. Some stakeholders will respond better to high-fidelity deliverables, whereas others will be happy with a sketch of the essentials.
You may be able to create a single deliverable that covers these diverse needs, or you may need to create a couple of versions to explain relevant items in more detail. Just remember that extra deliverables take extra time to create and maintain.
Finally, if you plan to conduct usability testing with these deliverables, you should use a higher-fidelity method, although this will also depend on the goal of your testing. Medium-fidelity deliverables might suffice for simple tests of basic elements, but for subtle interactions or those that will depend on particular content, a high-fidelity prototype is ideal.
Time
As an undercover UX designer, it’s better to work on the design than create beautiful deliverables. While this clearly implies that low fidelity is desirable, you must find the balance. Too much haste will lead to ambiguity or confusion, meaning wasted time revisiting your deliverables or clarifying the situation. If in doubt, use the tools with which you are most comfortable.
You can reduce time pressures if you can take advantage of other resources. Could you convince the business to let a willing developer convert your sketches into a high-fidelity prototype?
Life span
Most deliverables are made obsolete when the site goes live, but until that point remember that every deliverable you create will have to be kept up-to-date. This can be especially time-consuming if you’re creating several types of deliverable.
Scope
How much of the site experience do your deliverables need to capture? A sitemap and handful of wireframes that capture a single user journey may provide enough detail for your team, or you may need to depict lots of journeys and permutations. Be careful not to overcommit. Let your scope and fidelity be guided by what you can realistically achieve.
Innie or outtie
Outties—external agency staff or consultants—typically have to produce higher-fidelity deliverables than innies. Deliverables will usually form part of an agency contract, and can be the only way for the client company to assess the quality of thought and work they are getting for their money.
Agencies may have agreed formats for deliverables; be sure to match these to reduce the risk of wasted work.