pcc2 - how do i incorporate apple-like design into my products?
DESCRIPTION
ProductCamp Chicago 2 session by Michael WalkdenTRANSCRIPT
How do I incorporate Apple like design into my products?
Michael WalkdenVP Product DeliveryPathfinder Development LLCwww.pathf.com
April 2, 2011Product Camp Chicago
(c) Copyright 2011 Pathfinder Development LLC. www.pathf.com
DEVELOPMENT
Background
Design Matters...Now more than ever
1950s
1990s
Photo Credit: CC Ezu
As computing technology moves toward mobile devices, we’ve seen the 1990s’ growth in processor speed taper off and product development become less about horsepower [and more] about the overall design of the product.
... a healthier view of human intelligence ...
... that it is reactive, responsive, sensitive, nimble.
Brian Christian, The Atlantic March 2011
2011
What does Steve Really do For Apple?
Chief Design
Advocate
http://andrewchenblog.com/2009/12/04/does-every-startup-need-a-steve-jobs/
Agile 101
Photo By: Pattista
Agile 101
•In general agile is not new. It is collection of good software practices evolved over years of experience.
Photo By: NettasNursery
Myths About Agile
Agile is Working Without Documentation★ Documents that add value are created just-in-time ★ Much of the documentation is short-lived
One specific methodology★ It’s an umbrella term for a set of approaches and practices to software development
which share common values.
A “One Size Fits All” cookbook★ Every project and team adjusts to fit circumstances, environment, and constraints★ It’s not an all or nothing proposition
Simply iterations★ Software is developed incrementally, in time-boxed iterations
“Glorified hacking”★ There is a set of highly disciplined practices, including design which many people skip
Working without a plan★ Adaptive planning aids in delivery of highest value features to the business★ Planning occurs continually, throughout the project
Agile Values - Ingredients for highly productive, happy teams
Focus on activities that add value
Collaborative
Transparent
Adaptable
Simple
User engagement
Continuous Improvement
Lean User Experience
Design
Product ConceptProduct ConceptProduct ConceptProduct Concept
Working Working SoftwareSoftwareWorking Working SoftwareSoftware
Lean UXD Methods are ...
Lightweight
Low-Fi
Lo-Tech
External
Face to Face - Get out of the
building
Lean UXD Methods are ...
Collaborative
Fast
Repeatable
Goal Driven
Outcome Focused
Your Toolbox
Working Prototypes
Photo By: Hugo90
Pair Designing
send annotations
load in plans in pdf formatannotate plans with textaggregate annotations
arrange plans into projectsannotate with photosmanage site visits within a project
support jpeg as well as pdf plans
search for a plan by titlesearch for a plan using meta dataaccess past projectsupload files via emailupload files via iTunesupload files via a virtual plan room
mmmmm
m
add color to annotationsseparate documents into pages
display PDF table of contents
M
M
M
X
X
3 weeks
6 weeks
15 weeks
Architect
in office, preparing for site visit
captured site observations and emailed them
load pdf plans on iPad for the site
go to sitelaunch iPad app
find the plan for this particular inspection
inspect site
create annotations
Finish inspection
Connect iPad to network
Generate annotations summary and send via email
find site plans for site
review annotations
The _____________ helps _____________
to _________________________
(product, feature) (target audience)
(receive a benefit)
Problem____________________________________________________________________________________________________
______________________________________
The Story
Solution____________________________________________________________________________________________________
______________________________________
Desired Action __________________________________
Picture Caption________________________________________________
Construction Obs. App
architects/contractors
carry whole plan libary to site and record and email observations without extra paperwork
Architects often bring the wrong drawings to a site inspection and must reenter and can lose notes taken on yellow pads at a site
The iPad punch list puts all the plans at the architects fingertips, gets rid of re-entry and insures notes are not lost
Architect watches video demo and is offered link to app store
touch an object to annotate, DONE button takes you back
Business Objectives What does success look like from a business perspective?
Users Who are the primary users of this product?
User Objectives Why do users want this product? What do they expect from it?
Brand Characteristics How do we want customers to perceive the brand?
Value Propositions What value does this product offer to the consumer?
Key Differentiators What does this product offer that no one else can?
Measures of Success How will we know we've been successful? Are there any key performance indicators?
Ken Mitchell
Responsible for Gig events,responsible for Gig staff,wants to sell out events, likes the service,likes innovators,staff prints thermal tickets
(Box Office Manager, The Gig)
The Challenge
All in a 1-4 Week Period
Storytelling and High level design
1.Visualize the personas - a cheap stock photo (www.fotolia.com) for each and their role. Can be more creative if that's of value (a consumer product may need
more, a B-to-B product probably not).
2.Visualize, using the personas pictures, the main idea of what the app does. Tell the story with one or a few slides. Ask: Does everyone on the team agree?
3.For each persona, get every activity they are doing listed. This is important, otherwise can end up designing pieces that don't fit together. This list can jump
start the story list.
4.For each persona, identify top goals (persona is successful if they can ________). This is usually very quick to do. The thinking work for 1-4 is best done in a time-boxed workshop with designer or PM leading and the whole team participating. Designer then mocks up a slide deck to present and validate.•After master story list is created, visualize the entire master story list. Sketch a deck of drawings that captures all the stories in visual form. The sketches are purely a fast design with everything in it, not a good design. You can only accomplish this with time boxed workshops (usually two or three 3 hour workshops). It always seems like a lot to do, yet when time boxed and everyone is pitching in it can be done. Somebody, like the PM, must serve as time-watcher and keep things moving so the goal is reached.•From 5, designer creates and mocks-up core design ideas. If stuck, pair with someone, could be anyone (doesn't have to be another designer).•Present the core design ideas in a story deck with context (personas pictures, screens, flows, whatever needed) and get client buy in. This will need to be iterated a few times most likely. This deck sets the stage for detailed design wireframes and specs during iterations.We usually have about two weeks to do this. Steps 1 -5 and part of 6 would be done during inception. The rest of 6 and 7 are done during the first iteration, which requires the first iteration's stories be independent of the core design.
If we can't do that in two weeks, we should sell the client on a longer inception if possible. Or, we have to finesse the first two iterations to allow more time for the high level design work.
Storytelling and High level design
1.Visualize the personas - a cheap stock photo (www.fotolia.com) for each and their role. Can be more creative if that's of value (a consumer product may need
more, a B-to-B product probably not).
2.Visualize, using the personas pictures, the main idea of what the app does. Tell the story with one or a few slides. Ask: Does everyone on the team agree?
3.For each persona, get every activity they are doing listed. This is important, otherwise can end up designing pieces that don't fit together. This list can jump
start the story list.
4.For each persona, identify top goals (persona is successful if they can ________). This is usually very quick to do. The thinking work for 1-4 is best done in a time-boxed workshop with designer or PM leading and the whole team participating. Designer then mocks up a slide deck to present and validate.•After master story list is created, visualize the entire master story list. Sketch a deck of drawings that captures all the stories in visual form. The sketches are purely a fast design with everything in it, not a good design. You can only accomplish this with time boxed workshops (usually two or three 3 hour workshops). It always seems like a lot to do, yet when time boxed and everyone is pitching in it can be done. Somebody, like the PM, must serve as time-watcher and keep things moving so the goal is reached.•From 5, designer creates and mocks-up core design ideas. If stuck, pair with someone, could be anyone (doesn't have to be another designer).•Present the core design ideas in a story deck with context (personas pictures, screens, flows, whatever needed) and get client buy in. This will need to be iterated a few times most likely. This deck sets the stage for detailed design wireframes and specs during iterations.We usually have about two weeks to do this. Steps 1 -5 and part of 6 would be done during inception. The rest of 6 and 7 are done during the first iteration, which requires the first iteration's stories be independent of the core design.
If we can't do that in two weeks, we should sell the client on a longer inception if possible. Or, we have to finesse the first two iterations to allow more time for the high level design work.
Inception Checklist1.Have customer fill out startup toolkit before inception2.Have internal kick off to define project strategy (product design v.s. We are implementers)3.Make sure to start with a PM, a designer, and a senior developer4.Pre-schedule workshops, transition meetings, stand-ups (if used)5.Start visual design in inception - have template of visual design done6.Educate client on our process7.Ensure notes and assumptions about stories get into Pivotal8.Personas9.High level task flows10.Cover FURPS+ for cross functional and nonfunctional requirements11.Select technology and high level architecture12.Estimate and prioritize story list13.Create a tentative release/build plan14.Identify iteration 0 tasks (and start if possible)15.Set up wiki, pivotal, email groups16.Create SOW addendum using inception estimates17.More business strategy conversations18.Show customer story board in key note of story list to tell the product's story
Inception Checklist1.Have customer fill out startup toolkit before inception2.Have internal kick off to define project strategy (product design v.s. We are implementers)3.Make sure to start with a PM, a designer, and a senior developer4.Pre-schedule workshops, transition meetings, stand-ups (if used)5.Start visual design in inception - have template of visual design done6.Educate client on our process7.Ensure notes and assumptions about stories get into Pivotal8.Personas9.High level task flows10.Cover FURPS+ for cross functional and nonfunctional requirements11.Select technology and high level architecture12.Estimate and prioritize story list13.Create a tentative release/build plan14.Identify iteration 0 tasks (and start if possible)15.Set up wiki, pivotal, email groups16.Create SOW addendum using inception estimates17.More business strategy conversations18.Show customer story board in key note of story list to tell the product's story
Photo By: nukit1
Wait?!?!Good design takes time
But...Big Designs up Front don’t work either
Don’t provide any direct value to product
Take too long
Are not accurate anyway
Foster an anti-change mentality
More about Big Designs up Front
Are difficult to estimate
Are hard to navigate
Everyone hates reading them
Have to be transformed into something developers can use
InceptionA short period of hard collaborative work; to better understand project
objectives, identify potential users, and define high level functional scope so that size of the project can be roughly estimated and an incremental release
strategy can be identified
Normally What Happens....
What Should Happen...
Traditional analysis: Exhaustively evaluate each level before moving on
Agile recognizes that:
Clarity is an iterative process…
The levels interact...
Traditional analysis: Exhaustively elaborate each level before moving on
Agile process strives to:
Do just enough to move down...you can always go back
Get to market and realize return on investment
An Agile inception Is...
Very visual - centered around tangible
models
Collaborative and inclusive
Time-boxed and rapid
Iterative and feedback driven (embracing
change)
Product & implementation cost focused
Photo By: Eleaf
How Do I Put it Together?
In battles with the business and technology goals, desirability will almost always win out
Makes it clear that product should be “insanely great”
Recruits a top design team and protects them from competing goals
Willing to spend money, adjust technology processes, all for the goal of highly desirable product
Choose Design Advocate
http://andrewchenblog.com/2009/12/04/does-every-startup-need-a-steve-jobs/
Users
Needs
Tasks
Features
User Stories
Story Board
InceptionHypothesisTest ResultsPersonasUsability TestingUser StoriesClarityCohesiveFocus on getting started
There is Only One Team - Just different roles Design + Development + Testing + Project Management + Product Management
Agile DeliveryVelocityIterationsContinuos DeploymentUser StoriesTesting
Lean UXDWireframes
Comp
Prototyping
User Behavior Analytics
Usability Testing
Product FocusCustomer Development
Funnels
Sign-ups
Analytics
Constant Innovation
There is Only One Team - Just different roles Design + Development + Testing + Project Management + Product Management
Rapid CyclesRapid Cycles
Focus on desirability
of end product
Focus on desirability
of end product
Photo By: striatic
Easy
DEVELOPMENT
Thank You.