More screenshots of the video

I have been working more on the video recently and here are some of the extra parts i have added:

Firstly i have created a mock up of the phone screen, not a real life looking mock up but more like a cartoon mock up to suit the theme of the video. The keyframing for each individual digit took a while because they had to be edited in as separate elements in order to key them in at different times.

Screen Shot 2016-04-16 at 00.37.15

 

An animation of the progression of a chart was also created by separating the different sections of it and simply keying in the opacity from 0% to 100% which also coincided with keying in the face at the side to suit the table’s progression.

 

Screen Shot 2016-04-16 at 02.00.41Screen Shot 2016-04-16 at 02.04.45

 

Similarly to the dollar signs earlier on in the video i decided to rain down a few gym related words that are different exercises in the gym that could be completed with the help of GymScn. With these i decided to make them all the same size but to then make them 3D objects and put them forward or backwards in 3D space. I then rearranged some of the speeds that some come down to sell the effect of the different distances away. I believe that this technique worked a lot better than simple resizing to make them look bigger or smaller because it shows a slight parallax that however may not be too noticeable, would be picked up on subliminally as looking more natural.

Screen Shot 2016-04-20 at 23.35.49

Screenshots of promotional video

To start with i had to make the character Johnny – this came from a template to which i added elements of feet, hair, different arm positions and different facial expressions. These were all saved to psd files which i then imported into after effects as separate elements and used the puppet tool and keyframing to move elements to where i wanted.

 

 

johnny

 

By the time of making the video i had enough of a website in order to take screenshot of it. This enabled me to add them into the animation to explain the website better with visual elements. Although i’m sure the website will change over time so these will be outdated, it will show at least some representation.

 

Screen Shot 2016-04-15 at 21.52.08

 

Making the dollar signs rain down over the screen was probably one of the more tedious jobs of the video. Just to place all of them and then to resize and animate each one individually at different speed making sure they don’t clash too much but aren’t separated too much either took a long time. In total there were 14 and  they had to be moved and rejigged around quite a lot in order for it to look visually pleasing. Some of the ones that are blown up a lot are quite blurry and pixelated which is a shame but i think its better than having all small ones instead. Plus that would have taken a lot longer because there would have been more layers.

Screen Shot 2016-04-15 at 21.59.18

Planning Promotional Video

 

To start planning the promotional video i have started with a rough storyboard of what i would like it to look like. There are certain elements that i would like to include in there such as the use of screenshots of the real website when its done, the use of graphics such as a graph and a phone and the use of a cartoon character of some sorts in order to add a narrative to the video.

IMG_8029

I also have written the script for the video, this will now be narrated by myself as i have no other people to do it for me and i cant afford to may anyone to do it professionally right now.

 

Script

This is Johnny, He wants to get fit.

However he’s worried about not knowing what to do in the gym (arm falls off).

He also struggle to remember routines and regularly forgets what exercises he did last time.

GymScn is a brand new web application that helps you, and Johnny, achieve your goals by taking what you already do in the gym and giving improvements on what exercises to do, when to do them and even how to do them. It acts as a personal trainer for you without the hefty price tag.

So, How does GymScn work? The technology is based around scannable QR codes which are attached to all of the machines and free weights at your gym. All you need to do, is simply scan the code with our app on your phone or tablet, and then enter the details of your exercise such as the repetitions, sets and the total weight that you are using.

GymScn will then log this information, making it super easy to go back and see what exercises you have done in the past, the improvements that you have made over time (graph) and a range of your personal gym information, all at your fingertips.

No more walking around the gym aimlessly or writing tedious notes down in a note pad, the new revolution of gym routines is here…

 

Assessing the competition

In terms of competition in the fitness industry’s presence on the internet there are only a few large contenders that make up a big portion of the public domains viewing. These include Freeletics, PureGym and MyProtein and Bodybuilding.com. There are more in the market but these are ones that i use and i know a lot of other people around me use as well. As you can see form the screenshots about they all seem to use a similar style on their homepages.

Screen Shot 2016-02-24 at 19.56.30 Screen Shot 2016-02-24 at 19.56.52 Screen Shot 2016-02-24 at 19.59.42 Screen Shot 2016-02-24 at 20.00.27

The common themes i see with all of these are:

  • Top left hand corner logo
  • Scrolling header images
  • Blue, black and white colour theme
  • Relevant images embedded in different shapes opposed to the default rectangle
  • Rollover navigational bar
  • Small graphics alongside text
  • A variety of bold, italics, capitals and underlined texts.

With these top websites sharing these very common themes, i feel it is only necessary to use these and more in my own. These big companies have put a lot of time and effort into their websites and i’m sure research as well, therefore they know what works well and what doesnt. helping me along my way to making a successful good looking site.

 

I have also noticed that all of these websites use a blue theme the most on their pages and logos. I think this is something i need to reserach a bit more and figure out if this is merely coincidence or if it is something more.