Tue, September 14

DSGN 270 Day 3 - User stories, user flows and wireframes

Housekeeping

Reminder for Tony: Hit record!
Git Re-Poll
DSGN 270 Assignment 2: Agile UX Breakdown
- Due Monday, September 20
- 25% of the final course mark
New WBDV website issue

Trophy of the Day: README Stories

The project README file is the developer's message to future devs (including you) who will be interacting with the project.

Create a new Gist with a description of your choice.
Add a README file to this Gist containing a list of your favourite user stories, user flows and/or task flows from today's activities.
Include headings, paragraphs ordered and unordered lists.

Submit your repo link (and GH Pages link, if desired) to today's Daily in Brightspace.

Tooltime: Markdown

Docs: "GitHub Flavoured Markdown"

User stories for devs

Gist: Agile User Stories

Terminology

Epic: An Epic is a high-level body of work that bands together with a group of related Stories.
User Story: User Story is a small (actually, the smallest) piece of work that represents some value to an end user and can be delivered during a sprint.
Task Flow: A step-by-step list of tasks required to implement a User Story.
User flow: A visual representation, either written out or made digitally, of the many avenues (i.e. Task Flows) that can be taken when using an app or website.

Activity: Snake oil user stories

In groups of three to four, create a User Story:

Option 1: based on a fictitious product or service.
Option 2: based on an existing website or app.

Instructions

Round-robin: each group member decides on a product/service/website/app;
As a group create a User Story for that product/service/website/app;
- Who is the user? Try to be more detailed than "registered user". A good user description is short (2-3 words) but conveys empathy.
- What action would they like to complete? Can it be accomplished with web software?
- Why do they want it? What pain does it kill?
Move to the next member's product/service/website/app.

Record your Stories in a Gist, doc, file so you can display them during the discussion afterwords.

Task flows for devs

A task flow should:

have the same starting point for all users;
be 5 tasks or more;
show only one path and not show branches;
end in success;
be presented as a numbered list.

Each task should be:

short and concise (less than a sentence);
be user-centric (no system processes included);
focus on actions that trigger screen or layout transitions.
- For example: "user submits form" instead of "user enters username..."

Activity: Snake oil task flow

In groups of three or four, pick the top User Stories created in the previous activity and break down the tasks required for the user to achieve the goal in a website.

Use real life websites as a guide.
What web conventions can be used to make the flow more intuitive?
What is the definition of success? All task flows should end in success, should not branch and be the same for all users.
Take a moment to reflect on how Task Flows are affected by accessibility challenges.