prototyping interaction with video scenarios

Download Prototyping Interaction with Video Scenarios

Post on 17-Aug-2014

12.770 views

Category:

Technology

8 download

Embed Size (px)

DESCRIPTION

Aaron Rincover and I presented this workshop at Seattle Make-a-Thon on November 6, 2010, sponsored by IxDA Seattle, AIGA Seattle, and Interact. When designing interactions that transcend singular devices and form the basis of device ecosystems, wireframes just don’t cut it. Much of the interactions you’re looking to define and refine are evoked through motion, sound, haptics, and other variables that can’t be easily documented without "dancing about architecture." In these situations, it’s often most effective to create video scenarios that describe how an interaction would happen out in the real world. These scenarios are useful not only for explaining ideas to your clients—they’re an effective way of capturing prototypes to see if they make sense and feel real. Over the course of this workshop, we explored the various flavors of video scenario that you can create, depending on the design problems you’re seeking to solve. Then we’ll spent the balance of our time working in small teams to create a short interaction vignette about gestural input to activate a teleportation device.

TRANSCRIPT

  • A intro B break it down C challenge D solution E show & tell prototyping interaction with video scenarios David Sherwin, frog design + Aaron rincover AIGA + IxDA + InterAct SeAttle / mAke-A-thon / 11.06.10 Prototyping Interaction with Video Scenarios Workshop 2010 David Sherwin & Aaron rincover. All rights reserved.
  • A intro B break it down C challenge D solution E show & tell lets do a warm-up exercise
  • A intro B break it down C challenge D solution E show & tell In 30 seconds, visualize a gesture to take a photograph of your left hand with your right hand 3
  • A intro B break it down C challenge D solution E show & tell lets debrief Share out your gesture ideas how did we perceive each gesture? how would you communicate your gesture to your team? Your client?
  • A intro B break it down C challenge D solution E show & tell what are video scenarios?
  • video 4820842668 / Using Paper to Sketch iPad App by Alex tsayun on flickr / All rights reserved http://www.targetprocess.com/blog/2010/07/using-paper-to-sketch-ipad-app.html
  • A intro B break it down C challenge D solution E show & tell styles of video scenario stills with v/o stop-motion with v/o live-action video
  • A intro B break it down C challenge D solution E show & tell some types of video scenarios capturing a gesture completing a task flow fulfilling a user goal describing a journey
  • A intro B break it down C challenge D solution E show & tell why use video when prototyping an interaction?
  • photo 4327435571 on flickr by boston public library, cc share + remix
  • A intro B break it down C challenge D solution E show & tell interaction design is first and foremost the design of behavior that occurs over time. Alan cooper, David cronin, robert reimann, About Face 3
  • A intro B break it down C challenge D solution E show & tell video captures ideal behavior over time
  • A intro B break it down C challenge D solution E show & tell video captures what documents only describe
  • A intro B break it down C challenge D solution E show & tell video scenario scenario flow easy to consume time-consuming includes real context implies context requires attention requires imagination shared vision build it to know it
  • A intro B break it down C challenge D solution E show & tell video captures gestural affordances
  • Phil Van Allen, object and Screens Speculations at http://philvanallen.com/downloads/object_videos_w_titles.mov
  • A intro B break it down C challenge D solution E show & tell video captures stakeholder attention
  • A intro B break it down C challenge D solution E show & tell video is a method of prototyping?
  • video? from Prototyping: A Practicioners Guide by todd Zaki Warfel / rosenfeldmedia.com
  • A intro B break it down C challenge D solution E show & tell video captures prototypes
  • video free video prototypes can draw from any of the above technologies David & Aaron maul a chart from Prototyping: A Practicioners Guide by todd Zaki Warfel / rosenfeldmedia.
  • Paper, narrative, and digital artifacts shown in real-world use by people. video free video prototypes can draw from any of the above technologies David & Aaron maul a chart from Prototyping: A Practicioners Guide by todd Zaki Warfel / rosenfeldmedia.
  • Gestural input is best captured through video or a true functional prototype. video free video prototypes can draw from any of the above technologies David & Aaron maul a chart from Prototyping: A Practicioners Guide by todd Zaki Warfel / rosenfeldmedia.
  • A intro B break it down C challenge D solution E show & tell why not use video when prototyping an interaction?
  • A intro B break it down C challenge D solution E show & tell not interactive hard to edit disposable its not real
  • A intro B break it down C challenge D solution E show & tell time-consuming to make
  • A intro B break it down C challenge D solution E show & tell time-consuming to make
  • A intro B break it down C challenge D solution E show & tell example: a teleportation system for easy everyday use on city streets
  • A intro B break it down C challenge D solution E show & tell Aarons example video scenario: teleportation made easy
  • A intro B break it down C challenge D solution E show & tell break it down: video scenario process
  • A intro B break it down C challenge D solution E show & tell the process: 1 . plan the shoot 2. make & set-up shoot 3. shoot the scenario 4. evaluate & edit
  • A intro B break it down C challenge D solution E show & tell 1. plan the shoot things to consider Storyboard Voiceover/sound User flows Schedule talent Budget Props Video capture locations editing methods
  • A intro B break it down C challenge D solution E show & tell 1. plan the shoot explore what Ux/UI screens are required
  • A intro B break it down C challenge D solution E show & tell 1. plan the shoot the storyboard shows screens in context
  • A intro B break it down C challenge D solution E show & tell 1. plan the shoot common shot types: CLOSE-UP OvEr thE ShOULDEr MEDIUM EStABLIShING
  • A intro B break it down C challenge D solution E show & tell 1. plan the shoot Your planning should include: complete storyboard (of every key shot) Sketched-out flow for required UI screens required actions per shot: gestures, expressions, person-to-person interaction, devices used the hero UI moment for critical shots location detail to pre-visualize shot type/angle Voice-over (we arent including today)
  • FrAme # FrAme # FrAme # ActIon ActIon ActIon ______________________________ _________

Recommended

View more >