Movie Trailer digital experience
WHAT IS THE FILM ABOUT?
American Holocaust follow's 8 storylines through a dystopian world set in the Summer of 2020. The capital “Metropolice”, is under siege - sirens, helicopters, & fireworks are the soundtrack to the revolution. To make things worse, a global pandemic has swept the world & particularly America, which is ruled by “The Supremacy”. Curfews have been implemented on sections of the populous. The link between each story is a genocide that has reached a critical point, the American Holocaust.
WHAT DID I DO?
My role was the lead UX Designer that collaborated with the developer and film director to create an approachable digital experience released on mobile and web platforms for the film that carries a dystopian yet political aesthetic in a 3 month span. I also assisted on set to intake the consistent humanizing feeling and replicate the environment onto the website.
As the lead designer I was to deliver an e-commerce and mobile web platform that would sell merchandise to help fund the rest of the independent film. While it's goal is to engage the audience to inspire real change within our communities through a fictional story, it was important for the film director to spread awareness on signing a petition calling for zero tolerance police brutality, establishing higher education as a human right for all, & democratization of early education .. to name a few.
IDEA'S, ITERATE & COMMUNICATION
The first state of the project was to collaborate with the film director to visualize the layout to display the trailer and merchandise through a consistent and deliverable theme. At first we discussed keeping the project minimalistic with just the the trailer & merch due to the short time line that was initially given. But after further discussions on the film, learning how he was inspired, his ethics, and the importance of humanizing his experience through a platform we both agreed it was important to give the audience more to deliver a more conversational message among his audience.
- To Promote the film
& engage the audience what to expect.
- Accessible topics to lead user for clarity to other sections of the platform
- Display merchandise
but engage audience with the emotional aspect through the items.
- Deliver message for fundraising
- Include images from event
- brief of story to inspire conversational subjects with audience
- Inspire others to make change together as a community by encouraging the audience to sign
- Display link to previous work
- Brief intro about director
- Action Images
- Display link to google doc movie script or create seperate page.
Once the layout was finalized, I created the wire frames and an interactive prototype (Web & Mobile) through Invision to discuss page adjustments such as adding social media icons, merchandise displayed, the best placement and format for the movie script, and proper image placement to determine the style and flow of the platform.
Petition & About Director
Movie Script link
Add real images
personal work link
Add "View More"
button for 2nd page
on brief info on the
meaning of Holocaust
Insert Fake Logos
Inspired by the trailers dystopian aesthetic and political message.
We achieved the final look by merging behind the scene imagery, digital illustrations from the film and following political colors that give the site a smear campaign feeling.
With detailed images of the directors altercation with the police during a protest, It was important for the Director to include his inspiration for the film that led him to create a petition. Which served as an extension of the over all guest experience. The landing page captured more than just the trailer & merchandise but the inspiration for others to help create change within their communites
Currently we have 50% of the film, the money we raise from merchandise will go to production costs, equipment & location rentals, cast, as well as VFX & other post-production needs.
Replicating the websites foundation, incorporating new images & applying familiar shortened design patterns to reduce the user's learning curve
I started by conducting a full audit on the website which uncovered inconsistencies and accessibility issues for a mobile platform.
To solve this, I created a library of reusable components (buttons, images etc), which ensured consistency and a faster build time for the developer.
Working closely with Gina, the developer. We collected insights to deliver strong solutions for all sections of the site.
My focus being on UI, I helped transfer our idea's from low to high fidelity prototypes to test with the film director to ensure we were creating the aesthetic of the film.