Ogilvy
Creative network
Designing a digital presence as exceptional, revolutionary, and purposeful as the Father of Advertising himself.
Client
Ogilvy
Industries
Advertising
Experience
Public Relations
Health
Consulting
Services
Visual Design
UI/UX Strategy + Design
Design Systems
Role
Lead Experience Designer
Agency
Ogilvy
Date
2021
Objective
During my time at Ogilvy, our website always left much to be desired. Execs agreed and empowered our Experience team to lead the charge of a redesign.
We would need to highlight our expertise across multiple capabilities, showcase the breadth of work along with its impact, and attract top-tier talent.
Solution
nitial discovery presented a rich, competitive landscape of best-in-class, worldwide agency websites. In order to compete in the digital space, we’d first need to assemble the right people within Ogilvy. We partnered with executive decision-makers, creative directors, and subject matter experts to inform content and brand direction.
Our core experience design team consisted of an engagement manager, a principal designer to lead UX and content strategy, and myself to craft the design and interaction direction. We then expanded the team with additional experience designers to systematize page designs into a modular, responsive design library.
Process
Above
Adapted version of my Project Runway process detailing the content and design workstreams on the Ogilvy.com project.
Note: Most versions of this process also feature Research, Data and Technology as key through-lines of a project.
Content guides
Brand expression
Visual Style Scales
Style scales helped us to gauge stakeholders’ design preferences for the Ogilvy website. In our early Brand Expression Workshop, stakeholders voted on each scale. We followed with a short discussion to clarify answers, acknowledge and address dissonance in their expectations, and align on actionable next steps.
Brand Persona
If Ogilvy were a person who would it be? Brand Personas help those designing and writing to create a consistent personality while avoiding the traits that would take the brand in the wrong direction.
Timeless & Curious
Animated Style Tiles
Visual explorations of the digital experience – setting typography, color, icons, and patterns into motion.
Best-in-class & Playful
Modern & Bold
Collaboration
Design
in Motion
Interactions
Inventive scroll animation
Detailed, unique web scrolling engages the user, draws a buoyant attention to important content, and brings dynamic joy to the experience.
BELOW
Scrolling interaction/animation of the Capabilities page.
Interactions
Delightful
details
Delightful details
Inventive layouts, striking typography, and surprising details are punctuated with engrossing, branded motion. This fusion creates a memorable user experience, highlighting the brand's deftness within the Experience capability.
Inventive layouts, striking typography, and surprising details are punctuated with engrossing, branded motion. This fusion
creates a memorable user experience, highlighting the brand's deftness within the Experience capability.
ABOVE
Animation treatments for: Home page hero carousel; Scrolling page and micro-animations for Ogilvy Experience capability, and location change interaction for the Mikimoto case study page; desktop design of case study page template.
BELOW
Iconography animations: Russian Doll; Creativity; Scale; Open/Close; Conversation.
Showcase
Giving the work a proper stage
To leave a lasting impression, we designed a vibrant showcase of the best work each Ogilvy capability has to offer.
The immersive custom hero carousel puts featured work on full display. A robust interface of filterable
projects allows visitors to find exactly the type of work they’re looking for. And captivating case study pages engage the emotional core of each project — demonstrating the team’s expertise in process and craft, and highlighting exceptional results.
Design System
Dynamic
consistency
Dynamic consistency
We designed a robust library of diverse yet consistent modules, pages, and interactions — each with dynamic variations to accommodate different
We designed a robust library of diverse yet consistent modules, pages, and interactions — each with dynamic variations to accommodate different layouts, audiences, and content types. Our aim with this somewhat maximalist approach was to exceed users' expectations — providing meaningful content within a deeply engaging experience.
layouts, audiences, and content types. Our aim with this somewhat maximalist approach was to exceed users' expectations — providing meaningful content within a deeply engaging experience.
ABOVE
Desktop designs of the Ogilvy Experience capability and About Us pages; Variations of the long-form statistic component.
Responsive Design
Considering the constraints posed by smaller screens, we deliberately emphasized key elements, guaranteeing a seamless and genuine
Optimized for
every device
we deliberately emphasized key elements, guaranteeing a seamless and genuine brand encounter for those on mobile. We struck a harmonious balance between the (recently
revamped) identity and an optimal user journey, resulting in a captivating website experience that's easily accessible on any device.
Considering the constraints posed by smaller screens, we deliberately emphasized key elements, guaranteeing a seamless and genuine brand encounter for those on mobile. We struck a harmonious balance between the (recently revamped) identity and an optimal user journey, resulting in a captivating website experience that's easily accessible on any device.
Responsive Design
Optimized for every device
Considering the constraints posed by smaller screens, we deliberately emphasized key
As is often the case with brand guidelines, UiPath’s color guidance didn’t account for accessibility or versatility. Bright yellow and sky blue text disappeared into white and light gray backgrounds. Extremely saturated brand colors – with no tints or variety of value – clashed on the page with no hierarchy or affordance. We’d need to reimagine this simple color palette into a thoughtful, accessible, and flexible color system.
elements, guaranteeing a seamless and genuine brand encounter for those on mobile. We struck a harmonious balance between the (recently revamped) identity and an optimal user journey, resulting in a captivating website experience that's easily accessible on any device.
Lead Experience Designer
Izaac Crayton
Denver, CO
New York, NY
2021
Worldwide Creative
Denver, CO New York, NY
New York, NY
2021
