Advanced Web Technology — WEB14302
What I did on the project WEB14302
The advanced web technology unit provided many challenges, in the initial lecture Innocent and myself discussed possible ways in which we could create a project which incorporates video and interactive elements. We came up with multiple ideas around adding additional information to the video using code to enhance the experience. Customisation is something that is key to an interactive experience so in order to customise it we thought of ways we can scrape information about the user, using things like the Facebook API or a form at the begining of the experience could help us to create a more immersive project. With Burak later we thought about using existing video content, using existing content would decrease the work load in terms of content creation and allow us to focus more on customising the experience, we came up with the idea of a customised episode of Friends. Friends is an iconic TV show that many are familiar with, because of that customisations for the user are obvious and can draw on what the user knows about the TV show. Friends has been out of production for a significant amount of time, this makes it ideal for showing the possiblities of how we can customise an interactive experience for the user to demonstrate to those who may be interested in creating one for something that they are currently try to promote as they can relate it to how it would work for their show as they’re likely to be familiar with the content and it gave us a lot of potential video content to use.
We began looking at elements we could customise of the episodes and scraping together episodes with relevant content, we decided to try to make the storyline based around an event for the user such as their Birthday so began looking for episodes with birthdays and the Characters getting ready. I began working on the site whilst innocent edited footage that Burak had found and marked up. For the website I found a picture of a retro TV online which I cut out in photoshop and changed elements to make it interactive for the user, I tested putting some MP4s into the video using the friends titles and found that it worked, I then decided to implement a form and look at getting user data into the website, I’d tried using the facebook API already and could only get minimal permissions without having the app all the way completed, I wanted to get an as immersive experience as possible but getting the user to fill out as little information as possible. To get additional information I decided to see what the browser can access and got the user location and also request access to their webcam and microphone, I thought other impressive things that I could get from the user would be their name, to choose a music genre, their phone number and postcode. I sampled trying out what I could do with all of this infomation, I looked up a way to use HTML5 canvas to show the webcam of the user, this is only supported in firefox and chrome but is a cool effect, I also used CSS animation to live write their name in the friends font so i could add them into the titles, I use the user location from the browser and their postcode to request multiple location images from the google maps api of locations that the user would be familiar with using street view and satelite view. I also researched how we can send text messages to the user with an api, I found these guys called clockwork sms who do it really simply so that I can send a text just be redirecting an iframe on the page, it’s open to abuse so couldn’t go on the site but works for demonstrative purposes.
I also created some interactivity with the tv screen to make things move about although they serve no purpose just to make the experience nicer.
This project was really interesting and I learnt to do some things I didn’t know I could do but it was overly ambitious and doesn’t have enough of a high quality finish in my opinion, just the titles and a short scene would’ve allowed us to make a slicker experience. Friends is really difficult to edit as it has a laugh track and a strong story line it is difficult to change because of this the story doesn’t make huge amount of sense but the customisations work in a cool way and the project has potential for the future. With this project how i would change it to make it a good shareable product I would make it a shorter experience using just the titles and ending scene to make it a more concise customised experience.