Project Captivate

Project Captivate is the title of an atomic design system I helped create during my time at Two Bulls. It’s custom built for Lord Abbett, a growing international financial investment firm. As their reach expanded, they looked to build a robust online brand presence to share their philosophy, approach, and offerings.

Over time, I designed 200+ web components and collaborated closely with developers to launch them, all while evangelizing to earn our clients’ trust.

Role

Designer

Timeline

2020 – 2021

Client & Team

Lord Abbett, Two Bulls

Teammates

Alex Crandall, Spencer Hill, Sam Winfield

lordabbett.com hosts thought leadership, portfolio information, and up to date insights on ever-shifting market forces. They planned to publish scores of new webpages as soon as possible. Quick growth was expected.

The design system is used to build the following website ↓

We partnered with Lord Abbett developers to build a toolkit of reusable custom components. These simple “building blocks” allowed their in-house content team to spin up new webpages on the fly using AEM.

Some examples of the ‘building block’ components:

Reusability was the core of our strategy.

Reusable components and templates meant the Lord Abbett team could publish polished, final webpages with little to no hands-on work from designers, saving them time and money.

Each component was a balance of brand recognition and generic-ness. We usually designed with general content patterns in mind rather than any specific copy. With this approach we could design 5 headers that serve 200+ news stories, for example. Over time we created a large library that even non-designers could draw from.

We used an atomic design methodology to create a shared language, which helped us get on the same page with developers.

When developers knew a Block or Element was intended to be reused, they could build with that in mind. The tech debt we avoided with this coordinated strategy made everyone’s lives easier.

The atomic mental model communicated structure. Every component could be broken down to its base elements, which could be as simple as spacing, fonts, and colors.

Over time we created a ‘lego box’ of UI pieces for the development and design teams. With some imagination, anything could be wrapped and published in the style of Lord Abbett.

During this project, I learned to design within our system – reusing as much as possible, and only introducing new elements if the situation required something new. This project had an excess of developers, so design solutions needed to be high impact. Building was a constant trade off between brand and engineering. Essential brand moments couldn’t be too complicated when we had hundreds of components to build. At all levels , I ensured my solutions introduced value that could scale and be reused.

The main constraint in this project was time – we managed a large team of developers, so my value as a designer needed to be immediately realized. I gained valuable experience managing a team of developers and collaborating on delivering quick and effectively.

Project Captivate

The design system

Wanna get in touch?Don't be shy. Say hello.

Wanna get in touch?
Don't be shy. Say hello.