When we plan an app, we do more than figure out what screens to build. We think about every interaction that end users have with the app and the brand, including email and Twitter, tasks and goals, and in shopping sites purchased product delivery and returns. The entire experience.

We call diagrams of these interactions touchpoint maps. They're an important means of discovering the problems we'll solve with individual screens in later phases of the design process. Here's how to use touchpoint maps to plan successful products from users' perspective.

Touchpoint maps chart customer interactions

User interface without context is just a bunch of screens. There's no flow — it's all business goals, which doesn't help customers. Touchpoint maps help us discover the problem we're trying to solve at individual interactions users have with our products or brands.

Start by role playing a user

Ignore the app for a minute. What are you trying to help users do? Perform work? Share information? Look something up? During the opportunity phase of a project we consider everything that a user wants to accomplish in real situations. It's not about the app — it's about accomplishing something in real life.

Write those points on a timeline

Make a horizontal line with points that define each step in the experience. In business parlance, that would get organized into three broad groups:

• Lead Generation: The practice of earning people's attention and inquiries.
  
• Acquisition: Turning that interest into a positive relationship and conversion.
  

Retention: Turning current customers into repeat customers.

Mark the first point as the user realizing they want to do something — learn more, sign up, have a gripe, etc. The idea that the brand will solve their problem is what sparks their first conversation, whether it's online or otherwise.

What follows are more interactions between customer and the brand. In this case, the map follows the story of a customer trying to find home furnishings that matches their style. The "compare options" part of this timeline follows them as they browse the brand's website until — one would hope — they reach a product detail page.

Sure, we're building a website. But in general, each point in the timeline indicates when the user talks to, sends information to, or gets information from, your brand. For online processes, that means how and why they click through a site. But we're always thinking about things from the customer's point of view. They're not here to use a website. They're trying to find a sofa that matches their carpet.

No touchpoint map is complete without the end result — and we don't mean a customer pushing the "buy now" button. In this case, does he or she feel confident they're making the right purchase? Do they trust the brand enough to give out their credit card details?

Above: A complete touchpoint map follows a user through their expected path while redecorating their home. That includes their discovery of the website, their browsing experience, and the complete checkout process — and don't forget notes about their questions and concerns along the way. That's critical.

Motivation and mood drive each point in the story, so at each point we jot down exactly that: the users' feelings and needs. From there we can decide which psychological triggers to use to keep them engaged. For example, if they feel confused, we could use certainty. If they are not sure, we could use authority or social proof.

A note about style

• We use dotted lines to show non-continuous experiences — whenever the user might go somewhere. Maybe they'll proceed from their shopping cart to checkout, for example … or maybe they'll keep shopping.
• Solid lines show routes that we're reasonably sure that users will follow. Sure, there will be edge cases, but for the most part people we expect people to follow solid lines from point to point.
• We use highlighters sparingly, if at all, to highlight points of friction for our customers. The more they're used — the highlighters, that is — the less value they have.

---