Code: Prototyping

Throughout my career as a user experience designer, I have continually asked myself three questions:

• What should my deliverables be?
• Will my deliverables provide clarity to me and their audience?
• Where do my deliverables and other efforts fit within the spectrum of UX design?

I have found that, if I do not answer these questions prior to creating a deliverable, my churn rate increases and deadlines slip.

When attempting to answer the third question, I use a framework I discovered early in my career: The Five Competencies of User Experience Design.PDF This framework comprises the competencies a UX professional or team requires. The following sections describe these five competencies, outline some questions each competency must answer, and show the groundwork and deliverables for which each competency is responsible. Read More

This is a sample chapter from Ben Coleman and Dan Goodwin’s new book Designing UX: Prototyping. 2017 SitePoint.

Chapter 7: Building HTML Prototypes

When we say HTML prototypes, we mean a Web site comprising HTML markup, CSS for presentation, and JavaScript for additional interactivity. It may be a simple HTML Web site, or a Web site that runs on a framework or content management system (CMS).

This chapter is not a detailed step-by-step guide, nor will it teach you how to use HTML, CSS, JavaScript, or frameworks. It aims to help you understand all the options for creating HTML prototypes and their benefits. You’ll find out what’s needed to get started, and gain some guidance on how to approach creating an HTML prototype. We’ll also include some real-life prototyping case studies from some of the projects we’ve worked on at fffunction.

After reading this chapter, you should be able to make an informed decision as to what approach will suit you and your project. Read More

Because user research studies peoples’ behavior, the most effective research techniques involve observing participants doing things and talking about what they’re doing. Research that focuses on opinions and discussions of behavior in the abstract isn’t as useful, because it’s difficult for people to talk about their behavior out of context or to evaluate a design without using it. Therefore, the best way to evaluate a new design is to create a prototype and give participants something concrete to interact with and react to.

However, there are some differences between testing a prototype and testing a fully functional Web site or application. In this column, I’ll provide some tips that can make your usability studies more successful and help you to avoid problems when testing prototypes. Read More