building results oriented websites: the method that ends the madness

[MM.DD..YY] [PRESENTER]

Nov 19, 2011 Building results-oriented web projects

Building Results Oriented Websites:The Method that Ends the Madness flickr.com/photos/cuppini/2719863711

Why do we plan?

• Look and feel• Features

Stakeholder utility

• On time• On budget• In Scope

Certainty

• Emotional branding• Content• Features• Usability & Experience

End user utility

• Increased revenue• Reduced cost • Increased goodwill

Organizational returns

CB

5 years from now

Features

Certainty

User delight

Org. value

A

What is a results oriented website

flickr.com/photos/ncreedplayer/5403123930 flickr.com/photos/masoncooper/456641277

Why should we plan?

certainty

stakeholderutility

userexperience

returns

waste

1. Maximize organizational returns

2. Optimize user experience

3. Reduce waste

Traditional web development process

Requirements

• Concept • High-level requirements

• Requirements gathering • Requirements spec

Design

• Product (UI) Design• Wireframes

• Detailed Design • Functional specs

Implementation

• Creative design• Content• Development

Verification

• Unit testing• Acceptance testing

• Beta testing

Maintenance

planning

development

live

Big Design Up Front

certainty

stakeholderutility

userexperience

returns

waste

6 months

$

Mid Design Up Front

certainty

stakeholderutility

userexperience

returns

waste

6 weeks

$

Fumbling towards estimates

The McCracken Uncertainty Principle

The higher the feature velocity of a project, the less precise the resources needed can be predicted

Planning for certainty

source: blogs.msdn.com/b/dannawi/archive/2009/05/15/2009-standish-chaos-report-we-are-successful-in-the-failure.aspx

certainty waste

=

certainty no long term value

=

Getting what you want vs. knowing what you want

time

inn

ova

tion

high levelrequirements

design & architecture

mockups validation live

Freedom to innovate

Insight to innovate

certainty less value

=

valuemore money

= $

Where to go

certainty

$

value

waste

cost $ $

AgileBig DUFMid DUF

A better approach

Requirements

Design

Implementation

Verification

website6 months

waterfall

Requirements

Design

Implementation

Verification

features2 weeks

agile

Project management methodologies comparison

Cowboy Agile Waterfall

Requirements Little formal requirements

Lightweight, structured

Very formal Big Design Up Front

Owner - teamAgreements

Usually fixed bid, poorly defined scope.

Typically fixed budget or fixed scope – value based

Initially fixed bid by stages. Modified by change orders.

Owner – team relationship

Undefined Collaborative Contractual

Owner – team communication

Whenever Cycle every 1-4 weeks

At major milestones. May be months apart.

Improvement changes requests

Whatever Discussed each cycle – better ideas easily integrated

Formal change order process built to resist change

Risk management

??? Adaptive - by doing, inspecting and adapting

Predictive – by planning

Light weight planning

certainty

stakeholderutility

userexperience

returns

waste

2 weeks

$

Results oriented light weight planning

certainty

stakeholderutility

userexperience

returns

waste

4 weeks

$$

The plan

online

results

a.k.a more of the right stuff

agile project management

results oriented

user-centeredplanning

more stuff

the right stuff

Process

Types of models• Results models• User role models• User stories• Interface models

Models based• Light weight• Iterative• Comprehendible by everyone• Synchronization• Collaboration

Participatory workshops• Rapid• Comprehensive• Synergistic• Consensus

Results modeling

Process• Brainstorm• Organize• Consolidate & refine• Prioritize

Definition:the benefits stakeholders want to achieve with the site.

Results modeling: types of results models

objectives

valued eventsgoals

Results modeling: brainstorm

increase bike sales

become a recognized

leader in the local biking community

Show the pictorial history of results bikes

The site should be intuitive and easy to

navigate

The site should have a clean

and professional

look

Be more viral

To increase traffic to the

site

Increase bike rentals by

100%

Reduce routine customer call inquires by

50%

Sell more bike repair services

Sell more bikes online

Double our mailing list

Staff should be able to add

and edit content

Expand our digital footprint

Get 500 “Likes” on Facebook

Visitors should be able to find what they want in no more than

3 clicks

Results modeling: organize

increase bike sales

become a recognized

leader in the local biking community

Show the pictorial history of results bikes

The site should be intuitive and easy to

navigate

The site should have a clean

and professional

look

Be more viral

To increase traffic to the

site

Increase bike rentals by

100%

Reduce routine customer call inquires by

50%

Sell more bike repair services

Sell more bikes online

Double our mailing list

Staff should be able to add

and edit content

Expand our digital footprint

Get 500 “Likes” on Facebook

Visitors should be able to find what they want in no more than

3 clicks

Results modeling: consolidate

increase bike sales

become a recognized

leader in the local biking community

Show the pictorial history of results bikes

The site should be intuitive and easy to

navigate

The site should have a clean

and professional

look

Be more viral

To increase traffic to the

site

Increase bike rentals by

100%

Reduce routine customer call inquires by

50%

Sell more bike repair services

Sell more bikes online

Double our mailing list

Staff should be able to add

and edit content

Expand our digital footprint

Get 500 “Likes” on Facebook

Visitors should be able to find what they want in no more than

3 clicks

Goals Objectives FeaturesValued events

Results modeling: refine

increase bike sales

Goals Objectives Valued eventsIncrease by

sales by 50% a month within 6

months

Bike purchaseValue = 40% of the retail price

Results modeling: prioritize

increase bike sales

become a recognized

leader in the local biking community

The site should be intuitive and easy to

navigate

The site should have a clean

and professional

look

Be more viral

To increase traffic to the

site

Sell more bike repair services

Sell more bikes online

Expand our digital footprint

Primary Secondary Tertiary

User role modeling

Process• Brainstorm• Organize• Consolidate & refine• Define• Prioritize

Definition:a collection of defining attributes that characterize a population of users and their goals, needs and intended interaction with the site

User role modeling: brainstorm

local newspaper

sports blogger

website administrator

hotels that need bikes for

guests

people from out of town

fans

staff

new bike rider

bike shoppers

person who wants to

upgrade their bike

competitive rider

bike owners

job seekers

new mom/parent

casual bikers

tour guide

User role modeling: organize

local newspaper

sports blogger

people from out of town

fans

staff

bike shoppers

person who wants to

upgrade their bike

bike owners

job seekers

new mom/parent

website administrator

hotels that need bikes for

gueststour guide

competitive rider

casual bikers

new bike rider

User role modeling: consolidate & refine

local newspaper

sports blogger

fans

staffbike shoppers

bike owners job seekers

new mom/parent

website administrator

tour guide

casual bikers

new bike rider

person who wants to

upgrade their bike

enthusiasts shoppers staff

renters

people from out of town

hotels that need bikes for

guests

owners

competitive rider

job seekers

User role modeling: define

owners

Demographics• Age: 25-55• Gender: 65% male• Location: within 10 miles of store

Psychographics• Active lifestyle• Prefers being outdoors• Green

Behavioral• Significant web usage including search engines and social media• Research purchases online before buying• Significant use of mobile devices

Brand• Custom service is significant driver for brand loyalty• Likely to buy again from same store. Typically 1 bike every 4 years.

Site• Proficient web user • Likely to have high speed internet access

User role modeling: personas

renter

User role modeling: prioritize

enthusiastsshoppers

staffrenters

owners

job seekers

Primary Secondary Tertiary

User stories

Process• Brainstorm• Organize & refine• Prioritize

Definition:describes a features and functionality of the site from the viewpoint of a user role

Trawling for requirements

User stories: format

As a [user role]I want [a feature or goal] so that [a benefit or reason]

* so that is optional

A user story is a documented requirement and a note to discuss later

User stories: brainstorm

As a Bike Enthusiast, I would like to• read the latest bike shop news/blog• comment on the blog• share content through email and social media • see a calendar of events, classes, races• sign up for newsletter and alerts• see special offers• get contact information• see location and hours of operation

User stories: prioritize

MoSCoW approach• Must haves – we need these stories in order to launch the

project• Should haves – these are of high importance, but are not

show stoppers for the next release• Could haves – If we get a couple of these in it would be

nice, but they can be moved easily to the next release• Wants – These are not a priority but we want to keep track

of them as possibilities for future releases.

Interface models

Common interface models• Navigation architecture & maps• Content models • Wireframes and prototypes• Design comps

Definition:graphical or organizational representation of site elements and how they relate to each other

Interface models: wireframes

Summary

1. Don’t obsess over certainty, you will get more done.

2. Software is for the end users, get out of your head and into theirs

3. It is about benefits, not features. Results should be a continual focus.

all-in-one results oriented website

A results oriented website in a box* *box not included

For organizations age 0 to 150

Super secret D7 version:http://apps.leveltendesign.com

thank you!

Tom McCrackenLevelTen InteractiveDirector

Phone: 214.887.8586Email: tom@leveltendesign.comTwitter: @levelten_tomBlog: leveltendesign.com/blog/tomLinkedIn: linkedin.com/in/tommccracken