Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Science Fiction Prototyping Workshop

1,392 views

Published on

This is the latest version of my Science Fiction Prototyping Workshop, give at the Interaction 17 conference in NYC today.

Published in: Design
  • Hey guys! Who wants to chat with me? More photos with me here 👉 http://www.bit.ly/katekoxx
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here

Science Fiction Prototyping Workshop

  1. 1. Make It So Workshop Design Lessons From the Future Nathan Shedroff nathan@nathan.com @nathanshedroff scifiinterfaces.com MAKE IT SO Interaction Design Lessons from Science Fiction by NATHAN SHEDROFF & CHRISTOPHER NOESSEL foreword by Bruce Sterling Many designers enjoy the interfaces seen in science fiction films and television shows. Freed from the rigorous constraints of designing for real users, sci-fi production designers develop blue-sky interfaces that are inspiring, humorous, and even instructive. By carefully studying these “outsider” user interfaces, designers can derive lessons that make their real-world designs more cutting edge and successful. “Designers who love science fiction will go bananas over Shedroff and Noessel’s delightful and informative book on how interaction design in sci-fi movies informs interaction design in the real world.... You will find it as useful as any design textbook, but a whole lot more fun.” ALAN COOPER “Father of Visual Basic” and author of The Inmates Are Running the Asylum “Part futurist treatise, part design manual, and part cultural analysis, Make It So is a fascinating investigation of an often-overlooked topic: how sci-fi influences the development of tomorrow’s machine interfaces.” ANNALEE NEWITZ Editor, io9 blog “Shedroff and Noessel have created one of the most thorough and insightful studies ever made of this domain.” MARK COLERAN Visual designer of interfaces for movies (credits include The Bourne Identity, The Island, and Lara Croft: Tomb Raider) “Every geek’s wet dream: a science fiction and interface design book rolled into one.” MARIA GIUDICE CEO and Founder, Hot Studio www.rosenfeldmedia.com MORE ON MAKE IT SO www.rosenfeldmedia.com/books/science-fiction-interface/ MAKEITSObyNATHANSHEDROFF&CHRISTOPHERNOESSEL
  2. 2. Make It So Workshop Introduction Presentation Discussion Exercise 1: Diverge Exercise 2: Diverge Exercise 3: Converge Exercise 4: Converge Results Presentation Discussion :60 :30 :30 :30 :30 :30
  3. 3. presentation Make It So Workshop 0:45:00 www.youtube.com/watch?v=u6lHVkTakSs
  4. 4. Make It So Workshop Design for Dreaming (01956)
  5. 5. Make It So Workshop Who’s Future? dream-house-design.blogspot.com
  6. 6. Visible Human Project (01989) Lesson: Real Design Inspires Science Fiction
  7. 7. X-Men (02003) Lesson: Real Design Inspires Science Fiction
  8. 8. Damien Hirst (01993) Lesson: Real Design Inspires Science Fiction
  9. 9. The Cell (2000) The Cell (02000) Lesson: Real Design Inspires Science Fiction
  10. 10. X-Men (02000) Lesson: Science Fiction Inspires Real Development
  11. 11. XenoVision Mark II Dynamic Sand Table (02004) Lesson: Science Fiction Inspires Real Development
  12. 12. XenoVision Mark II Dynamic Sand Table (02004) Lesson: Science Fiction Inspires Real Development
  13. 13. Star Trek (01966) Lesson: Science Fiction Sets Expectations that Audiences and Developers Internalize
  14. 14. Motorola StarTAC (01996) Lesson: Science Fiction Sets Expectations that Audiences and Developers Internalize
  15. 15. Motorola MicroTAC (01989) Lesson: Science Fiction Sets Expectations that Audiences and Developers Internalize
  16. 16. The Empire Strikes Back (01980) Lesson: Visual Scale Telegraphs Social Hierarchy
  17. 17. Revenge of the Sith (02005) Lesson: Visual Scale Telegraphs Social Hierarchy
  18. 18. The Fifth Element (01997) Lesson: Systems Should Respond to Erroneous Input Appropriately
  19. 19. 2001: A Space Odyssey (01968) Lesson: Systems Should Respond to Erroneous Input Appropriately
  20. 20. The Fifth Element (01997) Lesson: Systems Should Respond to Erroneous Input Appropriately
  21. 21. Into Eternity (02010) Onkalo Nuclear Waste Repository, Eurajoki, Finland
  22. 22. Lifted (02006) Lesson: Form Language Can Help Novice Users Quickly Learn Complex Systems
  23. 23. Apple “Snow White” Design Language (01984-01990) Lesson: Most Design IS Fiction
  24. 24. Lesson: (So is much of Business)
  25. 25. Metropolis (01927) Lesson: Humanness is Transferrable to Non-human Systems
  26. 26. Roomba (02002) Lesson: Humanness is Transferrable to Non-human Systems
  27. 27. Knight Rider (01982) Lesson: Conversation casts the system in the role of a character
  28. 28. Star Wars: A New Hope (01977) Lesson: Use Nonlinguistic Sounds Expressively to Trigger Anthropomorphism
  29. 29. Moon (02009) Lesson: Use an agent’s social pressure for a social agenda
  30. 30. Microsoft Bob & Clippy (01987) Lesson: Anthropomorphized Interfaces Are Difficult To Greate Successfully
  31. 31. Microsoft Ms. Dewey (2006) Lesson: Anthropomorphized Interfaces Are Difficult To Greate Successfully
  32. 32. Knowledge Navigator (01987) Lesson: Anthropomorphized Interfaces Are Difficult To Greate Successfully
  33. 33. The Matrix (01999) Lesson: The More Human The Representation, The Higher The Expectations Of Human Behavior
  34. 34. 40 Realistic >>> Acceptable>>> Star Trek:The Next Generation (01987) Lesson: Beware the Uncanny Valley
  35. 35. Until the End of the World (01991) Lesson: Consider Zoomorphizing (Animal-likenesses) For Low-Functioning Systems
  36. 36. Iron man (02008) Lesson: Achieve Anthropomorphism Through Behavior
  37. 37. The Time Machine (02002) Lesson: Achieve Anthropomorphism Through Behavior
  38. 38. Star Trek (02010) Lesson: Rely On A User’s Recognition Rather Than Recall
  39. 39. Flash Gordon (01980) Lesson: Avoid Reminding People of the Simulation
  40. 40. 2001: A Space Odyssey (01968) Lesson: The Network Ruins Tension-Filled Narratives
  41. 41. Science Fiction is a prototyping tool Make It So Workshop
  42. 42. Make It So Workshop
  43. 43. Make It So Workshop Sci Fi Character Story Inspiration Design User/Persona Scenario/Use Case Outcome/Value <>
  44. 44. Make It So Workshop Exercise 1: Diverge: Design for a New User Exercise 2: Diverge: Design for New Medium Exercise 3: Converge: Reverse Engineer for 
 the Present Exercise 4: Converge: Add a Sci-Fi Patina
  45. 45. Make It So Workshop exercise 1 : Diverge: Design for a New User Choose a character from a Sci-fi film or TV show (similar to your user) and imagine the system that would meet their needs 0:30:00
  46. 46. Make It So Workshop 0:30:00 exercise 1 : Diverge: Design for a New User Choose a character from a Sci-fi film or TV show (similar to your user) and imagine the system that would meet their needs
  47. 47. Make It So Workshop 0:30:00
  48. 48. Make It So Workshop 0:30:00 exercise 1 : Diverge: Design for a New User Refamiliarize yourself with it by researching its interfaces online with images.
  49. 49. exercise 2 : Diverge: Design for New Medium Choose one of the following media and imagine
 how it might transform your system: AR, VR or 3D Gesture Interface Voice Interface Anthropomorphism Make It So Workshop 0:30:00
  50. 50. exercise 3 : Converge: Reverse Engineer for the Present Redevelop your new solution into present-day technology. How much of it can be built “today”? Make It So Workshop 0:30:00
  51. 51. exercise 4 : Converge: Add a Science Fiction Patina Incorporate Sci-Fi typography, colors, shapes,
 and other visual design elements into your solution. Make It So Workshop 0:30:00
  52. 52. Lesson: Sans Serif Is The Typeface Choice Of The Future
  53. 53. The Island (c 02005) Lesson: Incorporate Typographic Principles From Print
  54. 54. Star Trek (02009) Lesson: Science Fiction Glows
  55. 55. Star Trek: The Next Generation (c 01987-01994) Lesson: Science Fiction Glows
  56. 56. Galaxy Quest (01999) Supernova (02000) Battlestar Galactica (02004) The Hitchhiker’s Guide to the Galaxy (02008) Lesson: Future Screens Are Mostly Blue
  57. 57. 1968 1973 1974 1977 1979 1980 1982 1983 1986 1989 1990 1991 1996 1997 1999 2000 2002 2003 2004 2005 2007 2008 Lesson: Future Screens Are Mostly Blue
  58. 58. The Fifth Element (01997) Red Planet (02000)
 Star Trek: Nemesis (02002) The Incredibles (02004) Lesson: Red Means Danger
  59. 59. Enterprise (02001) The Matrix: Revolution (02003) Lesson: Gray Makes Interfaces Look Like An Early-Generation GUI
  60. 60. Roomba (2002) Space:1999 (01975)
 Star Wars 1: The Phantom Menace (01999) Lesson: To Create A Unique Interface, Avoid Single, Common Colors And The Glow Effect
  61. 61. Men in Black II (02002) Firefly (02002) Torchwood (02005)
 Star Wars IV: A New Hope (1977) Lesson: Use Nonrectilinear-Shaped Screens To Make Them Look Advanced
  62. 62. District 9 (02009) Lesson: Use Transparency To Order Important Information While Preserving Context
  63. 63. Star Trek (02009) Lesson: Avoid The Confusion Caused By Too Many Overlapping, Transparent Layers
  64. 64. Eagle Eye (02008) Lesson: Avoid The Confusion Caused By Too Many Overlapping, Transparent Layers
  65. 65. Gamer (02009) Hackers (01995) Lesson: Three-Dimensional Data Makes Use of Users’ Spatial Memory
  66. 66. Lost in Space (01998) Lesson: Use Motion To Draw Attention, Cautiously
  67. 67. The Hitchhiker’s Guide to the Galaxy (02008) Lesson: Creative Combinations of Even Common Stylistic Choices Create Unique Appearance
  68. 68. Final Fantasy (02001) Lesson: Creative Combinations of Even Common Stylistic Choices Create Unique Appearance
  69. 69. The Chronicles of Riddick (02004) Lesson: Creative Combinations of Even Common Stylistic Choices Create Unique Appearance
  70. 70. The Incredibles (02004) Lesson: Creative Combinations of Even Common Stylistic Choices Create Unique Appearance
  71. 71. LCARS Interface, Star Trek: The Next Generation, Star Trek: Deep Space 9, and Star Trek: Voyager (01987-2001) Lesson: Creative Combinations of Even Common Stylistic Choices Create Unique Appearance
  72. 72. Misc. Alien Interfaces, Star Trek: The Next Generation,
 Star Trek: Deep Space 9 (01987-2001) Lesson: Creative Combinations of Even Common Stylistic Choices Create Unique Appearance
  73. 73. present : What did you create? 1: what is your system/interface? 2: who is your character (and what changed)? 3: what sci-fi tech did you try (and what changed)? 4: how do you bring it back to the present? Make It So Workshop 0:30:00
  74. 74. scifinterfaces.com Nathan Shedroff & Chris Noessel nathan@nathan.com @nathanshedroff MAKE IT SO Interaction Design Lessons from Science Fiction by NATHAN SHEDROFF & CHRISTOPHER NOESSEL foreword by Bruce Sterling Many designers enjoy the interfaces seen in science fiction films and television shows. Freed from the rigorous constraints of designing for real users, sci-fi production designers develop blue-sky interfaces that are inspiring, humorous, and even instructive. By carefully studying these “outsider” user interfaces, designers can derive lessons that make their real-world designs more cutting edge and successful. “Designers who love science fiction will go bananas over Shedroff and Noessel’s delightful and informative book on how interaction design in sci-fi movies informs interaction design in the real world.... You will find it as useful as any design textbook, but a whole lot more fun.” ALAN COOPER “Father of Visual Basic” and author of The Inmates Are Running the Asylum “Part futurist treatise, part design manual, and part cultural analysis, Make It So is a fascinating investigation of an often-overlooked topic: how sci-fi influences the development of tomorrow’s machine interfaces.” ANNALEE NEWITZ Editor, io9 blog “Shedroff and Noessel have created one of the most thorough and insightful studies ever made of this domain.” MARK COLERAN Visual designer of interfaces for movies (credits include The Bourne Identity, The Island, and Lara Croft: Tomb Raider) “Every geek’s wet dream: a science fiction and interface design book rolled into one.” MARIA GIUDICE CEO and Founder, Hot Studio www.rosenfeldmedia.com MORE ON MAKE IT SO www.rosenfeldmedia.com/books/science-fiction-interface/ MAKEITSObyNATHANSHEDROFF&CHRISTOPHERNOESSEL

×