Interactive Documentaries | Interface Design | A Journal Insomnia

Link: http://insomnia.nfb.ca/#/insomnia

Technology used: Jquery and Javascript

 

Insomnia is a website about 4 peoples story with insomnia. I found it strange because you pick the persons story you want to listen to then you have to book an app to see it. I thought it was going to be live or something but it;s not. It’s the person talking about their insomnia and you can press a button which makes the picture all warped or multiply. I think they are supposed to make the viewer feel like an insomniac. It didn’t work.

 

I did like the beginning of this website when we are introduced to the four faces. The way they are laid out is really effective. 4 people with different faces but one common problem. I would love to incorporate this idea into my project. The theme is quite dark and black but it does work for this topic.

 

Screen Shot 2015-02-12 at 21.12.24 Screen Shot 2015-02-12 at 21.12.28Screen Shot 2015-02-12 at 20.56.00Screen Shot 2015-02-12 at 20.56.11Screen Shot 2015-02-12 at 20.57.13Screen Shot 2015-02-12 at 20.57.26 Screen Shot 2015-02-12 at 20.58.57Screen Shot 2015-02-12 at 20.59.22

Interface Design | Interactive Doc | The Next Day

Link : http://thenextday.nfb.ca/#/thenextday

technology used: Javascript and Jquery

This Interactive video is about 4 people who tried to commit suicide and why.

It is a really nice piece that uses their audio and animation of a house. From beginning to end a part of audio plays from each person then you choose what story you want to hear next. The illustrations change when the speaker talks. It is all revolved around a house. It starts off and its a calm day and it ends being stormy. It changes as the stories going on conveying how the people feel.

Screen Shot 2015-02-12 at 18.57.59 Screen Shot 2015-02-12 at 18.59.41 Screen Shot 2015-02-12 at 19.01.04 Screen Shot 2015-02-12 at 19.01.57 Screen Shot 2015-02-12 at 19.02.11 Screen Shot 2015-02-12 at 19.02.34 Screen Shot 2015-02-12 at 19.03.54 Screen Shot 2015-02-12 at 19.04.39 Screen Shot 2015-02-12 at 19.05.14

After each person speaks for 40-50 seconds you pick another topic to hear from the stories.
Screen Shot 2015-02-12 at 19.08.40

The Storm begins as the stories get deeper.

Screen Shot 2015-02-12 at 19.09.06

The storm calms down at the end.

 

There is a nice touch at the end when you can see an illustration of each person(if it is real or not). When you listen to their stories you imagine what you think they would look like then you see what they do look like.

Screen Shot 2015-02-12 at 19.09.41

 

There is also a graphic novel version of this which is really cool. I think this would have worked well to if it was a video. They could pan around to different scenes while the audio plays.Screen Shot 2015-02-12 at 19.10.51 Screen Shot 2015-02-12 at 19.13.47

 

It’s nice to listen to each story altogether as you don’t hear the full story on the site which is annoying.

 

 

 

Interface Design | Interactive Doc | Pine Point

Technology Used: Javescript and Jquery

Link: http://pinepoint.nfb.ca/#/pinepoint

Pine point is an interactive documentary about a place called Pine Point. It was once a family mining town it is now nothing. The documentor goes back to revisit the town he once visited when he was younger to see it changed dramatically. It wasn’t the town he once loved. He documented it using old footage of the town and its inhabitants. He then used text and graphics to completed the story.

 

Screen Shot 2015-02-12 at 18.08.17

This was about the High School Year Book. I like the way he used different images to show the audience who Richard Clouteier is.

Screen Shot 2015-02-12 at 18.07.04

Screen Shot 2015-02-12 at 18.06.51

 

This is one of the ways he laid video into the site. The design on the video matching the rest of the design on the site. Screen Shot 2015-02-12 at 18.06.01

 

Using video in the background and graphics in the foreground is a good way to use old footage to fit your scene/story. Screen Shot 2015-02-12 at 17.56.39 Screen Shot 2015-02-12 at 18.10.32

Many of the stories he tells are in text like the above and you can flick through different pictures and video that are used as the background. I like this idea of having text and picture so the viewer can chose what picture they want to see and flick through it if they don’t like it. Screen Shot 2015-02-12 at 17.56.11 Screen Shot 2015-02-12 at 17.56.09 Screen Shot 2015-02-12 at 17.55.57 Screen Shot 2015-02-12 at 17.55.54
Screen Shot 2015-02-12 at 17.55.35