Cisco Duo Website Rebrand
Instrument • Branding, Illustration
ROLE
Designer, Illustrator, Art Direction support, Photo Selection support
TEAM
Motion Designer Rodrigo Blergh, Designer & Photo Selection Brinson McGowan, Designer Jason Kaufmann, Creative Director Jack Wilson, and more at Instrument
TIMELINE
Feb - Mar 2025
OVERVIEW
After Cisco acquired Duo, a company that provides solutions to protect organizations from identity threats, they worked with Instrument, a design and technology agency, to redesign their website. Instrument reached out to me to create an asset library that would reflect the new site. I was in charge of finalizing the art direction, creating hundreds of assets, and performing final quality assurance checks and exporting.
Our Framework
The challenge of this project was finding a way to depict product UI in a simplified, humanized way. We decided on a framework that would, on one end, consist of more abstracted and lifestyle imagery, and, on the other end, feature more specific and detailed product visualization.
Humanizing Product UI
I implemented our framework using stock photography, in-situ mockups, and product UI abstractions.
Explorations
My process started with initial explorations of potential art directions.
Hero Illustrations
For most of Duo’s site pages, I landed on these bento-style compositions that combined UI elements and relevant stock photography to illustrate the page’s main topic.
Product UI Abstraction
We created three tiers of product UI abstraction, ranging from fairly representative of Duo’s actual UI to much more abstracted, extracted UI elements.
Each page of Duo’s new website combines illustrations with elegant and clean web design. Pops of the Duo green brighten up each page and rounded corners embody a welcoming atmosphere.
Categories of Product UI Image Assets
I created several categories of assets, each with unique design specifications and use cases. We needed a large variety of illustrations as we were redesigning 30+ landing pages and wanted to avoid pages feeling repetitive and generic. These are a few samples from each category.
Documentation
Along with asset exporting and handoff, I wrote up some light documentation for my asset creation process. This will help future designers easily edit or create new assets that seamlessly slot into the existing asset library.
