UX Designer | Twitter @maitedalila

Phase Two

UX Toolkit

Phase One

discovery

Phase Two

structure

Phase Three

skeleton

Strategy Information Architecture User Flow

Affinity Map Card Sorting Task Analysis

MOSCOW Method Site Map Task Flow

Mind Map User Flow

User Journey

Job Story

Goals and Actions

Montenashi Approach

Table of Contents

strategy

1. Present the topic or define the problem clearly.

2. Give the team index cards or sticky-notes.

3. Write an idea or issue per card.

4. Sort the ideas or issues into categories as a team

5. Labeling each group of cards.

6. Eliminate duplicate ideas.

7. Add arrows between groups to show relationships.

Capture Group Label

A tool used to organize ideas and data.

Affinity diagram Exercise

Must have Should have Could have Won’t have

A tool to help understand priorities and create your MVP.

MOSCOW method Template

Subject

Date

A method to organize your thoughts for later review.

Mind map Template

information architecture

1. Gather/prepare these things • Use deck of cards. • Write one item per card. • Use some sort of divider, like a chopstick or a

pencil., masking tape 2. Organize the cards in groups that relate to each other 3. User testing - Ask to organize the cards in groups

relate to each other

Capture Label

An inexpensive method for finding patterns in how users would expect to find content.

Exercise

Card sorting

Page Content

2.2

SearchSearch

4.1Form Page

Multiple Pages

2.3Interactive Page

1.0HOME

Sub Page

Primary Page

SITE map Template

Static Page

user flows

Steps Needed to Complete

Considerations / Influencers Pain points Emotion

1

2

3

4

A tool to understand in detail how users perform tasks and achieve their intended goals.

TASK Analysis Template

Process / Task /Action EX. Create a post

Begin

No

Yes

Decision EX.Post on blog?

What is the user objective (The desire or needs that they want to satisfy)

Start by answering these questions. (Answers will come from your users)

What are all the questions they have

about this task?

What information do they need to take

action?

What is the business objective (The action you want the visitor to take on the site)

Explains how a user completes a task

Template

USER flow

Go through Presentation

Start Presentation

No

YesUnderstand?

Finish Presentation

QA Tweet @maitedalila

Understand?Happy Path

KEY

Task 1

Example

USER flow

What questions/ comments do they have about the task?

What is the desire/ need they want to

Ne

gat

ive

Timeline

Po

sitiv

e

What questions/ comments do they have about the task?

What questions/ comments do they have about the task?

What questions/ comments do they have about the task?

What questions/ comments do they have about the task?

PhasePhasePhase

Template

USER journey

Template

When I want to So I can

Situation Motivation Expected Outcome

Helps frame a design problem in a Job, focusing on the triggering event or situation, the motivation and goal, and the intended outcome:

Template

JOB Story

Example

When an important customer signs up

I want to be notified

So I can start a conversation with them

Situation

Motivation

Expected Outcome

JOB Story

Phase

Task Analysis

Breakdown

MOSCOW Shade in MOSCOW. Add and remove as you go along the project

Phase

Task

1. What you need to accomplish task

2. What you need to accomplish task

3. What you need to accomplish task

Phase

Task

1. What you need to accomplish task

2. What you need to accomplish task

3. What you need to accomplish task

Phase

Task

1. What you need to accomplish task

2. What you need to accomplish task

3. What you need to accomplish task

Phase

Task

1. What you need to accomplish task

2. What you need to accomplish task

3. What you need to accomplish task

A functional breakdown of the user’s journey

Template

Task analysis

Goals

Action

Screen Requirements

You want to….EX. You want to Setup An Account

EX. You need to…. Fill out a form

Screen needs to have…. Sign up Form

You need to….

EX. You need to…. Accept T&Cs

Screen needs to have…. T&C Checkbox

Screen needs to have….

Screen needs to have….

You need to….

You want to….

You need to….

Screen needs to have….

Screen needs to have….

You need to….

You want to….

You need to….

Screen needs to have….

Screen needs to have….

You need to….

Template

Helps breakdown must-have components of each screen.

GOALS & actions

Shitsuari “put the user at ease”

Signal a clear beginning and end to the interaction

Template

Method to improve Human-Machine Interaction, into "principles of attitude":

"A good host does not bother the guest but gives a well balanced

amount of information,"

Furumani “mutual attunement”

How you might treat a "regular" versus a

newcomer

"Knows when interactions ought to be formal and when they ought to

be,"

Motenashi approach

Phase One

discovery

Phase Two

structure

Phase Three

skeleton

Next up

Twitter @maitedalila

UX Designer