Design Studios: Idea Creation


Published on

Design Studios offer designers a creative way to gather requirements by doing sketching workshops with key stakeholders. In this presentation, you will lear how to more effectively perform design studios with other people.

Published in: Design, Business, Technology

Design Studios: Idea Creation

  1. Sketching User Experiences with the Design Studio Method<br />Big Design ConferenceBrian Sullivan and Ryan PleskoWeb:<br />
  2. Design Studios<br />
  3. Design Studio Session Overview<br />What is a Design Studio Session?<br />Designers express and explore ideas, generate, and evaluate alternatives to ultimately make decisions and take action.<br />Artists, industrial designers, graphic designers, and architects use Design Studio sessions.<br />Used to: brainstorm, refine, and share ideas, build design skills.<br />Main purpose is to saturate the design space with possibilities, which can be refined.<br />Original Sketch for Flckr<br />
  4. Sketching is a Proven Method for Innovating<br />Innovators sketch to visually think through ideas:<br /><ul><li>Leonardoda Vinci always sketched a minimum of three times. Scribbles and doodles would sometimes be clustered together, while at other times they were pages apart. (Michael Gelb, 2000)
  5. Thomas Edison sketched the incandescent light bulb in 1879 for his US patent. “No one can doubt the expertise needed to bring a sketch into fruition,” said Charles Batchelor, Edison’s friend and fellow inventor.
  6. On its company website, IDEO, an award-winning design firm, says it builds multi-disciplinary teams that use collaborative sketching to design their ideas.</li></li></ul><li>Sketching is a Critical Process for the 21st Century<br />Sketching is critical for your current success:<br /><ul><li>Bill Buxton of Microsoft explains over 20 different methods to sketch out user experiences using sketching, cameras, and whiteboards. (Buxton, 2007)
  7. Brandon Schauer of Adaptive Path explains how to make sketching portable with Sketchboarding. (2007)
  8. Dan Roam explains how many of the best ideas are formed literally on the back of a napkin. (Roam, 2009)
  9. Jim Ungar and Jeff White’s presented at SIG-CHI 2008 on how sketching is an agile method. (SIG-CHI, 2008)
  10. JeromeRyckborst’s Five Sketches or Else Method combines the Six Thinking Hats of Edward de Bono with lessons from Bill Buxton. (UPA, 2008)</li></li></ul><li>Bill Buxton’s Design Funnel from Sketching Experiences<br /> Buxton talks about a Design Funnel in the SDLC, where the opportunity to saturate the design space with ideas occurs very early.<br /> The design space is limited (or goes into a funnel) as projects move in the timeline.<br />Project Timeline<br />
  11. Sketching Early, Prototype Later (Buxton)<br /> Buxton explains that opportunities to saturate the design space decrease, as convergence occurs.<br /> Concept generation narrows the further you move into the SDLC, but there are still opportunities.<br /> Coding limits the design opportunities.<br />
  12. Why Sketches in a Design Studio Session?<br />Why Sketches?<br />Worth a 1,000 words<br />Disposable<br />Quick<br />Cheap<br />No special skills needed<br />No coding needed<br />The goal is to saturate the design space with ideas…<br />Source: Bill Buxton’s “Sketching the User Experience”<br />
  13. Design Studio Session’s Saturate the Design Space<br />Participants produce several rough sketches<br />Discuss and critique the sketches<br />Merge ideas into one design concept<br />Above are Jim and Jeff working on site (SIG-CHI 2008)<br />
  14. Why are Design Studios Important to You?<br />You should be leading these Design Studio sessions!<br />You are preventing usability issues rather than treating them!<br />You are working on projects from the start, not at the end.<br />RELEVANT<br />
  15. What Makes a Good Sketch?<br />
  16. How do make a good sketch?<br />You’re making a rough sketch—Use pen & paper, and colored markers. Don’t use a computer.<br />Use large paper and use the whole page—Write BIG. Draw BIG. Only use fat-nib markers so a roomful of people can see the idea when you present it.<br />“Good enough” is good enough—You’re making a rough sketch.<br />Use only enough detail to communicate your main idea.<br />Only ONE idea per sketch.<br />ANY idea—even crazy or expensive ideas—are OK. Don’t judge your ideas now, just get five on paper.<br />Remember: QUANTITY breeds QUALITY.<br />Adapted from Jerome Ryckborst’s Five Sketches or Else Method (UPA 2008)<br />
  17. Use 11x17 Paper (Use Big Paper for Big Ideas)<br />Adapted from Jerome Ryckborst’s Five Sketches or Else Method (UPA 2008)<br />
  18. Don’t Worry about the Details<br />Adapted from Jerome Ryckborst’s Five Sketches or Else Method (UPA 2008)<br />
  19. Sketch Enough Details to Convey Your Idea<br />Adapted from Jerome Ryckborst’s Five Sketches or Else Method (UPA 2008)<br />
  20. You Can Always Refine the Sketch (It is Disposable)<br />Adapted from Jerome Ryckborst’s Five Sketches or Else Method (UPA 2008)<br />
  21. Provide Annotations in Red for User Actions and Outcomes<br />Adapted from Jerome Ryckborst’s Five Sketches or Else Method (UPA 2008)<br />
  22. Provide a Title and a Brief Explanation<br />Adapted from Jerome Ryckborst’s Five Sketches or Else Method (UPA 2008)<br />
  23. What makes a presentable sketch?<br />Add LABELS and arrows that identify the actions and the results. Number the labels and responses.<br />Always write labels in red, and use red only for labels. (Text in the GUI and title bars is not a label.)<br />Add a SKETCH TITLE to help communicate the idea and to help people remember what it’s about later on.<br />Be able to take about 20 seconds to talk about your sketch. (Don’t worry—it’s enough time. Remember, a picture is “worth a thousand words”.)<br />Adapted from Jerome Ryckborst’s Five Sketches or Else Method (UPA 2008)<br />
  24. What Makes a Good Studio Session?<br />
  25. Before you come to the session<br />Do your sketches separately from others on the team.<br />Expect to spend 2-4 minutes on each sketch, but don’t expect to do all your sketches in one sitting.<br />FIVE substantially different ideas—five sketches—for each solution. We need to get out of the common response zone, so five unique sketches, or else (FUSE).<br />Don’t be discouraged if you feel uncomfortable when it’s harder to come up with sketches after doing your third one. This is “the sticking point.” Hang in there! Your really creative ideas need a bit more time to come to the surface. They will come. Talk to other people who’ve done sketching sessions about their experience.<br />QUANTITY breeds QUALITY. We are saturating the design space.<br />Adapted from Jerome Ryckborst’s Five Sketches or Else Method (UPA 2008)<br />
  26. Get Out of the Common Response Zone!<br />You must come with five sketches, or else:- We are wasting our time.- We are staying in the common response zone.- We are not saturating the design space.<br />The sketches must be unique, or else:- You are iterating the same basic idea.- You risk getting committed to one idea.- You are still in the common response zone.<br />Adapted from Jerome Ryckborst’s Five Sketch or Else Method (UPA 2008)<br />
  27. DeBono’s Six Hats—A Structured Path to Decisions<br />De Bono’s Six Hats help team members think about a problem in the same way at the same time, and in a specific progression. <br />This allows the team to complete each step more quickly, and it ensures that all essential details get covered.<br />The hats are ordered in a specific way, so we all think about the designs from various perspectives.<br />
  28. Use Whole Brain Thinking<br />Rules of Focusing:<br /><ul><li>Use affirmative judgment
  29. Be deliberateand explicit
  30. Consider novelty
  31. Stay on course</li></ul>Rules of Creating:<br /><ul><li>Strive for Quantity
  32. Defer Judgment
  33. Freewheel
  34. Piggyback</li></ul>Source: Creative Problem Solving (Don Treffinger, Scott Isaksen, Brian Stead-Dorval, 2006)<br />
  35. Blue Hat: Facilitator or Guide<br />Blue hat: Process (meta-talking). Useful to guide and focus the group. <br />For example: “Now let’s think of yellow-hat thoughts about this idea” moves the group to the next step, and “Can you hold that thought? We’ll look at grey-hat thoughts later” postpones a comment to the right time.<br />Things You Might Hear:- What have we done so far?- What decision have we reached?- What do we do next?- Let’s where a different hat for the next few minutes.- Let’s summarize what we have learned.<br />
  36. White Hat: Neutral, Objective<br />White hat: Factual (state the facts). Seeking objective information, without opinions. <br />Things you might hear:- What do we know? - What don’t we know?- What information is missing?- What questions do we need to ask? - How will we get the information we need?<br />
  37. Green Hat: Creative, Generative<br />Green hat: Creative (ideation). For each problem, sketch five substantially different ideas.<br />During green-hat thinking, do not analyze or judge the ideas; reject nothing; all ideas are acceptable, even “silly” or “impossible” ones.<br />After presenting your sketches to the other design participants, mash up—or re-sketch—to add something new and something borrowed. <br />Re-sketch one of your sketches, and present it. Re-sketch one of someone else’s sketches, and present it. <br />Next, synthesize everything you’ve seen into a few sketches. Present those, and then apply the next two hats to them.<br />Rules of Creativity:<br /><ul><li>Strive for Quantity
  38. Defer Judgment
  39. Freewheel
  40. Piggyback</li></li></ul><li>Yellow Hat: Positive, Sunny<br />Yellow hat: Positive. What are the reasons that a green-hat idea may work?<br />Analyze all sketches together, but ask participants to comment on each sketch in turn, so that one sketch never gets two comments in succession.<br />Ask participants to start each comment with the words “This idea may succeed because….”<br />This allows you to probe for value and benefit of potential ideas. <br />Things You Might Ask/Hear:<br /><ul><li>What are the good points?
  41. What are the benefits?
  42. How will it help us?
  43. Why can it be done?
  44. Why is this worth doing?</li></li></ul><li>Black Hat: Critical, Cautious<br />Black hat: Critical. What are the reasons that a green-hat idea may not work?<br />Analyze all sketches together, but ask participants to comment on each sketch in turn, so that one sketch never gets two comments in succession.<br />Require participants to start each comment with “This idea may not succeed because….”<br />This is a good time for a usability expert to identify unusable features in all sketches.<br />If participants get defensive about a comment, refocus them on black-hat thinking (defensive remarks are often yellow-hat), and remind them that one sketch never gets two comments in succession. Follow the black-hat thinking by another round of yellow-hat thinking.<br />After the analysis (yellow- and black-hat thinking), do a further round of green-hat thinking.<br />Use this round of green-hat thinking to address the grey-hat and yellow-hat thoughts.<br />
  45. Red Hat: Emotional, Intuitive Decisions<br />Red hat: Decision. Decision-making based on everything you’ve experienced, based on what you think and feel, using your judgment and opinions.<br />No consensus? You may need to follow the process for another round, starting with white-hat thinking. Although frustrating, sketching is cheaper than having a developer code and then discard (or worse—not discard) a poor design.<br />Things You Might Hear:- I feel like this idea has potential.- I feel like this idea is very unusual.- How do I feel about this idea right now?<br />NOTE: Everyone feels something, even neutrality or apathy. <br />Your Feelings Could Be:<br /><ul><li>Neutral
  46. Undecided
  47. Confused
  48. Doubtful
  49. Mixed</li></li></ul><li>Putting All The Pieces Together<br />Blue Hat (Facilitator) controls the meeting and the hats.<br />White Hat (Group) reviews known facts about design space.<br />Green Hat (Group) creates five initial sketches, which get iterated (re-sketched) during the Design Studio session. Two minute review of each idea at the start of the Design Studio.<br />Yellow Hat (Group) reviews all green-hat sketches, capturing positive aspects of the ideas. Four minute yellow-hat discussion of each green-hat design idea. <br />Black Hat (Group) reviews all green-hat sketches, capturing why ideas may not work. Four minute black-hat discussion each green-hat design idea. <br />Red Hat (Group) reviews and decides on how to move forward based upon each person’s feelings, intuition, and experience.<br />
  50. Design Studio Methodology<br />Design Studio Methodology is not new. <br />Six Hats Method for Software Design was developed by Jerome Ryckborst, who presented at UPA 2008.<br />
  51. Case Study: GT Unused E-tickets<br />
  52. White Hat: Understanding the Design Space<br />BRD delivered day before Design Studio.<br />Before the Design Studio Session, we put on our White Hat to determine design space:- Two pages identified—Home and Air Availability pages.- High-level use cases were in the Business Requirements Document.- Affected user personas are Traveler and Travel Arranger.<br />Participants were asked to create five unique designs for the Home and Air Availability pages only.<br />
  53. Tip: Use Brainwriting, If Needed<br />Problem Statements are recorded on top of a page.<br />All problem statements are put into center of a group (3-5 people).<br />Each person gets a sheet and records their initial 3 answers.<br />They return their sheet and get another one.<br />They read the problem statement and other responses.<br />They record new responses (freewheel and piggyback).<br />Goal is 3 statements every 3 minutes, until done.<br />After completing, the team evaluates and votes (focusing).<br />NOTE: Brainwriting has been calling brainstorming on steroids. It captures all data (self-documenting) and you record individual responses (no Group Think). Finally, the group decides. <br />
  54. Blue Hat: What were the Sticking Points?<br />Before looking at any of the sketches, we asked the following question:“What were your sticking points as you sketched?”<br />The answers were similar:- Getting to the 5th idea- Screen real estate- Considering current state- Thinking about the future- General fear (of rejection)<br />For Your Consideration: Ideas and thoughts are exposed in Design Studios, so people can feel nervous. Acknowledging the emotions helps us to move forward. It helps to know that other people has the same sticking points, too.<br />
  55. Green Hat: Individuals Sketch—No Collaboration<br />
  56. Green Hat: Saturating the Design Space<br />
  57. Blue Hat: Clustering Similar Designs<br />For the Air Availability pages, we clustered the designs that were similar to make them easier to analyze.<br />Three predominant page designs emerged from the Design Studio session.<br />We still reviewed all of the pages using the Yellow Hat (positive) and the Black Hat (critical). <br />Group 1<br />Group 2<br />Group 3<br />
  58. Yellow Hat: Positive Comments<br />
  59. Black Hat: Critical, Cautious<br />
  60. Red Hat: Emotional, Intuitive Decision<br />
  61. Green Hat: Re-Sketch the User Experience<br />
  62. And the winner is…..<br />Red Hat: Decision Point (4 of 4 Pick)<br />
  63. Blue Hat: Debrief<br />4 Sketchers/1 Facilitator<br />20 Original Sketches<br />40 Positive Comments<br />40 Critical Comments<br />3 Basic Page Designs Emerge<br />4 Designs go to 2nd Round<br />Iterate on 2 of 3 Page Designs<br />4 New Designs for 2nd Round<br />1 Design Voted on 4-4<br />2 Hours to Complete<br />Final sketch mashes up ideas from all participants.<br />
  64. Green Hat: Refines Sketch into JPG Rendering<br />Using Final Sketch, a designer can turn the initial drawing into a JPG rendering.<br />Key things to note here:- About 2 hours to sketch- About 2 hours to render JPG- Further down Design Funnel<br />
  65. Another Example<br />
  66. Some General Numbers <br />Total Energy Used assumes 5000 hours of usage, which is the standard life of an LED bulb.<br />
  67. World Usability Day Site<br />The World Usability Site wants to create a Sustainability program, where users can sign up to get a free LED light bulb. <br />Design Challenge: Create an Energy Calculator to show how changing out a 50-watt light bulb with an energy-saving LED bulb saves money and energy.<br />
  68. Designed the Actual Widget With 40 Designers in 4 Hours<br />
  69. Tips and Tricks<br />Use teams of 6-8 people (too many people is too hard)<br />Stick to the process (use the hats—they work)<br />Do 5 sketches, then 3 sketches, and 1 sketch<br />Vote using a 10% rule:- 30 sketches = 3 votes- 15 sketches = 2 votes- 7 sketches = 1 vote<br />Use mashups for the final sketch. NOTE: It is best to have business requirements defined before a Design Studio, so each person is trying to solve the same problem.<br />
  70. Contact Information<br />Twitter: @BrianKSullivan Email: brian.sullivan@sabre.comBlog: http://theusabilitycorner.blogspot.comWeb:<br />