Video Prototyping

November 12, 2010 | Tags: , , ,

What is Video Prototyping?

Video Prototyping is a tool Interaction Designers can use to tell a story about a design. It allows for the showing of an entire experience through a narrative. Video prototypes can be used to help better show a design in use in a way that many people connect with emotionally and aesthetically.

My Goals

Video Prototyping can be a very powerful tool to communicate a design. However, it can also be expensive and time consuming in order to produce. While some industry players are starting to use video prototyping more, many do not because of the costs involved. With this in mind, I decided to create a video prototype with very little cost in as little time as possible while still providing quality when narrating the experience of my design.

My Process

My overall process for creating a video prototype was to choose/create a design, ideate on how to tell the story of that design, create a storyboard, shoot the video, and then edit and upload that video.

I decided to use a design that I had worked on in the previous (spring 2010) semester entitled GroupView (research overview, design document). This design allowed multiple photographs to come together and learn from and teach each other. It connects their various cameras to an iPad application and allows for on-the-fly editing. As this design never previously made it to a full prototyping stage before, I had to iterate briefly on the design itself before bringing it into a video prototype.

Storyboard

After iterating on the design, I came up with some basic ideas on how to tell a story about the design. I quickly sketched out a basic narrative using 6 post-it notes and asked my colleagues for feedback. With this feedback I created a storyboard of my video prototype, using post-it notes on a sheet of foamcore so that I could rearrange and iterate quickly as needed.

IMG_0305.jpg

Shooting and Editing

With the storyboard in tow, I gathered a couple of students and starting shooting the video. I had quickly scouted out a place to shoot and informed my ‘actors’ of their roles as we walked to the location. From there I directed my actors and shoot several takes of most of the scenes. I quickly learned here that having my shoot broken up into scenes greatly speed up the process of shooting. I was able to shoot the entire video in about 25 minutes.

In keeping with my goals I decided that the quickest way to edit this video was to use iMovie. iMovie provides a good quick interface for putting together a decently polished video. Spending just 4 hours total, including make a couple of graphics in Photoshop, I was able to create my video prototype from raw video footage.

Reflection

I’ve found through this project that video prototyping can be a very compelling way in which to show a design. It allows stakeholders, users, developers and others to quickly understand the experience of a design. Some major drawbacks are that it costs (time and resources) a bit more than other forms of prototyping. However, by being mindful of these costs I think a video prototype can be created fairly easily. In the future I would be more mindful of my lighting sources, as there are several annoying reflections within my video. Scouting multiple locations could also help to provide backup plans for when a primary location doesn’t work out (as in it’s too sunny outside to see a screen, etc). Furthermore, storyboarding should absolutely be done prior to shooting as it cuts down video production (shooting and editing) time by a large factor. Without having properly storyboarded my design I would have spent much more time shoot and editing the video. Overall, I am happy with my process and have proved to myself that compelling video prototypes can be made with little resources and time.

Final Video

Below is the video prototype for GroupView. I would love any comments and critique on the video itself, as well as my process.

Give A Crit – Iterations

November 10, 2010 | Tags: , , ,

Over the last two days I’ve been iterating a lot on my design for the critique portion of my capstone project Give A Crit. I’ve locked myself in a whiteboard room and sketched and sketched, and sketched some more.

Here is an example of a whiteboard sketch.
whiteboard sketch of give-a-crit

I took this particular sketch and decided to quickly mock it up using Keynote (taking only 30-40 minutes). This was done to help me begin to better understand the design and interactions. This particular concept uses the idea of ‘purposeful progression’ (Dewey) through a three step process for contributing a critique.

keynote sketch of give-a-crit

keynote sketch of give-a-crit

keynote sketch of give-a-crit

However, I wasn’t really happy with these sketches. So, I talked to some colleagues and showed them my work. They gave me some great feedback. So much so that I felt compelled to come back into the studio at 9pm and sketch some more in the whiteboard room (love that room). Here are some sketches I came up with then.

give-a-crit3-sketches-1 give-a-crit3-sketches-2 give-a-crit3-sketches-3 give-a-crit3-sketches-4 give-a-crit3-sketches-5 give-a-crit3-sketches-6 give-a-crit3-sketches-7 give-a-crit3-sketches-8

Give A Crit – Sketch

November 6, 2010 | Tags: , , , , ,

I’ve been sketching and thinking deeply about my capstone project lately. I’ve done close readings of web based critique systems like Flickr, Deviant Art, Dribbble, etc. I’ve also been talking recently about the value of quickly prototyping a design. So tonight, I took a recent sketch of my capstone project, Give A Crit, and created a quick (non-interactive) prototype. This took me about 40 minutes using Keynote templates by Keynotopia, just one of many providers of keynote templates for prototyping. So, I present here, for your critique, a quick prototype sketch of Give a Crit, specifically of the critique functionality.

One main thought behind this sketch is to provide some ambiguity of the design so that photographers giving critique can provide meaning as they see fit. Furthermore, this sketch is totally lacking in the photograph’s technical details, which I believe will add value when giving a critique. These technical details could live below the photograph’s description, but I haven’t put much thought into that feature yet. Click on the image below for a full size version.

sketch prototype of Give A Crit

This project is ongoing and will change by leaps and bounds. I’ve conducted very little primary research at this point. Most of my thoughts have centered around a formal analysis of flickr, facebook, deviant art, smug mug, dribbble, and others. Formalist theories (Bell, Wolfman), Structuralist theories (Hebdish, Polhemus), and Use Quality theories (Lowgren) have also provided some grounding to my work, but will be further expanded upon in the future.

Formal Qualities of a Photograph

October 15, 2010 | Tags: , , , ,

In looking at the critique of photography, I want to start out by looking at the formal qualities of a photograph. In this post I will attempt to list out all the formal qualities of a photograph. In the future, I will use this list, and whatever might be added to it, to tease out certain styles of photography which might eventually lead me to better understand how photographers might critique each other.

The list:

  • depth of field
  • perspective
  • light
  • focus
  • composition
  • rule of thirds
  • leading lines
  • shadow
  • contrast
  • detail
  • clarity
  • saturation
  • shapes
  • framing
  • looking into/out of the frame
  • abstract
  • approach
  • expression
  • theme
  • texture
  • value
  • angle
  • background
  • balance
  • contour
  • vantage point

What have I left out? Have I included things that shouldn’t be in the list?

Online Photography Critique

October 1, 2010 | Tags: , , , ,

image courtesy of Qiao-Da-Ye

For my final capstone (thesis) project of my master’s program, I’ll be working on the topic of photography critique in a digitally mediated environment. Below is my initial plan for the project. I have a great passion for photography and critique in general and I don’t believe there is a good solution for providing critiques of photography online.

Background Opportunity

Critique is essential in almost any craft or art. Photography is no different. I want to provide a system so that photography students can have their worked critiqued by other photographers.

(more…)

Discovering Local Music in a Digital Age

September 26, 2010 | Tags: , , , , , , ,

Note: I’ve decided to scrap this idea in favor of something I feel more passionate about, photography and critique. You can read about my new capstone topic, Online Photography Critique, in a newer post.

For my final capstone (thesis) project of my master’s program, I’ll be working on the topic of discovering local music in a digital age. Below is my initial plan for the project. I’ve narrowed my focus just a bit from just Local Music in a Digital Age because I believe it will be a more interesting space within which to work. I’ve always been a fan of music and local music but I’ve had the hardest time finding new music which I might enjoy.

(more…)

Golden Quesions on Local Music

September 17, 2010 | Tags: , , , ,

Golden Questions is a technique used by designers to invigorate and stimulate thinking on a certain topic. They are typically used in or near the beginning of a process. Furthermore Golden Questions help to explore the depths of a problem space and all the little details that might surround it.

Nokia's Ovi

For my capstone (thesis) project in my masters program, I’m working within the problem space of Local Music in a Digital Age. In an effort to spur my thinking and uncover some of the deeper issues surrounding local music, I’ve come up with the following list of Golden Questions. I would love to hear your thoughts on this subject, Golden Questions as a technique, and my particular list of questions.

(more…)

Reflection on Prototyping with Foam

September 14, 2010 | Tags: , , , ,

Over the last week and a half in our prototyping class we learned about and started working with foam. We learned about the many different types of foam, their uses, and how people have used foam before. After conducting research on foam with my presenting partner Wes, I started thinking about what design I might want to prototype. I began by sketching out some basic ideas in a very rough format. I then decided that I would prototype an interactive iPad dock that would be used with Adobe software and could double as a tablet with a pressure sensitive pen. I selected this concept because it would force me to use foam in ways that I haven’t before, as well as integrate different materials into the foam.

(more…)

Group Match – A Dev Derby Design

September 13, 2010 | Tags: , , ,

Over the past two weeks I participated in a local event called Dev Derby. Dev Derby is an event where developers come together to “code for change”. The event was held during the first ever Bloomington, Indiana tech conference called The Combine. For the event I was part of a three person design team. We were challenged to design something that would be useful for non-profits and that developers that could build within 6 hours.

(more…)

Local Music in a Digital Age

September 7, 2010 | Tags: , , , ,

by Song Catcher Girl

For my last year in my masters program (HCID) we have to complete a 1 year long capstone (thesis) project. In thinking about what I might want to design, I’ve come up with the following problem space:

Local music in a digital age

When I was growing up, I was very much into local music. Back then the internet was still pretty slow but people were getting some music digitally. At the time I was doing concert photography for many local bands. I would show up at venues and photograph all day some times. This really put me deep inside the local music scene in Indianapolis. I knew most of the band members, I was friends with the sound guys, the venue owners, promoters, etc. Most people knew who I was. While part of this community I was exposed to tons of new music, both local and non-local. It was a really great experience for me.

(more…)