Interactivity

Within my project there is a high level of interactivity. "Interactive communication is superior to conventional, one-way communication." (Crawford, 2003: p13). Interactivity is important as it attracts and engages an audience. Below is a list of some of the interactive elements that are coded into my project and their locations:

Memory:

Slider/s: 

Click & Drag Objects:

Click & Hide Objects:

External Links:

Follow The Mouse:

References
Crawford, C. (2003). The art of Interactive Design. San Francisco: No Starch Press.

Girl Online So Far - One Month Left

This is currently how my project looks:

With one month left until the submit I am feeling confident.

To Do List:

• Sort out linking of buttons
• Add 'memory' to the start of my project
• Finish and animate last slide
• Implement sound into the project
• Conduct user testing #2

User Testing #1

For my first part of user testing I showed five participants the structure diagram and interactive .swf of Girl Online (click here to view) and then asked them to fill out a short anonymous questionnaire.

Questionnaire Questions:
Do you think Girl Online is easy to navigate around?
Do you think Girl Online has enough pathways?
What do you think about the ending/s of Girl Online?
Do you have any notes regarding the story of Girl Online?

Questionnaire Answers:

Ethics Approval Form

Here is a copy of my ethics approval form for my user testing.

Key Words

Am I on schedule?

At this point I thought it would be a good idea to view my gantt chart (developed for project planning and management) to see if my project is on track.

I am currently at week 8, according to my gantt chart I should be halfway through project production. Currently I am on track, as I have just taken and edited the photographs for my project and I am currently importing all the content into my frames. The only thing pushing me behind time is the fact I have no yet completed any user testing, however this was because I didn't receive my ethics approval until last week, so it's next on my to-do-list!

Editing

Currently I am editing photographs for my project in Adobe Photoshop.
Here is a before & after of my photos I took of Eleanor.
I use the techniques previously mentioned in this blog post.

Taking Photographs For My Project

Today I took photographs for my project. I recruited fellow university of Hertfordshire student Eleanor Bishop to play my female character. I used a plain wall to take the photographs against so that it would be easy for me to edit out the background. Once I had set-up I then took photos of her in a variety of different positions and with a range of different expressions using my Fujifilm X30 Camera. The un-edited photographs are below:

Characters

My project involves three characters:

Victoria: Girl

Originally I had named my female protagonist Victoria. However I thought it would be more interesting and fun to have the female character named after the user, this way the user would be more involved with the game. To do this I will code 'memory' (the user will have to enter their name at the start of the narrative, Flash will then remember the name and it will pop-up (when necessary) throughout the game). In terms of visuals a fellow University student volunteered to be photographed and play the part of the 'Girl Online'.

Charlie: Boy

The male in my narrative is called Charlie. He approaches the female character (online) and attempts to lure her into meeting up with him. Charlie will be seen as an attractive young boy (on Facebook) and an anonymous white figure throughout the rest of the scenes - suggesting that he doesn't look like his Facebook picture.

Unnamed: Mum

The girl's mum appears briefly in my project, she interrupts the girl when she is getting ready to meet Charlie. She acts as an intervention which the user can either lie, ignore or listen to. For visuals I edited a royalty free photograph of a woman from the web, as 'mum' only appears once I didn't need to take photographs myself.

Statistics

• A third of 15 to 18-year-olds in the UK have met someone in person they originally met through social media.
• 69% of teens regularly receive personal messages online from people they do not know and most of them do not tell a trusted adult about it. 
• 25% of people said they felt happier online than in real life
• 10% say their online friends know them better
• 25% of teenagers admitted they were addicted to social media but 62% thought their friends were instead
• 25% wished they could give up social media
• 13% said their online friends knew them better than their real-life friends
• 51% of the respondents said they felt it important to check a notification as soon as it came through.
• The average Facebook user doesn’t know one fifth of the people listed as 'friends' on the site. 
• Nearly one in 10 teens (8%) has posted his or her phone phone number online.
• 14 percent of 13 - 18 year olds have accepted an invitation to meet an online stranger in-person.
• Teens whose parents have talked to them “a lot” about online safety are less likely to consider meeting face to face with someone they met on the Internet (12% vs. 20%). 

These statistics show how the internet is now a part of our everyday lives! 
I was quite shocked to learn how many teens are approached by strangers online, by raising awareness of these issues I hope that one day these statistics will dramatically decrease!

References

BBC Newsbeat, (2014). 1 in 3 teenagers meet social media 'friends' in real life. [online] Available at: http://www.bbc.co.uk/newsbeat/29457870 [Accessed 17 Mar. 2014].

Adweek.com, (2011). You Don't Know One-Fifth Of Your Facebook Friends. [online] Available at: http://www.adweek.com/socialtimes/you-dont-know-one-fifth-of-your-facebook-friends/332373 [Accessed 17 Mar. 2015].

Onlinesafetysite.com, (2015). Internet Statistics about Teens. [online] Available at: http://www.onlinesafetysite.com/P1/Teenstats.htm [Accessed 17 Mar. 2015].

Internetsafety101.org, (2015). InternetSafety101.org: Statistics. [online] Available at: http://www.internetsafety101.org/predatorstatistics.htm [Accessed 17 Mar. 2015]. 

Visual Style - Thoughts & Decisions

My visual style has changed from my original idea. After viewing Richard McGuire's book Here, I decided this is the visual style path I wanted to go down - I really liked the use of simplifying images and using white silhouettes.

Before Sample Frame Style:

After Sample Frame Style:

As you can see my original plans were to have quite dark and over-exposed photos collaged together. From my original plans I have kept the font and primary colours the same - as I still think they are appropriate and fit my project well. Overall I am happy with my changed visual style, I think it looks effective and more professional than my original plans.

Visual Style Research: Richard McGuire - Here

In terms of visual style one book that inspired me was Richard McGuire - Here.

McGuire picks out patterns and textures to keep whilst flattening and simplifying other images to create a cut-out collage feel. I think this type of visual style is unique and interesting. I also like the use of colour in the book, each scene has one primary colour and sometimes includes a splash of another colour to make objects stand out or to link one scene to another.

Manipulating Images - Techniques

To create my collages for Girl Online I am collecting images and manipulating them in Photoshop. One technique I used was turning photographs into line drawings, to do this I followed the simple instructions below:

• Duplicate the image on top of each other
• Colour dodge and invert the top image
• Add the Gaussian Blur filter to the top image

After

Another technique I used was to 'simplify' my photographs. To do this I added the 'cutout' filer to my images and manipulated the levels and edges of my images.

After

Mapping the Story - Structure

To help me compose and connect my narrative paths together I decided to create a visual structure diagram. Below is my final interconnecting story. Pink notes symbolise an end and green notes symbolise a connection.

I then put my structure into Flash to give users a better understanding of the flow of my narrative story. Click on 'Girl Online' to explore.

________________________________________________________________________________

________________________________________________________________________________

Experimental Collages

Below are some draft collages I have created in Photoshop for Girl Online. Influenced by the works of those in my research.

Scene:

Object:

Person:

Joseba Elorza

Joseba Elorza (also known as MiraRuido) is a Spanish illustrator and artist. 

"In his works he uses copy and paste as a technique to de/contextualize the general knowledge, re/configure our senses and re/mix the known past with the unknown future. His works show collages of a different world, in which everything seems to be possible."

The 2013 'Air Review - Young' music video, directed and produced by Elorza, really inspired me. The use of photos and video pieced together looks really effective and unique. I also really like the motion of the piece, the use of slight animation and image movement really brings the piece to life.

Valero Doval

Valero Doval is a Spanish collage artist. Her work commonly combines illustration, vintage imagery and nature and has been described as "an enlightening mix of illustration and collage filled with color, wit and style."

I really like the way Doval takes portraits and adds imagery to them (for example the image on the right), the woman looks like she is dreaming about love and happiness. I can definitely take inspiration from Doval's techniques.

Font

The main font I used in my project was My Underwood, downloaded from Dafont.com. I liked this font as I feel it looks edgy and different, and suits the mood of my project.

• Tension Type, (2015). My Underwood Font | dafont.com. [online] Available at: http://www.dafont.com/my-underwood.font [Accessed 27 Apr. 2015].