Loading ...

Responses by Tom Wilder, creative director, COLLINS

Background: On June 5, 2018, advertising, marketing and public relations agency Ogilvy announced its re-founding and new mission to serve as an integrated creative network that Makes Brands Matter. COLLINS worked with Ogilvy to turn itself into a simple, client-first value proposition through a collaborative strategy process. The project included everything from re-designing Ogilvy.com, with the help of development partner Fictive Kin, to overhauling the visual identity of the company.

Highlights: Given the industry, it’s easy to over-design an experience for a company as creative as Ogilvy. However, because Ogilvy has so many great pieces of work over the years and around the world, we wanted the work to shine and be the hero of the experience. Though it fluctuates based on the work page, on average we have 20-30 projects are on the site, with various amounts of imagery and video content.

Challenges: Since Ogilvy has one of the largest creative networks in the world, we had to figure out how to visually represent that scale while still making the site light, flexible and optimized for mobile and tablet. Additionally, there were a lot of challenges with the re-organization, restructuring and content selection for the About page. Lastly, we also had to visualize the scale of Ogilvy’s network on the landing page and get that large interactive moment to feel smooth and a little spicy.

Navigational structure: Simple equals better. The less that stands between users and the content they want, the more they will enjoy the site. We created an introductory splash moment that is not only visually impactful, but also it gets users to the work faster. Users get right into the content in a visually arresting way that highlights the creativity of Ogilvy.

Technological features: We used HTML, CSS/Sass (SCSS/Autoprefixer), Javascript (ES6, via Webpack/Babel), VirtualBox/Vagrant, Amazon Web Services, Siteleaf/Jekyll and Cloudinary. Also, the landing page work grid uses both variable heights and widths dynamically. This required overcoming a series of technical challenges on both the backend and the frontend in order to seamlessly and responsively deliver that flexibility across browsers.

ogilvy.com

Browse Projects

Click on an image to view more from each project
X

With a free Commarts account, you can enjoy 50% more free content
Create an Account
Get a subscription and have unlimited access
Subscribe
Already a subscriber or have a Commarts account?
Sign In
X

Get a subscription and have unlimited access
Subscribe
Already a subscriber?
Sign In