360i’s website & brand ID refresh.
ROLE: Associate Design Director
DATE: January 2017
Digital advertising agency 360i was ready to make its brand reflect its digitally-led expertise and spirit of alchemy. Using the site redesign as a catalyst, we reimagined everything from the user experience to the visual design, typography, and photography. By establishing a design system we gave 360i the tools to extend its brand to social, print, and beyond.
Research & Discovery
During our discovery phase of the project, we took a deep dive into the data, user profiles, content gaps, and competitive landscape of the site. This data, coupled with stakeholder interviews and unmoderated user tests helped us to define the experience strategy. Through a series of workshops, we defined our personas, crafted the user journeys, and built a product roadmap to design against. Our discovery documentation was also leveraged by brand strategy team when crafting a brand persona for the agency.
While conducting user experience discovery workshops, interviews, journey maps and various other upfront discovery methodologies, we also took a deep dive into visual design explorations. Starting from top-level concepts, and translating them into specific design thinking that could eventually become our visual identity system was a crucial part of the process.
To test out certain concepts, we created motion design demos to identify the best way to bring the designs to life and delight users with micro-interactions.
As part of our visual design and identity process, we identified the style of photography that would fit well across various executions—ranging from our website to the agency's social media, internal communications, and the press. With a defined, clean and modern style in mind, we worked with our in-house studio photographers to bring our vision to life.
Building a Design System
While designing each component, feature, and element for the project, we always kept in mind how these could start to set the foundation for a scalable design system. By the end of the project, we had defined style guides, colors, motion principles, typography (even crafting our own typeface), and a library of components that could be utilized across a multitude of executions.