SlideShare a Scribd company logo
How do I incorporate Apple like design into my products? Michael Walkden VP Product Delivery Pathfinder Development LLC www.pathf.com April 2, 2011 Product Camp Chicago (c) Copyright 2011 Pathfinder Development LLC.  www.pathf.com DEVELOPMENT
Background
Design Matters ...Now more than ever
1950s
Photo Credit: CC  Ezu 1990s
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 Concept Working  Software
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
Photo By:  Hugo90 Working Prototypes
Pair Designing
 
send annotations load in plans in pdf format annotate plans with text aggregate annotations arrange plans into projects annotate with photos manage site visits within a project support jpeg as well as pdf plans search for a plan by title search for a plan using meta data access past projects upload files via email upload files via iTunes upload files via a virtual plan room m m m m m m add color to annotations separate 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 site launch 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 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). 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? 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. 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 Checklist Have customer fill out startup toolkit before inception Have internal kick off to define project strategy (product design v.s. We are implementers) Make sure to start with a PM, a designer, and a senior developer Pre-schedule workshops, transition meetings, stand-ups (if used) Start visual design in inception - have template of visual design done Educate client on our process Ensure notes and assumptions about stories get into Pivotal Personas High level task flows Cover FURPS+ for cross functional and nonfunctional requirements Select technology and high level architecture Estimate and prioritize story list Create a tentative release/build plan Identify iteration 0 tasks (and start if possible) Set up wiki, pivotal, email groups Create SOW addendum using inception estimates More business strategy conversations 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
Inception A 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
Inception HypothesisTest ResultsPersonasUsability TestingUser StoriesClarityCohesiveFocus on getting started There is Only One Team - Just different roles Design + Development + Testing + Project Management + Product Management
Agile Delivery Velocity Iterations Continuos Deployment User Stories Testing Lean UXD Wireframes Comp Prototyping User Behavior Analytics Usability Testing Product Focus Customer Development Funnels Sign-ups Analytics Constant Innovation There is Only One Team - Just different roles Design + Development + Testing + Project Management + Product Management Rapid Cycles Focus on desirability of end product
Easy Photo By: striatic
Thank You. DEVELOPMENT

More Related Content

PCC2 - How do I incorporate Apple-like design into my products?

  • 1. How do I incorporate Apple like design into my products? Michael Walkden VP Product Delivery Pathfinder Development LLC www.pathf.com April 2, 2011 Product Camp Chicago (c) Copyright 2011 Pathfinder Development LLC. www.pathf.com DEVELOPMENT
  • 3. Design Matters ...Now more than ever
  • 5. Photo Credit: CC Ezu 1990s
  • 6. 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
  • 8. What does Steve Really do For Apple? Chief Design Advocate http://andrewchenblog.com/2009/12/04/does-every-startup-need-a-steve-jobs/
  • 10. Photo By: Pattista Agile 101
  • 11. In general agile is not new. It is collection of good software practices evolved over years of experience. Photo By: NettasNursery
  • 12. 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
  • 13. Agile Values - Ingredients for highly productive, happy teams Focus on activities that add value Collaborative Transparent Adaptable Simple User engagement Continuous Improvement
  • 16. Lean UXD Methods are ... Lightweight Low-Fi Lo-Tech External Face to Face - Get out of the building
  • 17. Lean UXD Methods are ... Collaborative Fast Repeatable Goal Driven Outcome Focused
  • 19. Photo By: Hugo90 Working Prototypes
  • 21.  
  • 22. send annotations load in plans in pdf format annotate plans with text aggregate annotations arrange plans into projects annotate with photos manage site visits within a project support jpeg as well as pdf plans search for a plan by title search for a plan using meta data access past projects upload files via email upload files via iTunes upload files via a virtual plan room m m m m m m add color to annotations separate documents into pages display PDF table of contents M M M X X 3 weeks 6 weeks 15 weeks
  • 23. Architect in office, preparing for site visit captured site observations and emailed them load pdf plans on iPad for the site go to site launch 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
  • 24.  
  • 25. 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
  • 26. 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?
  • 27. 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)
  • 29. All in a 1-4 Week Period
  • 30. Storytelling and High level design 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). 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? 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. 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 Checklist Have customer fill out startup toolkit before inception Have internal kick off to define project strategy (product design v.s. We are implementers) Make sure to start with a PM, a designer, and a senior developer Pre-schedule workshops, transition meetings, stand-ups (if used) Start visual design in inception - have template of visual design done Educate client on our process Ensure notes and assumptions about stories get into Pivotal Personas High level task flows Cover FURPS+ for cross functional and nonfunctional requirements Select technology and high level architecture Estimate and prioritize story list Create a tentative release/build plan Identify iteration 0 tasks (and start if possible) Set up wiki, pivotal, email groups Create SOW addendum using inception estimates More business strategy conversations Show customer story board in key note of story list to tell the product's story
  • 31. Photo By: nukit1 Wait?!?! Good design takes time
  • 32.  
  • 33. 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
  • 34. 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
  • 35. Inception A 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
  • 37.  
  • 39.  
  • 40.  
  • 41.  
  • 42. Traditional analysis: Exhaustively evaluate each level before moving on Agile recognizes that: Clarity is an iterative process… The levels interact...
  • 43. 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
  • 44. 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
  • 45. Photo By: Eleaf How Do I Put it Together?
  • 46. 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/
  • 47. Users Needs Tasks Features User Stories Story Board
  • 48. Inception HypothesisTest ResultsPersonasUsability TestingUser StoriesClarityCohesiveFocus on getting started There is Only One Team - Just different roles Design + Development + Testing + Project Management + Product Management
  • 49. Agile Delivery Velocity Iterations Continuos Deployment User Stories Testing Lean UXD Wireframes Comp Prototyping User Behavior Analytics Usability Testing Product Focus Customer Development Funnels Sign-ups Analytics Constant Innovation There is Only One Team - Just different roles Design + Development + Testing + Project Management + Product Management Rapid Cycles Focus on desirability of end product
  • 50. Easy Photo By: striatic

Editor's Notes

  1. New Products - marketing - Design - Development - Launch - Customer Acquisition
  2. Military
  3. Individual Contributors - isolated with computers
  4. not talking about something lofty, but a real shift in the way we look at things
  5. Ubiquitous - tools - NOT computers anymore
  6. Real problem - desireabilty
  7. Must Build Something - Good Engineering
  8. How are these people having fun who are supposed to be working?
  9. Solution #2 - Templates aren’t going to work
  10. At the most basic level this is what we are trying to do
  11. Where, when, why
  12. Where, when, why
  13. Story Board/Key Design - Where, when, why
  14. Where, when, why
  15. Personas Where, when, why
  16. Because after that you have to START
  17. Lower levels validate or challenge higher level assumptions
  18. Who is there? - product launch people, stakeholders
  19. This is the first thing you need - Next you need to live up to promises