The 12 steps to shaping a compelling UX
The 12 steps to shaping a compelling UX
By Stephanie Oley
Good user experience (UX) lies at the heart of every great customer experience. Think of a mapping platform that suggests short-cuts for drivers in peak hour, or flat-pack furniture that can be assembled with just an Allen key. Convenience aside, good UX imparts a sense of wonder, making a product or service enjoyable to use. For example, the predictive typing on your smartphone, or the way a Swiss Army Knife delivers so much in such a small format.
Needless to say, good UX is big business. In their 2018 report The business value of design, consultancy McKinsey found that well-designed companies outperformed non design-led firms in the market by as much as two to one. And no, McKinsey weren’t talking about firms with cool logos. They meant the ones that had a seamless delineation between their products, information, services and systems.
UX is a holistic problem solving experience
If you’ve been trying to build this capacity among your team, then you’ll know that UX is a holistic problem-solving exercise. It touches on a number of disciplines – not just design. (Read our related story, ‘The difference between UX and UI’, for an introduction to some of them). In loose order from start to completion, here is what CCE’s resident UX experts consider to be the main steps.
1. Thorough background research
This step can involve desktop research, such as drawing insights from published reports and studies. It can also include original research such as surveys to get a sense of user pain-points, or social media searches to understand user opinions on a product or service.
2. Meaningful user interviews
Few steps will deliver as much insight as a direct conversation with the people who use the product. Your questions should include what they do or don't like, what they'd like to have and other things. You can hold interviews individually or in large focus groups.
3. User journey map
Another valuable part of the research phase is creating a user journey map, which labels the steps a user might take between being a potential customer, and buying the product or service. It should also show post-purchase actions, such as signing up for newsletter updates or participating in loyalty programs.
4. Clearly defined workflow diagram
A workflow diagram labels all the steps the developers must take to create a smooth user journey. It shows which staff will perform what specific task, when they’ll do it, and what comes before and after it.
5. Alignment to customer personas
Who is the ideal user of your product or service? Describe their qualities in a customer persona, a document that compiles features typical of your target customer. Give your persona a fictional name, profession and lifestyle. For example: Jake, the university student who watches sport on YouTube and likes beer; or Alicia, a professional in her late 20s who only uses her car for commutes, and prefers Uber for social activities.
6. Stakeholders engaged throughout
Throughout the UX development process, you’ll need to consult regularly with people in various roles: investors, technical team members and others. Don’t try to hold back your ideas for a big ‘reveal’ at the end. Share any major milestones or setbacks early, and resolve any challenges by drawing on the valuable insights of other project team members.
7. Staged presentations
As part of your stakeholder engagement, a well-timed UX presentation will help share your draft recommendations in an easily digestible format. You’ll find various free templates online to help shape your response to complex questions. For example, is the current user journey broken, does a feature need to come out of hiding, or have you resolved a critical problem? Your presentations will help get team members on board with your ideas.
8. Lo-fi wireframes
In web design and app development, a lo-fi wireframe is the first representation of what users will access. It’s a simple 2D sketch highlighting the major elements and information, such as search fields and calls to action. It’s usually executed in greyscale and without any real content. Richer details are shown later, in a clickable and responsive hi-fi wireframe, once the team agrees on the ideal information flows.
9. Design collaborations
Only now are you ready to establish possible designs for UX and UI elements and sub-elements. Again, collaboration is key, given the relationships between all the moving parts of your project. Each team member should know exactly how their role influences their colleagues’ work, so the overall product is cohesive.
10. Hi-fi prototypes
Once the basic concept is approved, get all parties aligned with a hi-fi prototype of the website or app. This realistic prototype will usually include on-brand fonts, colours and content, as well as interactive features such as clickable buttons, drop-down menus and background motion graphics. A hi-fi prototype is a critical step to take before building the website or app.
11. Rigorous user testing
Next, test the hi-fi prototype with real-life users. You can offer it to a select group or the general public to see how its performance holds in maximum loads. Make sure to elicit plenty of feedback during this phase, either through behind-the-scenes analysis or user surveys.
12. Hundreds of iterations
Through your findings from the user testing stage, you can progressively tweak the product and gain more feedback on any updates. After multiple more iterations, you'll have most of the necessary changes made, and the UX will have matured into something you can comfortably offer for a while.
The groundwork for achieving smooth UX is laborious, but the business results are worth it. Get your team aligned on the fundamentals of smooth UX, and be prepared for a fascinating journey into the current limitations and future potential of your product.