State Mapping

presented byDante Murphy

State Mapping

It all started so humbly.

The journey was the experience.

Now, the experience is a whirl of features

and functions…

[ auto-scrolling on mouse position

[ dynamic compare panel

[ AJAX-driven detail panel!

[ auto-position quick links

…designed to meet the needs of many different users…

…doing different things.

Pisa, bucky, peanuts, new

It’s time for something new.

1. Defining a concept

1

Simple objects can still be defined by their structure.

Complex, interactive systems can’t.

Understanding the elements and their attributesis not the same as understanding the system.

You are here.

The whole must be greater than the sum of its parts.

Mapping a single journey.

Home

PAGE0.0

Settings[account]

PAGE4.0

Profile

PAGE1.0

Friends

PAGE2.0

Inbox

PAGE3.0

Invite

PAGE2.1

Find

PAGE2.2

Adding more users and activities describes a greater variety of journeys and begins to suggest a unified

system.

Legend

Home

PAGE0.0

Settings[account]

PAGE4.0

Profile

PAGE1.0

Friends

PAGE2.0

Inbox

PAGE3.0

Invite

PAGE2.1

Find

PAGE2.2

Sign up for mobile alerts

Link to other profiles/appsactivity

navigation

casual user

addict

unregistered user (novice)

People you may know

Legend

etc.

etc.

mobile alerts

social media integration

becomes acasual user| File Edit View Insert Format Tools Actions Help

Coping with Somnolence – Message (HTML) X

|

To: < recipient >From: SEROQUEL

Subject : Coping with Somnolence

Cc:

Sent : < date and time >

x x x x x x x x 6

Extra line breaks in this message were removed .

Lorem ipsum dolor sit amet, consectetuer adipiscing elit . Cras lacinia. Nullam eget augue. Quisque ut pede . Nullam nunc arcu, eleifend quis, nonummy at , vulputate ut, magna. Donec id justo id purus tincidunt mollis . Morbi libero orci, accumsan vel, nonummy rutrum, trist ique sed, lacus. Sed aliquam posuere risus. Pellentesque nisl felis , fermentum eu, ultricies eget, nonummy malesuada, tortor. Mauris id elit. Morbi tincidunt lectus quis arcu . Nam interdum quam.

Integer cursus, turpis id molestie posuere, mi massa vestibulum nisi, ac rutrum augue dui ut eros. Mauris risus. Suspendisse potenti . Pellentesque justo nulla, pharetra a, tincidunt sollicitudin, tincidunt et, augue. In ullamcorper quam eget elit. Maecenas vel quam. Quisque metus lacus, elementum ac, malesuada sed, vestibulum ut , metus.

status e-mail

home page

Jeff

Lee

Lan

Carly

Lance

Alyssa

Norm

browse

| File Edit View Insert Format Tools Actions Help

Coping with Somnolence – Message (HTML) X

|

To: < recipient >

From: SEROQUEL

Subject: Coping with SomnolenceCc:

Sent: < date and time >

x x x x x x x x 6Extra line breaks in this message were removed .

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Cras lacinia. Nullam eget augue. Quisque ut pede . Nullam nunc arcu, eleifend quis, nonummy at , vulputate ut , magna. Donec id justo id purus tincidunt mollis. Morbi libero orci, accumsan vel, nonummy rutrum, tristique sed, lacus . Sed aliquam posuere risus. Pellentesque nisl felis, fermentum eu , ultricies eget, nonummy malesuada, tortor. Mauris id elit . Morbi t incidunt lectus quis arcu . Nam interdum quam.

Integer cursus , turpis id molestie posuere , mi massa vestibulum nisi , ac rutrum augue dui ut eros. Mauris risus. Suspendisse potenti . Pellentesque justo nulla , pharetra a, tincidunt sollicitudin, tincidunt et , augue. In ullamcorper quam eget elit . Maecenas vel quam. Quisque metus lacus, elementum ac, malesuada sed, vestibulum ut, metus.

invite e-mail

Home

PAGE0.0

Settings[account]

PAGE4.0

Profile

PAGE1.0

Friends

PAGE2.0

Inbox

PAGE3.0

Invite

PAGE2.1

Find

PAGE2.2

Sign up for mobile alerts

Link to other profiles/apps

professional socialite student

activity

navigation

casual user

addict

unregistered user (novice)

People you may know

| File Edit View Insert Format Tools Actions Help

Coping with Somnolence – Message (HTML) X

|

To: < recipient >

From: SEROQUEL

Subject: Coping with SomnolenceCc:

Sent: < date and time >

x x x x x x x x 6

Extra line breaks in this message were removed .

Lorem ipsum dolor sit amet , consectetuer adipiscing elit. Cras lacinia. Nullam eget augue. Quisque ut pede . Nullam nunc arcu, eleifend quis, nonummy at , vulputate ut , magna. Donec id justo id purus tincidunt mollis. Morbi libero orci, accumsan vel, nonummy rutrum, tristique sed, lacus . Sed aliquam posuere risus. Pellentesque nisl felis, fermentum eu , ultricies eget, nonummy malesuada, tortor. Mauris id elit . Morbi t incidunt lectus quis arcu . Nam interdum quam.

Integer cursus , turpis id molestie posuere , mi massa vestibulum nisi , ac rutrum augue dui ut eros. Mauris risus. Suspendisse potenti . Pellentesque justo nulla , pharetra a, tincidunt sollicitudin , tincidunt et , augue. In ullamcorper quam eget elit . Maecenas vel quam. Quisque metus lacus, elementum ac, malesuada sed, vestibulum ut, metus.

friend request

The finished state map, displaying a plurality of targeted personas, related interactions, and key business metrics

and outcomes.

22. Specifying a Design

Let’s do it.

Some tried and true methods for specifying a design.

What the @#$* is going on here?

Most flowcharts are more complicated than this one.

Most prototypes end up like this one. Or should.

The first State Map.

Key

myNETWORK

Global actions

Profile Actions

Content Actions Communication Actions

Update Status

action#

Find Friend

action#

Logout

action#

Invite a Friend to Join

action#

Print

action#

Customize Display

action#

Update

action#

Avatar

object#

Traits

object#

Password

object#

View

action#

Breast Cancer Profile

object#

DOB

object#

Sharing Preferences

object#

< page >

< type >#

< page >

< type >#

Profile(public view)

collection#

< page >

< type >#

< page >

< type >#

Profile(friends network view)

collection#

< page >

< type >#

< page >

< type >#

Profile(owner view)

collection#

Reminder Frequency

object#

E-mail

object#

ZIP

object#

Resize Text

action#

Read/View

action#

Article

object#

Videos

object#

Exercises

object#

Respond to

action#

Archive

system action#

Play

action#

Games

module#

Garden

module#

Messages

object#

Wishes

object#

Dedications

object#

Friend Request

object#

Challenges

object#

Status

object#

Send Gift To

action#

Send

action#

Friend Request

object#

Dedications

object#

Wishes

object#

Challenges

object#

Time on Therapy

object#

Registration

action#

Login

action#

Create

action#

5

5

— action base points

— action bonus points

5

5

1

2

5

5 5

1

5

3 5

Read

action#

Milestones

object#

Motivational Message

object#

Motivational Message

object#

Poll

object#

Survey

object#

1 — object bonus points

A — object gift

1 1 1

1 3

A

Overview of Reward Points

object#

first time after registration

Complete

action#

Tend

action#

2

&

& — variable bonus points

Bonus points to be awarded at three levels:· +1 for completing puzzle· +2 for completing in under 2 minutes· +3 for completing in under 45 seconds· all bonus points cumulative

· Member may only accrue points once per day for this action

1· Member may only

accrue points three times per day for this action

2

1

· Member may only accrue points once for this action

3

1

3

2

Invitation

object#

Bonus points to be awarded when sent message is read by recipient

123

33. Evaluating Solutions

Is everyone enjoying these silly images?

You know the players, even the plays…but what is the plan?

Apply affinity mapping and annotation to the key activities of your targeted audiences.

Soon all the modalities are accounted for, and additional layers of information can be added if desired.

No lemon zester!

Free samples!

Questions?

Song list:Three Wishes – Big Rude JakeCantaloop – US3

thank you for attendingState Mapping

Happy Motoring!