Responses by Rob Sweetman, executive creative director, Kate Roland, associate creative director/copywriter and Andrea Tam, digital director, One Twenty Three West
Background: Canada Media Fund (CMF) launched a new campaign, MADE | NOUS, to change the way the world sees Canadian content and give the country’s amazing talent the credit they deserve. The campaign kicked off with TV spots that drove to the website, where Canadians could explore how much world-class content is made right here at home. The interactive MADE Map populates Canadian content landmarks based on the user’s coordinates; each piece of content is carefully curated to represent the best of the industry.
Highlights: An Interactive map that detects the user’s location and presents relevant Canadian film, TV and digital content in the area. Users are able to browse through interesting factoids on Canadian productions across Canada. Another feature is a tightly curated Content section, where we hand picked and researched top productions to provide a deeper look at what makes it Canadian.
Favorite details: We injected animation throughout the site’s transitions to bring a level of interest and finesse to the experience. We made sure the user interaction through desktop and mobile was optimized and focused on ease of use, as well as quick information consumption. We also showcased our national TV spot on the homepage, narrated by Christopher Plummer (EN) and Karine Vanasse (FR). The spots were launched during the 2019 Academy Awards broadcast.
Navigational structure: We wanted to challenge traditional navigation design for both desktop and mobile. For desktop, instead of fixing the navigation menu at one spot for all pages, we designed the menu so that it makes sense for each section. We added progress headlines for each section on the homepage as users scroll through, and also moved the menu access down to the bottom right so that users can quickly access other sections of the site without having to tap on top of the screen or go back to the top of page.
Technical features: This was a highly customized Wordpress site with a custom theme using Laravel Blade templates, PHP, SASS, Bootstrap 4 and extensive use of the Google Maps API. We used Barba.js for smooth page transitions and handled all page animations with the GSAP animation library.