UI/UX Principle #8: Build User Stories to Drive User Flows
What Story Do You Want Your Product to Tell?
A huge component of UI/UX Design is storytelling. In the tech world, it’s easy to get carried away with focusing on what innovative features your product offers. While that is an important part of figuring out how to situate your product in a unique context, to create lasting buy-in you need to identify what type of journey your product will take users on and who will be the key protagonists who use it.
On Boost New Media’s website, the authors provide a definition of user stories:
“A user story is a short description of something that your customer will do when they come to your website or use your application/software, focused on the value or result they get from doing this thing [ . . . ] A user story is usually written using the format canonised by Mike Cohn: As an [actor] I want [action] so that [achievement]. So, for example: As a Flickr member, I want to set different privacy levels on my photos, so I can control who sees which of my photos.”
The 1) User and the 2) Story are essential to Good User Stories
There are a multitude of ways to craft your own user stories, but they are best when there is a person (or user) involved in the story. Adding the action or task and the perceived result, benefit, achievement and/or frequency helps create the narrative.
In the Fresh design process – after spending valuable time getting to know stakeholders, their business objectives, the functional requirements for their desired product, and the technical constraints they might face – we proceed to user research.
One of the most important aspects of user research is understanding at a deeply empathetic level the people who will actually be using the product. Fresh does this by building personas from the user research and then placing those personas into the user stories based on the real-life experience of the user base. User stories, in our model, are all about understanding the different goals, needs, or tasks that the user base might have. We focus on the behavior a product will exhibit in response to user input. The process, cost (in terms of both time spent by the user and money spent by the company to create the system), and complexity of a system are also analyzed to discern whether a design proposition is feasible.
While there is an abundance of creativity involved in crafting user stories, exercising narrative creativity is not the emphasis – rather, the focus should be on bringing your target users to life in a way that fosters empathy from designers who then delve into the more technical aspects of design; namely, information architecture and user flows.
In agile design environments, there are strict deadlines, quick windows for turnaround, and a demand for consistently produced deliverables. But the glory of user stories is that they are written in narrative short form and can be produced relatively quickly, right on the tail end of the initial user research.
Drive “User Flows” for Conversion and Usability
On ConversionXL’s website, the authors provide a definition of user flows that matches Fresh’s perspective on the design principle. One of Fresh’s essential offerings is design solutions that make your application more efficient or that increase your website “conversion”–that is, converting site visitors into customers.
The authors describe how conversion relates to the creation of user flows:
“In order to maximize your conversions, you have to get the user flow right – build one that matches users’ needs [ . . . ] Your primary aim is to fulfill the business objectives (either your own or the one set by your client). Business objectives might be getting users to sign up for something, getting people to purchase products or join an email list [ . . . ] People don’t just come to your site, and right away do what you want them to do. In most cases, they need to go through a set of steps leading up to the action.”
In this series on UI/UX design principles, we’ve repeatedly referred to the psychological underpinnings of design – that is, Fresh’s commitment to working tirelessly to develop a scientific understanding of the creative ways that designers can help bridge the gap between the human brain and the digital product. The authors from ConversionXL cite the work Mihaly Csikszentmihalyi, a Hungarian psychologist, who studies the psychological phenomenon he defines as “flow”:
“It’s a state of being that makes an experience genuinely satisfying. Everybody has experienced it. Most people refer to it as being “in the zone” or “in the groove” [ . . . ] Ideally your user flow helps to nurture the flow experience in your users [ . . . ] When the smooth path is interrupted, or something doesn’t seem to fit, users notice and the flow is broken, which means that the experience is also momentarily broken. These small episodes of friction are cumulative.”
If one of your primary business goals is to maximize efficiency or increase conversion, avoiding friction is imperative. What if you could provide a frictionless experience that allowed users to achieve their goals while acting within their ideal state of being “in the zone”? What if you were given the guarantee that meticulous research and testing had been done to ensure that a design proposal was finalized in anticipation of all the possible scenarios in which a user would engage with your product?
That’s what the design process is all about – creating user stories that drive an ideal and uninterrupted user flow.
Creating user stories allows Fresh designers to imagine a variety of forms the design could take in response to users’ needs, and also, to imagine different scenarios in which the user would interact with any one variation of a given design. By outlining all of these possibilities in discrete detail, our team is able to progress toward making the connection between how the user story will drive the user flow, and optimally, how the user flow will then lead to maximum efficiency and conversion.
Achieving a State of “Flow”
A user flow, in Fresh’s process, is a diagrammatic representation often tied to wireframes that show the steps in screens or elements illustrating how a given user story is resolved. It can reveal ease of use and all the possible points of entry for how a user would navigate through a given situation. Without first writing detailed user stories, it would be impossible to design representative user flows that indicate whether the journey is successful.
Ease of use and navigation lead to a state of flow, and an optimal state of flow leads to conversion. If this is your business’s goal, then spending time creating user stories and their visual representation in user flows is essential.