Video Sketching: Designing Beyond the 'Screen' - Microsoft Surface Blog - Site Home - MSDN Blogs

Video Sketching: Designing Beyond the 'Screen'

  • Comments 3

I’d like to propose an alternative to typical, preliminary design exploration techniques such as wire-framing and interactive prototyping – when designing new Microsoft Surface experiences. In 5 years of brainstorming, visualizing, and creating Microsoft Surface experiences as a designer; I have definitely learned the limitations and advantages of various techniques due to the fact that showing interaction design on Microsoft Surface requires a lot more human interaction (touch, multi-touch, complex gestures, etc.) as well as other factors like physical objects, multi-directional experiences, etc.

Video Sketch Process

What is Video Sketching?

Video Sketching is a technique that involves using a any simple video camera (i.e. Flip), any surface, everyday objects, some green construction paper, and some simple AfterEffects (or equivelant) compositing techniques any designer can easily pickup. Video Sketching is a technique optimized for:

  • Quickly and efficiently exploring and visualizing key feature ideas, design solutions, scenarios
  • Easily communicating a design concept to a wide audience (i.e. researchers, developers, management, etc) BEFORE a line of code is written
  • Visualize solutions that involve interaction beyond the device itself
  • Visualize your solution with real people!

Why Video Sketches?

  • They are lightweight, low cost, efficient, and most importantly… disposable!
  • FAR more cost-effective than building premature, functional software prototypes
  • Provides more breadth to design possibilities and communicates the right information at the appropriate time
  • Helps you think about how users realistically approach Surface (just by physically acting out your own scenarios)
  • Forces designers and researchers to think ‘outside of the screen’ to ultimately design solutions that are seamless with their environment (as opposed to UI wireframes)
  • Allows you to ‘mock-up’ scenarios that are outside of your current technical capabilities (i.e. integration with other devices, new technologies, even audio, etc.) - helping set a bar to work toward and even drive technical requirements.
  • Allows you to consider other form factors for the product in a variety of settings
Attachment: VideoSketching.jpg
  • Hi Dane,

    I like your suggestions about this video sketching technique and I just want to share my idea for visualisation of interaction without going into software development stage.

    It might not be as easy as yours because it actually involves creating a table with the glass surface & use of the projector, but I think the end result is quite good.

    I created a set of short flash animations, pre-recorded a few tours in google earth and screen grabbed some of my 360 QTVR panoramas. Then I projected all this material onto the table surface and recorded a video; pretending that I am using gestures to control what happens on the screen.

    You can see the video here: http://www.vimeo.com/3653916

    Best Regards and thank you for many useful information on this blog.

    Adam

  • Thanks Adam! Likewise on the great suggestions. Yes, the main takeaway is that you've found a short path of resistance to get an idea across that helps others envision that idea in a more suitable context.

    P.S. It looks like you're link was removed before I could get to it, but I definitely get your technique. Great stuff.

    Dane

  • Hi Dane,

    I've moved the video here: http://www.vimeo.com/3801734

    As you've said - it really helps others envision the idea of multi-touch and using gestures.

Page 1 of 1 (3 items)
Leave a Comment
  • Please add 6 and 1 and type the answer here:
  • Post

Video Sketching: Designing Beyond the 'Screen'