TECHNICAL

Learning New Softwares: After Effects and Premiere Pro

aftereffectsevid

By using YouTube tutorials and forums I self taught myself Adobe After Effects. Some of the skills I have developed are layering video and still image, layer masks, inserting shapes and animates, text, enhancing video footage, key framing etc etc the list is pretty endless. I would edit together short sections of footage, export them from AE and import them into Adobe Premiere Pro in order to piece together longer reels of video. This process was very very time consuming!! A process which I had allocated a lot of time for however it seemed to take forever! I quickly learnt the importance of setting up a project correctly and ensuring the auto save functionality is well and truly switched on after losing many hours of work right at the beginning. So mix a loss of work, a longer process than first assumed and a gazillion other things to worry about… this was beginning to take its toll and the stress level was rising.

prempro

 

Although after effects has an audio functionality, I found the audio much easier to work with once the clip was in Premiere Pro. I think this would be an area I would wish to improve on because the software is so clever but because I was teaching myself I never quite managed to learn everything. I tried to complete each video to professional and polished final quality because these videos were the heart and sole of the project – they needed to be good. By incorporating what I have researched about sound recognition and emotive responses caused by certain sounds, they also needed to be included carefully and purposefully.

Filming Real Life

IMG_6981

In order to create my body of content, I needed to get my filming hat on! Here is my trusty camera assistant Jessica Scott. I used my Go Pro camera to film recognisable parts of Bournemouth that I was later going to layer with images of the same place taken from social media channels. The reasons for using the GoPro was because of ease of use… I had the handy head cam attachment, and also the top drawer HD quality. The camera itself is a sports camera, meaning it is used for capturing jerky and fast moving objects. It has an inbuilt steadier which takes out the shakiness I would have got with a handheld camera. Additionally from the very first vid (the news feature) I was not impressed with the handheld camera quality at all. So apart from a view funny looks, our afternoon of filming as successful! The merky weather and grey sky was perfect for really emphasising comparisons between online and offline life and how images now on SM are edited to look so much better.

Interactivity Code Elements: Problems

Cross Browser Compatibility. 

This was my problem. It is so easy to get stuck in your own world and your own laptop and forget that not everyone uses the same things as you do.

To overcome problems faced, which was both installations failing to work in Safari we had to change our plan of action.

For the Twitter speaking page, we used a plugin called myspeak.js.  The reasons we used this plug in was because it is a universal platform using only Javascript, which meant it did not require detecting the user agent and would have cross browser compatibility.

For the webcam plugin we were initially using a Javascript only plugin, however this did not allow for the webcam function to be loaded in Safari. To overcome this we instead used a Flash plugin that once set up was much simpler to use and didn’t alter the overall look or feel of the plugin. The “allow” or “deny” pop up was not something I had anticipated and did ruin the element of surprise that I wanted to add the piece. However sometimes these things just cannot be helped. I think for the viewers pieces of mind and privacy it is very relevant and additionally a disclaimer must be somewhere to ensure they are not worried than the footage is being recorded or stored anywhere!!

Interactivity Code Elements

So my portfolio of artistically visual  engaging pieces is starting to take shape however I want to take it to the next step. I want to put the user in the piece and I have chosen to do this in 2 different ways.

  • Using the webcam

Analysing peoples pictures was hot topic of discussion throughout the research process with people being openly admitting to judging other peoples pictures and then having to almost remind themselves that other people would be doing the same about them. By using a webcam plugin I aim to pull the live image of whoever is engaging with the piece and making them believe that their face is in a live social media image environment. By mocking up a page whereby a live feed of comments of what people are actually usually thinking when they see their image upload online, this will demonstrate not only what people are really thinking when they see pictures or upload pictures themselves, but to make to the viewer feel uncomfortable and to poke fun at the fact that they would not truly enjoy a life online quite so much if they really did feel as exposed in real life and not just through images and status posts.

The design aspect of incorporating a live webcam image is relatively easy to mock up, with the webcam image box imbedded in a page and then the surrounding image can be designed as a Facebook photo page.

  • Using live Twitter stream

This project is all about the blurring lines between social media online and off… so since Twitter has often been criticised for people just “shouting” about stuff one really cares about, I want to turn this on its head. I want Tweets to be read aloud as if they were being spoken. This will be representative of how people wouldn’t really behave on Twitter how they would in real life and again poke fun at the fact that we engage with social media at all. Since research has suggested that “hashtagging” is the ‘done thing’ and that people do it either because other people do or to be funny, the functionality of this interactive section will occur from people searching a word and then a tweet with a hashtag of that word will be read aloud. The functionality of this will be quite complex, especially if I want it to be live. It will require registering as a Twitter app developer and getting an API key.

Having openly admitted that code is not my strong point I have located help from Dominic White, a Ba (Hons) Computing final year student at Bournemouth University. By working with somebody outside of the course and building cross course collaborations I feel I have improved my communication skills and furthered my computer knowledge more generally. Dom has acted similar to that of a tutor which I feel has benefited my personal development more so than  a straight swap collaboration would have done because I have seen the code parts grow and form from the very beginning. By working through the coding aspects of both these interactive elements, I now have better under Twitter API’s, Jquery, Javascript and  how plugins work.

 

MAJOR PERSONAL ACHIEVEMENT *round of applause please*

In a time as stressful as this, it’s important to emphasize the small things in life.

After working really hard in trying to develop my personal skills in terms of HTML, CSS, PHP and Java I have managed to code a mobile responsive website template complete with drop down navigation bars and everything. Okay Okay so I am aware of how simple this sounds but for me its a huge achievment and means I can get underway with coding the website portfolio to host my mini series of “The Hashtag Life”.

Last week I have been in talks with fellow course member and Leeroy, as well as a post grad student from Plymouth Uni, Chris, who have led me on the way to coding my Twitter in real life installations where tweets are read allowed after the user searches for whatever term they like.

 

Reiteration of the project idea:

For my graduate project, The Hashtag Life, I am creating an interactive online portfolio of digital art. The projects aim is to make the users/audience question their own usage of social media and the impact it is having in terms of real life interaction. For a small section of the portfolio I am looking for somebody to help me code a “Twitter in real life” experience. I basically want users to be able to search for a hashtag word and for the most recent tweets to be played back to them via spoken sound as if the tweets were being spoken allowed. This is to show how bizarre tweets would sound if they were actually spoken in day to day conversation.

I think I need to use the twitter API to store tweets in a MySQL database, then build a search so the users can search words. By capturing the results in an array in JavaScript or jquery and then pass the array of tweets from the search results through a text to speech API (all of which using Ajax to make it asynchronous)…. I hope this makes sense and there may be a better way to do it?

Addtionally, a webcam plugin where the the viewer is put in the experience…perhaps in a profile picture scenario…

 

 

Breaking News #ConversationCrisis

My main focus is to get whoever interacts with this project to reflect upon their own usage, their own dependance and there own behaviour online. This is the first video I have created for the project and it aims to win the audiences attention straight away, and be believable.  I feel this little video in itself done this because it shows how our smart phones are glued to our hands, even when they really shouldn’t be – for example in the middle of a sports game?! This video aims to poke fun at the fact that were all more engaged with what is going on online than we are with each other and the space around us.

The video itself gave me the perfect opportunity to develop my personal skills in scriptwriting, storyboarding, videoing and editing, something I was a little out of practice with.

 

IMG_6743 IMG_6744

I recruited the help of BA Multimedia Journalism final year student and good friend of mine, Jessica Long, to help out with the news feature. Playing the role of stern and serious news reader, Jess did a great job and was a great help in terms of bringing her journalism experience to the table, which enabled us to strengthen the script and ensure the feature was edited appropriately to fit the new feature format. Alongside my collaboration with Dom White from Computing, Jess is my second cross course collaborative partner. Again I feel this has really helped my personal development and extended my skills because instead of getting somebody else to do the work for me, I am learning from them and working with them and broadening my own skills. This is so important for someone who lacks solid direction in terms of a career path so I feel this was a good decision.

IMG_6755 IMG_6756

 

 

Overall, I am happy with the final product of this mini vid. However, the quality didn’t export quite as good as I expected which is something I need to look at for future video pieces. The sound as well wasn’t as clear as it could have been – ideally I would have redone this however time constraints just wouldn’t allow for it at this time. By doing this shorter video, I was able to overcome aspects of the problem I had faced with the previous idea which had been creating a narrative that was strong and engaging.

The editing software I used was After Effects and then Premiere Pro. Both programmes I have had totally minimal experience with however I feel I got the hang of them both quite quickly. The exporting process of videos however I need to look into, particular with regards to what channel I use to upload them to a web site portfolio page because an large embedded file will be difficult and slow to load and YouTube has its own readjusting thing it does to videos? ….

 

 

Production Analysis: Technical

carousel-gif

The technical aspect of my project requires me to create a totally immersive experience for the user. I still want to tie in my very very initial idea that I pitched back in November and this means utilising social media channels to distribute my project…..

This is why I am creating a series of videos, all linked together in a network, the network has different path options determined by the user. All of the video will be hosted on the YouTube channel I have specifically set up for this piece of work. The individual videos will have links at the end of each one for the user to decide what path to take through the experience and what video they will watch next by clicking on the link.

The video will also be uploaded to The Hashtag Life portfolio website. http://www.untagme.co.uk where there will be some background information and some fun codey stuff  (yes I am attempting tricky codey stuff! I’ve even learnt what API means and everything, plus I am registered as a Twitter developer so thats got to mean something! 🙂 …) . This will involve imaging tweets out loud for the users to engage to see just how bizarre twitter in real life would actually be.

This in turn not only will this improve my HTML, CSS, PHP and Java knowledge and understanding immensely, but will also allow me to focus on my main interest for the future which is to work with video design and photography. This project will allow me to polish my expertise in Adobe After Effects, Premiere Pro, Photoshop and Illustrator, all of which are going to be useful for career choices after uni.

Offline Environment Online

maps-breakdown

Seeing something from all angles. There is a whole hidden story behind the world in which we see in front of us.

Inspired by the works of David Hockney, the interactive joiner image of an offline and online world could be interesting to explore. I think the strong image shown by still joiner images really gets across how looking at the same object but from lots of different angles gives a totally different impression of such object. This offers further understanding as to what is meant when I discuss how people respond and react differently to what other individuals post online, i.e. preconceived ideas about traditional online protocols. For example, the selfie – people who take selfies are commonly described as vain or attention seeking but in reality they are not like that at all.

Some joiner image examples:

hockney-furstenberg-paris image2109 photo_joiner___my_room_by_wardy360

Methodology and Technology

Technologies which can be utilised to create a fictional environment online:

  • Google Analytics to assess where the main viewership is coming from – to better utilise audience participation and interest.
  • Webcam?
  • Facebook and Twitter Accounts
  • Creation of the main “Hub” to include a live twitter feed of story direction – blog style of one of the fictional characters
  • Photo and video editing to generate content to move the story along and engage with audience viewers
  • Design and Set up a “hub” website using knowledge of HTML and CSS
  • Plot key events to include in the script
  • Develop a The Hashtag Life THL  logo and visual branding
  • Prototype mind map – show core functionality.
  • Create Production schedule – launch dates?
  •  Final delivery method
  • Research/Audience
  • Facility requirements – how can I record this process if it live?