Comments are off for this post.

Compare and Contrast – A Technique for Better Specs

SUMMARY

By providing compare and contrast opportunities in our specs, we are infusing ux into the ux/ui hand-off experience.

When we are in the process of providing specs for a product enhancement, the developers are already familiar with the product (assuming they built the original product).

Since they are familiar with the current product, it facilitates their cognitive comprehension of the desired changes if we provide them with a compare and contrast spec that is annotated. The result being that we are working with their current mental model and then gently ushering them into the new design. The annotations help quickly identify the differences. And the side-by-side presentation allows them to

  1. not work from memory, and
  2. be able to quickly identify the differences visually.

Compare and contrast is a teaching strategy employed at all levels of curriculum, since it’s so effective at scaffolding knowledge. By bringing this technique into software development, we can make the process more delightful for everybody involved - especially the engineering staff that needs to interpret the specifications. But similarly for stake holders that need to understand and sign off on designs before they get moved to the development stage.

Since employing this technique in my specs, I find that there is much less back-and-fourth, much less “mansplaining” and simply a lot more calm around the design handoff process. If you haven’t tried it yet, I strongly suggest you do.

Comments are off for this post.

What are Mental Models and How do they Apply to User Experience?

A mental model is a concept in a person’s brain; it’s how they imagine a system works. It’s based on their past experiences and influences how they make decisions in their current experiences. For example, a user that has used a watch will have ideas about how an Apple Watch will work. Additionally, if they’ve used an iPhone to compose a text message using the Messages app, they’ll have a mental model of what the texting experience on an Apple Watch using the Messages app will be.

The challenge we face as user experience designers is achieving an interface that matches a user’s mental model; that way there won’t be a disconnect between how the user imagines the interface will work, and how it actually works.

Referring back to our Apple Watch texting app (Messages), we have to respect the work that Apple did on making the watch app be intuitive. They designed an app that barely works like any app users have interacted with before - and only kind-of-like the iPhone Messages app. To use the iPhone app, a user types out a message on a digital keyboard on their phone or iPad. However, on the watch, there is no digital keyboard - so the user has to figure out how to use the app in a different way.

And yet, the design Apple has implemented does seem to align itself with user’s mental models. Personally, when I approached the app for the first time, I realized that I had 1 option to get started: I had to do a “long-press” action. At the time, long-press was pretty unheard of and not yet a convention I was accustomed to doing ever, on any device. But Apple had successfully onboarded me as to how that gesture would be an option at times. So even though there is no indicator in the Messages list view, I intuited that I should try that gesture. And I was rewarded by the succeeding steps in the flow. Apple has applied other common patterns that help first time users adjust to the new interface, such as graying out the send button until a recipient has been chosen and a message has been composed.

Summarily, user experience designers can apply the lessons Apple has applied to their Watch design when designing our own experiences. Personally, I’m a huge fan of the grayed-out button pattern and apply it regularly; similarly, onboarding is vital for innovating. In my app Eat Sleep Poop, I saw a big jump in user retention after improving my onboarding screens to better communicate the innovative pattern I’ve implemented on the app’s home screen.

Related Articles:

  1. The Secret to Designing an Intuitive UX, by Susan Weinschenk, Ph.D.
  2. Mental Models, by Jacob Nielsen