Make Prototyping Less Painful With These Tips

Ask any software project manager about their project management techniques, and you’ll probably get lean or agile development as the answer. The philosophy that “an imperfect something is better than a perfect nothing” is a great way to get the ball rolling on complex projects, however, it’s also caused many programmers to ignore UX when building the foundations of their products.

UX used to be the divide between designers and developers, however, lean principles enable designers/UX professionals to keep pace with agile development cycles.

Lean Principles for UX Design

Last year at a Stanford Igniters meetup, Laura Klein, author of UX for Lean Startups: Faster, Smarter User Experience Research and Design, gave a presentation on using data to improve product design processes. When you’re prototyping your products, you need to understand the what (quantitative data) and why (qualitative data) of user actions. The best way to develop your product is to create a series of problem solution hypothesis as you’re developing your products.

For example, if customers are leaving your checkout because they can’t find a promo code, you could try removing the field entirely. Why do this? Because you feel it will increase conversions.

Of course, if you’re wrong, this can result in a decrease in sales. By using A/B tests, funnel analysis, and repetitive qualitative analysis, you’ll have a better idea of the direction you should take.

Nevertheless, there are still a few limitations to these principles. Analyzing data isn’t going to:

• Replace your graphic design team
• Eliminate the importance of user feedback to refine your product
• Tell you what you should be building (i.e. indicate product-market fit)

Stop using wireframes

Back in the days of static websites, (well, slightly after the GeoCities era) wireframes were the definition of rapid prototyping. UX specialists simply sketched out designs, presented them to users, and then adjusted the designs based on user feedback. Over the past few years, web development has gone from simply creating pages in Dreamweaver to creating desktop-like applications which run in the browser.

The biggest drawbacks to wireframes include:

• Ambiguity: Since designers have to describe functionality rather than actually showing it, each user is going to have different interpretations of your product’s functionality.
• Death by documentation: The revision cycles of hand drawn wireframes drag out the design process and can lead to project termination.
• Switching modes: Converting a paper design to a digital layout can lead to unplanned changes. By doing all your work digitally, you can ensure that your proposed design is feasible.

Types of Prototypes

Low Fidelity

When you’re first starting out, low fidelity prototypes enable you to show concepts, design options, screen layouts, and other high-level components of your project. The primary advantages of this process are the emphasis on usability rather than being distracted by bells and whistles. Since the designs are done on paper, they’re easy to create.

These prototypes can be created by anyone regardless of their technical expertise. Although simple, they allow you to gather precise insights from the target audience rather than you having to play guessing games to find their needs.

High Fidelity

High fidelity prototypes require a bit more time and effort, however, they ensure that different departments are on the same page. The interactivity of these prototypes enables you to have accurate research which isn’t matched by low-fidelity prototyping.

Aside from helping with cost estimates, you’ll also be able to spot bottlenecks and user issues before you move too far in your project development processes. Frameworks such as Bootstrap and Origami can help make the process easier.

Improve your prototyping workflow

Even after your project goes live, you’ll need to ensure your website is always meeting the needs of your visitors. Focus groups and user interviews can only provide a small sample of information. If you’re looking for an accurate picture of your website in action, Google Analytics provides valuable insights. The biggest value add from this process is being able to view user behavior flow across your website.

Whether you’re trying to see why users don’t complete your checkout, or you’re trying to see why conversions are low, Google Analytics can provide the insights you need to improve operations.

Regardless of the approach, you take with your UX design, you need to make sure that you’re testing your concepts from multiple angles and that you’re able to adjust the design to fit your user needs.

Implementation strategy is the difference between success and failure in the product space. In order to maintain a rapid development process, make sure you’re working closely with your development team and that everyone is on the same page throughout the project.