Experience Focus

To create impactful experiences, focus on the following three categories: Brilliant Basics, Extended Experiences, and Signature Moments.






User Stories

As a [target group]
I need / want / expect to… [action – what does the user want to do?]
So I can… [outcome – why does the user want to do this?]

User Stories are the needs that a user has of a product or service expressed in a simple natural language format, from the perspective of the user. A product or service must satisfy these stories for the user to get the right outcome for their task.

They are ushually grouped into features, epics, and sometimes initatives to create structure and allow for easier planning and recognition.

User Stories Resources User Stories Workshop

Group and prioritise user stories and needs via this 2 hour workshop.

MIRO User Story Map Template ↗

User story mapping is an Agile approach for feature planning.

User Story Excel Template ↗

A boilerplate structure for creation of a set of user stories.








Brainstorming

By using creative ideation, you can explore many options which solve unmet user needs or user stories. This is best done in a team of 2 or more people

Brainstorming can take different forms depending on the scale of solution you are looking for:

Ideation methods, like the ones listed on the untools.co website below, will help any stage of brainstorming and ideation, as they help you apporach the issues from different viewpoints and mental models.

Ideation methods: untools.co - Tools for better thinking ↗
Collection of thinking tools and frameworks to help you solve problems, make decisions and understand systems.
Brainstorming Resources 20 Online Brainstorming Techniques ↗

Brainstorming techniques and frameworks you can try on your own or with your remote team.

MIRO Concept Cards Template ↗

Updated/streamline based on previous work Concept cards are short elevator-pitch style page which summaries concept solution in high-level detail.






User Flows

A user flow visually maps a user journey step by step, documenting all actions, pages or elements a user could interactive with to complete a task. This mapping allows for discovery of previously unknown steps or edge cases and helps present complex journeys to stakeholders.

Depending on the detail or complexity of your project, you could create a single large user flow to map all posibilities, or many smaller user flows to focus on individual journeys. Depending on which approach you take, you may also decide to focus on a detail level by creativing either task flows or wire flows.

Task Flows vs. Wire Flows

Task flows

This variation captures the highest level user actions when completing a task. Depening the detail level task flows can include overall steps, page-by-page journey or individual tasks.

Source: 101 Guide to Creating User Flow Diagrams, creately.com

Wire flows

As the name suggests, this variation maps user flows on either low or high fidelity wireframes, allowing individual steps to be tied to elements such as buttons or ther elements.

Source: 101 Guide to Creating User Flow Diagrams, creately.com

Further reading: 101 Guide to Creating User Flow Diagrams ↗

A full guide to creating user flows.

User Flow Resources The Hows (and Whys) of User Flows ↗

Visually explore the user's tasks, explore edge cases and evaluate and improve.

MIRO Task/User Flow Template ↗

Develop a step-by-step visual guide to different processes.

MIRO Wire Flow Template ↗

Map out how customers move through a product to improve the user experience.






Information Architecture

The structure of content in your project is called information architecture. This visual map, often called a sitemap, allows you to start to group, prioritize and label content based on user needs.

Important Considerations

Source: I.A. design, xd.adobe.com

Information Architecture Resources MIRO Sitemap Template ↗

Update to include meta infoSitemaps are simple and effective visual tools that help you lay out the hierarchical structure of your website.






Wireframing

"The tradeoff between knowledge in the world and in the head"

Wireframes are a way of exploring the structure of a product or service, without investing large amounts of time to create it in full fidelity. They are an alignment tool, to communicate ideas, structure & content and to recieve feedback from stakeholder and users.

There are two primary types of wireframes:

Further reading: Wireframing for beginners ↗

How to get your wireframing off to the right start.

Wireframe Resources MIRO Wireframing Library ↗

Create simple low-fidelity wireframes quickly with 15 interactive UI components nativly in MIRO.








Next: Test →


← Back to the homepage↑ Back to top