This week I was introduced to some new terms; paper prototyping, stop motion and navimation. I’ve been heard about two of them, but navimation was totally new. An assignment that was handled out after the first lecture was about all these terms. So what does these terms mean and how did the assignment go?Paper prototyping
“Paper prototyping is a variation of usability testing where representative users perform realistic tasks by interacting with a paper version of the interface that is manipulated by a person ‘playing computer,’ who doesn’t explain how the interface is intended to work(source: paperprototyping.com).

These is a quite good explanation on what it is. The term is explained even wider on wikipedia, so I’m not going to further explanation here. Read more here: what is prototyping?

Stop motion
My first association with stop motion was the motion term in flash, because I’ve been working a bit with the different elements in flash in the past. So I was kind of on the same track, because the frame by frame technique is involved. Shortly explained you crate a movie clip by capturing movement by movement. Again further reading can be done on Wikipedia.

One (among some other) positive exploration I did with this technique was that I finally understood how the step by step movies were made. I’ve seen a lot movies made using these technique, but I was always wondering HOW they were made. I also discovered that using these technique one can create and show concepts in a quick way.

The software we were introduced to use, was FrameByFrame (Download here. Only for Mac) which is a pretty stripped and easy-to-use software for these kind of jobs.

Navimation
I must admit that this was quite an interesting term that I was introduced to. I’ve been working with software and websites for couple of years now, but have never heard about this before. I liked the the “concept” behind it; navigation + animation = navimation. You can read more here about the term.

The assignment: “Sketching with time”

The task was to create an album interface that supports navigation through a set number of photos. The device was optional, and could be a web page, mobile, touchscreen etc. All methods explained above should be involved. The concept should be innovative, delightful and emotional evocative.

The final result

My first thoughts were that “there are some many image galleries for the computer” so I decided to focus on some other devices. I chose the iPhone, because I think that the built in image gallery on iPhone is a bit plain and boring, and could be done much better. I started to explore with some sketches and storyboards that can be seen below.

The first thing that crossed my mind was a “globe like” gallery where one use the finger to navigate among the pictures. I was also looking on circular gallery, where the navigation goes in a circle, but must say that I did not like any of this to ideas. Therefore I ended up with a third one:

The concept here is that one starts an image gallery by pressing the image gallery button, and the gallery is fading in. By pressing somewhere in the gallery the row where the finger is, is getting highlighted and the pictures are getting a bit bigger than the ones that are outside the highlighted row. One can also use the finger to scroll up and down. Then by tapping the picture the picture grows into full size. By tilting the phone to the left and right one can browse the gallery. By shaking the phone one goes back one level.

I’ve also created a stop motion of the imagined scenario:

iPhoneImageBrowser from IvanM on Vimeo.