Port Pictures
Full custom website build, with animation, interactions and SEO strategy.
Challenge
Port Pictures Ltd. is an established production company of renown. It was important to design and build a site that showcased their filmography as well as their array of production services.
Solution
The site is predominantly informative, it provides information about the films Port Pictures produces as well as the production services they offer. The key was to blend visual and textual information in a manner that enhanced UX and was fully responsive.
Design
The design is bold and blocky to mirror Port Pictures' branding. Dark tones contrast wonderfully with the yellow accent colour and the strong visuals really pop.
TYPOGRAPHY
The main heading was Oswald to mirror Port Pictures', subheadings are in italicized Newsreader and paragraphs are Lato.
COLOUR PALETTE
A dark grey / light black tone was paired with a sunny yellow to enhance the bold visuals.
Features
Stylish Full Page Navigation
The navigation is a pleasure to use on desktop and mobile. It is animated, it connects to all the main pages as well as Port Pictures' social links.
Video Landing Page
In keeping with Port Pictures Ltd's raison d'etre, their landing place features four clips from recent productions that automatically play on loop, silently in the background. It is a strong first impression for an important production company.
Informational Introduction
The visually enhanced about page gives important background information about the company as well as an introduction to its founder and lead producer, Martina Niland.
Services Information
The fully interactive services page features an accordion menu that provides important informational for co-production partners and industry networks.
Comprehensive Filmography
Each of Port Pictures' productions have their own informational page, featuring trailers, images and production details.
responsivity
To ensure a perfect user experience on every device, we created thorough wireframes and prototypes before developing the site. The layout changes quite dramatically from desktop to phone, but retains all of the functionality and content. All the layouts look perfect on mobile and the site is a joy to use. We paid particular attention to the more detailed layouts such as the filmography and contact form, both of which are elegantly displayed on tablet and mobile devices, as well as on larger screens.
Interactions & Animations
Interactivity and animations were sprinkled appropriately and liberally throughout the site. The landing page video clips are followed by an awesome 3D page flip animation to select recent films and the full page nav screen animates in as well. Most headings and blocks of text have subtle and impressive animations attached to them.
It was fun to be able to integrate the animations into this project as they enhanced the brand's association with motion pictures.
