Responses by Mode

Background: Mode is an integrated brand experience agency. We work collaboratively and strategically to help brands connect with their audiences across four disciplines: brand systems, physical extensions, digital ecosystems, and campaigns and content. Our site represents a sample of the work we’ve done for our clients: category and retail leaders spanning a variety of industries.

Design core: We set out to design an experience that demonstrates the range and depth of our tactics through case studies. Each case study reflects its client’s personality and tone while fitting into our overall gestalt. We also wanted the site to represent Mode’s culture, giving prospective employees and partners a feel for who we are and what we stand for.

Favorite details: Our favorite components are in its subtle details, such as the way linework moves with you or motion highlights key content. These intricacies create fun and functional moments of delight that show our personality. We also enjoyed integrating custom-designed brand stamps throughout the site that provide insight into our ethos as makers as well as the categories in which we work.

Challenges: Since we work in such a wide range of disciplines, it was challenging to showcase everything we do in a limited set of case studies. We had so many stories to tell—whether it’s how we achieved a specific goal or came to a creative solution—so choosing among them became a time-intensive process.

Technology: We started with Contentful as our content management system. The back end of the application is written in Laravel 5.8 and runs on PHP 7.1. It’s served through Apache, proxied by NGINX for caching and serving assets with fast delivery times—response times can be as low as eight milliseconds and generally full-page load time is less than a second. We render all the markup server-side so browsers can focus on executing CSS and JavaScript. Our front end implements a handful of JavaScript libraries including Smoothstate, ScrollMagic and TweenLite. SASS, JavaScript and other assets are compiled and optimized with a build system using Gulp and Webpack.