Project Milestones

February 3, 2008

Storyboarding & Conceptualisation

I thought the story was quite clear and easy to deconstruct since it did not pose a complex order of events. I broke down the story into “text order” that helped me to put it back into “story order”. While doing so I identified the changing point of views as the defining characteristic of the narrative. Consequently I thought the text represented a multiple story line model …

Multiple Story Line

After having deconstructed the story and knowing what the plot was all about we had to answer the following questions..

  • What elements should be interactive?
  • What type of role should the VURP have?

Since we thought the different perspectives were a key element in Kafka’s story we decided on allowing interactivity on the character level. The user can switch between point of views but not influence the events taking place. It might seem obvious at first but we felt we had to respect the author’s logic.
Time is another interactive element in our product. Besides choosing characters the VURP can stay in once scene/map as long as he wants in order to reconstruct the story line.
The VURP is an observer and watches how the story develops by changing POVs and exploring different maps. We changed our initial idea to unlock each stage after the user had solved small puzzles, since those challenges did not really add anything to the storytelling. Instead we included the maps and extras to add a more explorative character to our interactive narrative.

Group Production Techniques

Roles were as follows:

  • Dieter: project manager, video (editing)
  • Regine: video (recording), presentation content
  • Imran: storyboard, sound
  • Emily: Flash lite
  • Lee: storyboard, website

Unfortunately we did not have one single usability leader meaning we all were involved in testing. Nevertheless we gained valuable results out of the paper prototyping.

Like in previous projects everyone tried choosing responsibilities they were unfamiliar with. I for my part was interested in creating the interactive storyboard and editing the music for our story.

Production Planning & Scheduling

After assigning roles to each member we had a rough idea of our production plan :

11th – 17th Jan: Brainstorming, conceptualisation, paper prototype production.
18th Jan: Paper prototype testing.
19th Jan: Play-doh modeling and set scenery production.
20th – 21st Jan: Filming
22nd – 23rd Jan: Video editing, compression and sound editing
24th Jan: Combining video and interactive elements in Flash Lite
25th Jan: Final product usability testing
26th – 27th Jan: Compile findings and practice presentation

We did not meet the last deadlines since Emily and Dieter had trouble with Flash Lite. During the last weekend they dealt with the last issues with Flash Lite and Usability testing, while Regine, Lee and I prepared the presentation.

Technical Prototyping & Testing

Our paper prototyping turned out to be quite effective. After every single test we would make the changes to see their immediate effect during the next test. I definitely believe it is a good way of testing mobile applications.

Even though our group did not have a designated usability person I feel we’ve learnt quite a lot when it comes to incorporating the user into the design process of an interactive application. Throughout the entire design process it is necessary to think of the needs and wants of the users.

If I look back at our paper prototyping I believe we gathered several findings that made us improve our concept. Even though our final product remains a bit buggy because of technical reasons we’ve tried our best to make the navigation as intuitive as possible.
If I had to redo this project again I would definitely insist on having someone responsible for all the usability research.

Software Inter-relationships

Throughout the project most of the group members worked with different software. Regine created the animations with Quicktime Pro. Dieter used Final Cut Pro to edit the videos, while Emily was working with Flash Lite. I used Audacity to edit the songs and iMovie to preview the sound files with the animations. As far as I know there were no problems with the compability of files except Flash Lite not accepting the Illustrator files Regine had designed for Emily. As a result the maps had to be redesigned in Flash Lite.

Asset Management Strategies

Everyone in the group used similar asset management strategies, i.e. having separate folders to organize all sorts of files (docs/ai/flas/mp3/mov/html etc), in order to keep everything well organized. When changing names of prototypes and structures we decided on giving them version numbers. All this enabled us to exchange files without any trouble.

Compression Techniques

As far as I know Dieter did not have any major issues with the compression of the video files. Even though we were quite restricted by our platform (mobile device), he managed to find codecs that would reduce the file size without loosing too much of the quality.
Once I passed him the mp3s I had edited on Audacity the file size increased considerably it was still possible to run the application on Device Central.

Scripting Efficiency & Product Optimisation

After the usability testing I gathered further ideas on how to optimise the product

  •  Automatically pre-select an option such as “start” on first screen. Alternatively add a border that is blinking.
  •  Make maps more distinguishable. So far time on the top right is the only thing that changes. Therefore change background colour.
  • Show the user he can choose between different POVs.

Debugging & Modification

Our decision to work with Flash Lite turned out to be quite a challenge. Cliff had warned us about the restrictions of the application but it was still frustrating to experience it ourselves. Emily spent a lot of time adding the videos to the navigation and found several bugs during the debugging phase. If Dieter hadn’t helped her we would not have finished our product in time.

Almost there ..

January 31, 2008

So today .. one day before the presentation .. we met at the Student Hub on Davies Street. While Emily and Dieter were trying to sort out the last issues with the application, Regine, Lee and I had a look at Lee’s presentation. Unfortunately it was a bit difficult to make changes to his presentation since he had created the whole template consisting out of images. We were running out of time and I decided to fix and add all the new content at home meaning I would have to open several psd.files, create jpegs and include these in Lee’s html files etc.

Usability testing

January 31, 2008

Process:

This test was conducted by 2 group members and lasted approximately 20 minutes.
Emily introduced the product running on the mobile device emulator and asked the participant to navigate through it while Dieter wrote down the observations.
Once the user had gone through the application he was asked to fill in the form we already had used during the prototyping phase.

Findings:
Issue 1: 2 users had some trouble navigating but figured it out halfway through the application
Issue 2: 2 users did not like the fact that they had to restart after pressing on the “back” button.
Issue 3: 1 user suggested that at one point the selection screen was “packed”.
Issue 4: 2 users did not give too much importance to the “watch evidence” option.
Issue 5: 1 user did not understand that dark-grey character was inactive.

Recommendations:
Recommendation 1: “back” button takes you to previous screen.
Recommendation 2: Only show last 2 maps on the selection screen to avoid too much information.
Recommendation 3: Highlight “watch evidence” option by changing its colour.
Recommendation 4: Animate (blinking, glowing etc.) selected character so that user knows where he is. Reduce transparency level of inactive characters.

Fortunately we managed to do the usability testing on Sunday meaning we finished everything in time! Phew..

Last days ..

January 29, 2008

Time’s running out and we’ve still got some work to do.

Flash Lite is causing some problems meaning Emily won’t finish a bug-free version of the product on time. So we’ll have to complete the usability testing during the weekend. And prepare & rehearse the presentation.

Even using Flash Lite 3, we found there was a very large gap between the capabilities of Flash and Flash Lite. Dieter has assisted Emily with the coding  and debugging so we should be fine .. :)

Compression

January 24, 2008

Compression was not a big problem since we created stop-frame animations. Nonetheless Dieter spent some time trying out different codecs in order to keep the file size as small as possible (considering the file size limitations of our plattform).Dieter managed to keep the size as small as possible despite the fact my song files were not as small .. approx. 2 min length @ 128kbps

Sound editing

January 23, 2008

I’ve started with the sound editing. The last couple of days I’ve been listening to some music I think is suitable for our story. I’ve decided to use music by the composer/pianist/genius Max Richter since I think it fits perfectly to the kafkaesque theme ..

I talked to Regine about adding the music to our application .. wondering when to start playing the music? The initial idea was to link the entire movie together using a single looping track but then I realised that it would be impractical as it was difficult to create the right atmosphere at particular parts of the film.

Since we have divided our movies by moments in time  and each of these moments have a particular emotional theme (building up the climax), Regine suggested we should try using different looping tracks. This would help to link together each point of view within a single time frame, and differentiate between the time frames.

  • 9pm – Anticipation. Schmar, Mrs Wese and Pallas are all waiting for Wese.
  • Bell rings – Preparation. Schmar, Mrs Wese and Pallas all react to the sound of the door bell and prepare for Wese’s arrival.
  • The murder. Suspense and climax.
  • Confrontation – Pallas confronts Schmar over the murder.
  • Aftermath – Despair. Schmar reflects and is led away by police, Mrs Wese collapses on Wese’s body.

Eventually I created 5 mp3 approx. 2 min long and handed them to Dieter/Emily in order for them to incorporate them into the fla’s.

.

Software

January 22, 2008

Dieter showed us software called iStopMotion and Single Framer to produce our animations. At the end none of those were used. Regine used her digital camera and shot tons of still photos to eventually make short clips on Quicktime Pro. Probably the best solution since it allowed us to make changes to characters and shooting angles. Dieter then edited the videos on Final Cut Pro.I’ve started to think of my job as a sound designer. Will use Audacity to edit the mp3sI’ll choose ..

Filming ..

January 22, 2008

The filming has been fun but hard work as well….

  • Play-doh dries out quickly .. means Regine and Lee have to make fresh characters all the time.
  • I had the idea to use background images for the scenery instead of having everything made of play-doh. Saved us time and looks quite good in fact.
  • Lee’s got the talent to create amazing play-doh models
  • Everyone’s doing their job quite well.

Stop-frame / Play-doh

January 20, 2008

One of my initial ideas for the visualization of Kafka’s story was to use figures (Lego?!) instead of us acting. I tend not to like students acting in their own movies .. doesn’t make it look too professional I guess. Regine then suggested making stop-frame animations which we all agreed on. On the other hand we wanted to keep the story kafkaesque .. keeping it mysterious and tragic.

Production plan for filming ..

  • meet at Regines’
  • Lee makes the models
  • Emily and I create the scenery
  • Regine and Dieter make the stop-frame animations

Screenshot:
mrs wese—–

The planned schedule is as follows:

Saturday – Model and scenary production
Sunday to Monday – Filming
Tuesday to Wednesday – Video editing, compression and sound editing
Thursday – Adding the interactive element to the video
Friday – Usability testing
Saturday to Sunday – Finalise and practice presentation

Findings:

  • Users did not get the idea of a paper phone at first and thought more of a touchscreen-based navigation.
  • Most users found it quite difficult to understand the map. They did not realize they had the possibility to choose other characters by using the arrow keys.
  • Users did not understand the story because they spent a while figuring out how the navigation works. Screen with instructions not really helpful.
  • One user complained about not having the option to ‘go back’ when he views a map.

Recommendations:


We felt we had to do some significant changes to the map so we rearranged the layout.

  • Move display of selected character to the top of the screen where it is more visible.
  • Add 2 new buttons “watch scene” and “watch evidence” to illustrate the choices of the user.
  • Include an arrow-key icon to show the users the importance of navigating up/down and left/right.
  • Include the “back” option on map level.
  • Add an indicator showing what button user is on.
  • Change wording on instructions screen to help users understand the navigation better.