Script and Storyboard

As the promotional video I’m producing has suffered from a lack of work, I have produced an initial script and storyboard. Below is the script for the narration of the video, and also a quick first draft of the storyboard with explanations of the images.

We’ve all been there… Watching a film when you spot them. You’re sure you’ve seen them before but can’t for the life of you remember where. And what’s their character called in this again? No idea.

Or maybe you want to cast that actress in the background in your new film? Watchact has the answers.

When you’re watching, simply click on the actor, and an info box is displayed. You can see their most popular films and find them elsewhere on the web, or if you’re looking to cast talent then find management information.

Watchact – discover talent.

When working on the script for the video, I knew that it was important to me to have the narration relatable and in a friendly tone – I don’t want to overload my viewers with information.

storyboard1

 

Here is the draft storyboard for the animation. In the first panel, we see two characters engaging in a dialogue scene, at which point it zooms in to focus on one of the actors. The information panel is shown, and then the website is shown in full and explained. The video will end with an animated version of the logo, leaving the audience with a clear idea of what the company is, and the name/branding.

User Interface Design

Once again I’ve been working on design elements for the website, this time for the user interface of the video functionality.

 

Below are initial ideas for the designs of the UI for this element of the project.

 

UI_MOCKUP1UI_MOCKUP2

 

As you can see I have produced two separate ideas here, one for content producers looking to use the website for talent scouting, and another for the general public who’re using the site primarily as a streaming platform.

Website Design

Having locked down the company logo, I decided that I wanted to work on integrating this into the site design. Using my wireframes from before as a basis to work from, I created a number of assets within Adobe Photoshop which can be seen below.

 

Firstly, the website banner which will be placed prominently at the top of the page, allowing users to navigate quickly around the site, and as such it is essential that this element contains tabs to allow for this easy navigation.

BANNER

 

The other assets I worked upon were the icons for the home screen of the website. These icons would appear as the user first enters the site, enabling them to quickly select how they’d like to browse content.

 

CATEGORIES ICON ACTORS POP_TITLES

Logo Design

When I initially set out to produce the project’s logo, I knew that I wanted a simple design that utilised the name in some way. After looking at design trends last semester, I knew that interlocking initials were a popular way of representing a company in a sleek and instantly recognisable way.

 

I began with the initials WA and experimented with these letters, creating a number of designs which can be seen below.

 

The first design seen here was far too basic for my liking and I felt it looked unprofessional, but I could see that there was potential within the design, and as such I kept with the idea of the initials, and used this design as a starting point for development.

Logo1Logo2Logo3LOGO4

The largest changes made throughout this development process were the addition of colour to the design, and the way in which the letters adjoined. The colour scheme was a result of feeling that black and white was too basic, but did provide a nice contrast between the letters, which was something I was keen to keep. Films often use blue and orange lighting to create contrast and as the project is a website for viewing film and television content, blue and orange seemed like a viable option, and as can be seen below, I feel it works very effectively.