- The Role of Deliverables
- * Design Deliverables
- * Fidelity
- * Better Deliverables
This chapter is from the book
This chapter is from the book
This chapter is from the book
* Better Deliverables
There’s no perfect way to make deliverables; the best approach depends on the project and your personal style. However, since an undercover designer’s deliverables will be central to the case for UX, here are some tips on how to get the most out of them.
Try Everything, Master Something
Try out various tools to develop your proficiency and appreciate which of them are best suited to which deliverables. Most of the software listed in this chapter has a free trial version, so get downloading and experimenting.
You’ll probably find that one tool suits you better than the others, or perhaps you’ll be limited to one application since that’s all that your organization can offer. Take the time to learn the nuances of that tool and become a real expert in it. Keyboard shortcuts will save you hours, as will learning how to create master templates and stencil libraries.
The largest risk with this approach is that you’ll fixate on your chosen tool as the only appropriate answer to every problem. Be sure to choose your weapon based on the problem at hand, not just on whatever’s most comfortable.
Consult Design Pattern Libraries
A pattern library 
documents effective solutions to a common problem. Each pattern explains the problem, the proposed solution, and the context
in which the problem occurs.
)
As users have become more familiar with the web, standardized approaches to targeted problems have begun to emerge. Pattern libraries document these designs, and detail the rationale behind them.
Design patterns won’t make your design decisions for you, but they can be a shortcut past some of the legwork you’d otherwise have to do yourself. They can save you time and reinforce your decisions with the knowledge that others have successfully tested these approaches over the years.
However, be careful not to apply patterns blindly. A design that works elsewhere isn’t guaranteed to work on your site, and a subtle difference in requirements can render an approach invalid.
Build a Personal Library
As you gain experience, you’ll inevitably build up a set of stencils, shapes, and templates that suits your style. By continually tweaking the set and making it your own, you’ll end up with a set of tools that can act as your own artist’s palette.
Similarly, you’ll subconsciously build your own library of design patterns that work well for specific problems. Take the time to build these into a design pattern library of your own, and you’ll find yourself becoming more efficient, focusing on your design rather than the tool you’re using.
If you’re on a team, share these stencils, templates, and design snippets on a shared drive or intranet. If you’re prototyping in HTML, ask whether your developers have a library of code snippets that can save you coding time.
Learn HTML and CSS
While we’re on the topic, since HTML and CSS are the media you work in, learn them. Just as a composer must know the range of each instrument she writes for, learning HTML and CSS will help you truly understand the possibilities and limitations of web technology.
The fundamentals are surprisingly simple and take only a couple of weeks to pick up. Don’t worry about advanced tricks, but learn enough so that you would know how to start coding your wireframes. Not only will HTML and CSS give you another viable prototyping option, but also they will improve the quality of your designs and help you communicate better with your developer colleagues.
Identify Key Pages
Each site has a couple of pages that lie at the heart of the user experience. For example, the photo-sharing site Flickr centers around just two key pages: the photo page and a user’s photo stream. Without these, the hundreds of other pages on the site could not exist.
Make key pages your top priority since their structure and design will affect the rest of the site. You should already have a hunch about which pages are key—your sitemap and design principles will often help to highlight them. Give key pages the attention they deserve, and your site’s user experience is off to a great start.
It’s rare that the homepage is a key page. Although it’s an irresistible draw for stakeholders, the homepage’s main job is usually to direct visitors to the key pages. Designing a good homepage is easier once you’ve defined the core essence of the site; as such, consider leaving it until later.
Get the Main Function Right
Similar logic applies within a page. It’s better to get a page’s main function absolutely right and forget about the rest, than to spread your effort thinly. It’s easy to lose sight of what really matters when your head’s full of competing requirements. If you find yourself struggling, break the problem down. What is the one thing this page needs to accomplish? Forget the secondary content—sidebars, footers, and so on—and focus on the core.
Explore as you go
Although you’re starting to converge toward a final design, don’t be afraid to explore new alternatives as they crop up. You can use any of the techniques discussed in Chapter 3.
The line between generating ideas and refining them is blurry. It’s OK to switch between the two modes, although in later stages you should focus on polishing the details rather than generating additional ideas.
Consider the ‘First-Run’ Experience
Pay special attention to the user’s first experience with your site. Is the site clear about what it does and how it should be used? It’s easy to neglect this state if you’re short on time, but even though a user may only see this state once, the first experience forms the important first impression.
If you’re designing a site that relies on user-generated content, remember to design the “blank slate”: how the page will look without this content. A design that seems active and useful once it’s full of content can appear imbalanced and deserted without that content. Provide direction and incentives for users to contribute so that the site’s emptiness doesn’t appear intimidating.
Use Real Content
For years, UX designers created wireframes and prototypes with “lorem ipsum,” dummy text indicating that the real content would follow later.
Designing around dummy text means that you have no way of knowing if the main visual focus of the page matches the main written focus of the page. Without knowing what’s on the page, you may leave too much space, or too little. Dummy text also means you can’t run valid usability tests on the system, since real users will want to read the text and look for trigger words.
Use real content wherever possible. If the content is unavailable, outdated, or being rewritten, talk with your content providers about the contents of the page, what its features are, how long it is, and what the main focus and calls to action should be.
As an undercover designer, you may have to use lorem ipsum if you don’t have access to content providers. However, aim to replace it with real content—even a first draft—as soon as you’re able. Only then will you be able to judge whether the design and content together meet your users’ goals.
Come Up For Air
Creating deliverables can be enjoyable, but be careful not to drown in detail.
A simple and effective way to avoid losing focus is to build regular peer review into your routine. We’ll cover formal critique in the next chapter, but before that point, consider whether you can share work in progress with close coworkers who are sympathetic to the UX cause. This could be something as simple as an impromptu discussion: simply print out your designs and take them to your colleagues for their thoughts. If you find yourself stuck on a problem, a few minutes spent describing it to colleagues can force you to focus on the heart of the issue.
A more advanced form of peer review is pair design, where you and a colleague work on a design simultaneously at one desk. Pair programming, the developer equivalent, is common within Agile environments (see Chapter 6, “Working with…”), where it’s used to improve quality and create easily maintainable code. Applying the same technique to UX design can drive up the quality of your work and help colleagues buy in to your recommendations.
Although it’s common for UX designers to conduct pair design together, you can partner with anyone involved in the project: developers, visual designers, content specialists, and so on. If you’re using software while pair designing, let one person “drive,” sitting at the computer, while the other provides input and suggestions. Swap every hour or so to keep things fresh.
Of course, pair design takes two people, so it can be tricky to arrange. However, it will teach you a great deal and can help build strong relationships.