Be -
Cowboys Indians Film
Cowboys Indians Film UX Design Web Design & Promotion The Lowdown Exactly what I did on this project

I designed this movie trailer page and coded it from scratch, not using any frameworks, just some old school XHMTL, CSS and JavaScript. I used the big video js library for the full screen video. I had help from my talented development team for the more dynamic functionality including a custom embedded video playlist. I took screen shots from the actual film and created all of the promotional materials from these as well as clips from the film to create the promotional gifs.

  • Web Design and Development
  • Promotional materials and gifs
  • Full screen video using big video js
  • Mute functionality for select navigation links
  • Create download-able extras including wallpapers
The Story

Cowboys Indians Film is an independent western film that needed a unique marketing approach for the promotion of the film. Firstly it is an independent film and so it needed a trailer website that represented the film allowing easy access to users for extras like the music video and trailer.

The film also needed a very unique marketing approach because it was going to be available for purchase on popular digital media stores, but also available to watch free on the current website. There would be advertisements on the free version for the full HD copy of the film.

This was an interesting sell because essentially the two options needed to be weighed equally and available for users to choose.

Another challenge to this project was creating dynamic frills without using flash as most movie trailer sites do. To accomplish this our creative team brainstormed and decided to explore full screen video. This was then coupled with the iframe overlays highlighting cast and crew. I then decided to attempt some fancy CSS3 transitions including an easing into blurring one side of the cast bio on hover and increasing the photo saturation. This creates a very subtle dynamic effect that mimics some fancy flash transitions but was accomplished with good ol' html and css.

I cannot lie, this project was a fun challenge and I could not have done it alone. There were many creative minds that threw together some clever solutions and I was happy to put it into code and on the web.

Typography AaBbCc123

I chose Bebas Neue and if I'm being perfectly honest it's because I was going through a phase and it seemed to suit well with the film theme.


Interestingly enough the color palette and tone of this movie trailer site was primarily driven by the actual photography from the film itself. The natural tones were in the photos and drove through the design as I chose mostly blacks, whites and grays at varying opacities to help the photos be a focus.

<< Back to Portfolio


Copyright all rights reserved