Monday, May 27, 2013

Thursday, May 9, 2013

LandingPage & LoadingBoostGauge


FullThrottle Proposal


Executive Summary:
Full throttle is an action/sci-fi film concept developed by designer and photographer Eugene Chan, a speed racing/war video game concept developed by our team to give something new to the video game field that consists of the thrill of racing games and the action of eliminating your enemies with weapons. Geared for the entertainment market and specifically hardcore action thriving gamers. Our team has built a micro site for the purpose of promoting the concept, which would be developed in the course of eight weeks.

 Current Situation:
Our team consists of four designers and two writers. The concept for the film was developed by one of the writers and further developed as a video game by the efforts of the team. The micro site concept was developed by the team as a promotional strategy to help promote the concepts and collect statistical feedback. We specialize in entertainment design and entertainment concept development.

Targeted Audience:
Our targeted audience is males and females between the ages of 18-30, average action fans and hardcore gamers from all industrial sectors. The language and the graphics are not suitable for anyone below the age of 18. Our targeted audience should be acquainted with vulgar imagery and extreme gaming, and own one or more gaming consoles.

Project Goals:
This micro site is built for the purpose of promoting the film and introducing the video game that is coming soon on the market to the targeted audience. It provides information about the vehicles in the game with a 360° preview, an interactive flash game competition to help widen the fan base, a short trailer clip to serve as a video teaser for the film, graphic pieces available for free download for the fans to enjoy as wallpapers, Facebook covers and etc., a merchandise page that allows the user to purchase products online, such as t-shirts, tyre service kits, water bottles, umbrellas, non-slipping mattes and caps. The website –once it’s up- will also serve to provide feedback in terms of the spread of the promotional campaign via statistical feedback of the visitor count, and the flash game competitors.


Creative strategy:
For the website, we’ve decided to focus on the captivity part of the storyline in the intro. It starts with a metallic gate that opens horizontally when the website is fully loaded, and refers to the point where the plot takes shape when the main characters are held captive inside the virtual reality game. We’ve used bullets for the loading bar to hint that this is not your conventional racing movie/video game.
















Image: loading page preview


We followed a simple black, grey, white and red color scheme and the edgy, shattered typography to emphasize the action/thriller genre of the concept.










Image: 360° vehicle showroom preview


The website comes in a horizontal grid, horizontal menu bar for different page tabs and a centered space for the content. It does not involve scrolling up and down to avoid giving the impression of overwhelming content and subsequently bore the audience.


Image: store page preview














Image: video game promotional tab preview


Technical Strategy:
This website is a combination of flash and HTML, in order to have the grabbing, interesting aspect of flash and the lightness and speed of web-language based websites. The flash elements aren’t overwhelmingly complex, a grabbing loading intro to excite the visitors and keep them at edge while the website is loading and an easy navigation menu on the top with clear one or two word description of each page on the tabs, there would be the interactive flash game and the 360° preview tabs to develop on Adobe flash as well. The still graphical elements are designed by Adobe Photoshop/Illustrator and will be further developed on Adobe Dreamweaver. The flash components are yet to be developed and would approximately be done within the first two weeks of the project implementation. The interactive flash game competition would be developed entirely by the 6th week, while the whole set up of the website would be completed by the 7th week, which leaves the eighth week for testing, finalizing and uploading. The website will provide secure browsing and the merchandise store would support credit card payment/PayPal accounts. The store would have a user-friendly interface that displays the options available for each product on the showcasing page, and more detailed information on each product’s page, with the option of purchasing immediately from the showroom.  Interactive social media links would be provided to easily connect the audience to the social media accounts that will provide consistent, quick and easily-accessible content, and will be developed during the design process and put up shortly before the website is up. The 360° preview is an interactive flash preview of the vehicles that would allow the user to view the entire design of the cars from every angle. The movie trailer tab will contain a video frame gadget that enables the viewer to watch the video on the website itself. Which leaves the home page with a short text synopsis of the film, the downloads tab which would consist of a simple HTML gallery with different links for every size of download, and the games tab which will be there solely to promote the upcoming Full Throttle video game. The website will provide different languages symbolized by nation flags for a more user-friendly interface.
Implementation Process:
The implementation process breaks down to these steps:
1.      Flash content development (360° preview, interactive flash game, loading page) – the first 6 weeks
2.      Content writing – second week
3.      Still graphics – the first two weeks
4.      The coding process – developed and tested throughout the 8 week period
5.      The online store development – developed and tested throughout the 8 week period
6.      Social media pages – built and developed throughout the 6th and 7th weeks
7.      Translation process – developed and tested during the 5th to 7th week
Week 1 - Research and idea development, concept planning
Week 2 – Idea development and finalization, Solidification of desired design direction, initialization of design process with creation of webpage background, theme, tabs and task allocation
Week 3 – Photography of characters and vehicles to be implemented into movie; Characters for the synopsis tab, cars for 360° preview, interactive flash game and exclusive content downloads
Week 4 – Fine tuning of all elements, organizing and preparation of tab sequences, loading page and content placement. Design teaser for pc and Xbox game launch teaser.

Summary:
This project will require a relatively low-budget promotional campaign for the film and video game concept with consistent and reliable feedback.
The website will provide a complete visual experience for the user to showcase an exhilarating teaser of what the film and video game would turn out.
This micro site was developed with a primary objective of engaging the target audience full on with an exciting interactive experience that drives hype and generates interest on a large scale with the interactive game as the front line of our marketing strategy that provides attractive prizes and tickets to the movie screening, which will boost ticket sales and steer the entire campaign into the direction of a blockbusting success.

Microsite Final ( FULL THROTTLE)


For the website, we’ve decided to focus on the captivity part of the storyline in the intro. It starts with a metallic gate that opens horizontally when the website is fully loaded, and refers to the point where the plot takes shape when the main characters are held captive inside the virtual reality game. We’ve used bullets for the loading bar to hint that this is not your conventional racing movie/video game.


The home page of site consist of 4 main character from the movie while we have a short synopsis explaining briefly about what type of movie is this to the audience. Our targeted audience is males and females between the ages of 18-30, average action fans and hardcore gamers from all industrial sectors. The language and the graphics are not suitable for anyone below the age of 18. Our targeted audience should be acquainted with vulgar imagery and extreme gaming, which means the same to the Full Throttle movie itself too.


Our theme color for the words are most black, white and red. We named the car using different animal's name Japanese languages because we want different car to have their own special ability and features on the race track.

WASHI - Eagle
Fast/Extra speed boost
Boy's car ( COUPLE of Mausu )


MAUSU - Mouse

Good handling. good at sharp cornering.
Girl's car (Couple of Washi)


KUMO - Spider
The destroyer - shooting bullets and massive damage
The rich brat's car

Akaei - Stingray
Big&Stable : Not easy to be knocked out of the track
Lecturer's Car

So the following images are for the Play&Win tab, which they consist of the loading page, main page, high score tab and a few explanation of how to win the game. The reason why we include the Play&Win is because we want the audience to pay attention to the movie before it goes on screen in cinema and Play&Win allow audiences to play a simple flash game, get the highest score and they will get a chance to attend the movie premiere for free, this is when the audience get to play a game and win the ticket instead of working hard, earning money and buy the premiere ticket.

Loading Screen

Home page for Play&Win

How it looks like when the Play button is clicked and the sound icon that enable
web user to turn on or turn off the sound of the flash game.

Selecting High Score.

List of people with their high score submitted.

The chase cam view for the flash game.

The first-person view for the game.

The trailer tab where the trailer video from YouTube will be place here.
The downloads, where people could download the wallpaper related to FullThrottle for their desktop, iPad and Facebook cover. I have made the selection button to be a little bit more like overheated metal while the non-selected one to be darken so that it's easy for the people to know exactly which photo they are choosing.

Downloads 1
Downloads 2
Downloads 3
Downloads 4

Downloads 5

And then we have the Merchandise page where people could purchase item they want, the item listed in our merchandises are T-shirts, Samsung Galaxy S3 covers, stainless steel bottle, umbrella, non-slip mat and cap.
Color selection 1 (Brown T-shirts & red stainless steel bottle)

Color selection 2 (Red T-shirts & silver stainless steel bottle)

Color selection 3 ( Black T-shirts & black stainless steel bottle)

Color selection 4 (White T-shirts)
The linking to PayPal page after the color of the item was selected and clicked on the purchase button.

The last one was the Games. The movie is scheduled to release Xbox 360 and PC game.
So we just inserted the game cover of Full Throttle rated Mature 18+

Microsite Changes/Reference


The cover that was made for the Full Throttle home page, but later on we decided to put it as the background because we as team come to an agreement that the mood can be darker instead of just brownish, so now its more like dark, brown, red and a bit of white as light mood.
These are the 4 main cars in the movie, we named it after animal name in japanese and every car has its own advantage on the race track.
Their name are
AKAEI - Stingray (S350) Big & Stable : Not easy to be knocked out of the track
KUMO - Spider (R8) The destroyer - shooting bullets / high damage
WASHI - Eagle ( Civic) Fast/Extra speed boost
MAUSU - Mouse (CRZ) Good handling. good at sharp cornering.
All the car photos were taken by Eugene Chan.


These 2 will be appearing in the Downloads section for the wallpaper, where people could download these images and set as their desktop wallpaper and there's also more for Facebook cover and Ipad wallpaper.
This was the Stage designed for the 360 car view. This background wasn't complete yet and there is more to be added to enhance the visual.

These are the reference mood that we are looking for, maybe a little add on of smoke, and a little bit of add-on lighting to the 360 car show.