Otto: Scaling & Implementing a Design System Across Automotive Telemetry Apps

A snapshot of my contributions
Discovery: Meeting with Dev & Product, understanding Otto needs & constraints
Collaboration: Working with devs on Storybook documentation & a GitHub library
Design: Leading & coaching the design team in building out & documenting Otto
Feedback: Meeting with devs to check design consistency for component sets

Timeframe: 4-6 months

Empathize. What is the problem?

When I came on at Aptiv, the ACS team was building brand new apps as well as trying to revitalize & update old apps on their platform. They needed consistency and structure from a design system so that the apps would have a similar look and feel as well as having the efficiency of a versatile component library.

Why have a design system at all? Well, if you read my blog on design systems, you know that there are multiple reasons; including component reusability, faster concept-to-design speed, and overall brand consistency.

Define. Deeply understanding the problem.

From 2023 to 2024, I personally worked with Product, Engineering, and Design; scaling & building out the Aptiv ACS design system—affectionately named Otto—from 1 or 2 components to over 30 components needed across multiple apps in the ACS product suite in Figma. I dug in with developers as well as led the design team in selecting and designing components that were actually needed and would be used in the platform, all while creating a system that was simple to add on to.

The design system consisted of:

Components
Core Color Tokens
Changelog
Patterns

Ideate. How can we solve the problem?

We solved the problem with Otto.

The main components list would house all of the designed single-component possibilities for Aptiv ACS products. The patterns would show developers common approaches for using the design library components in context. The Core Color Tokens would contain all of the product color palette variations. And finally, the Changelog would give designers a design-system documentation system of record.

Here are some of the tokens, components and patterns I created:

Prototype. Show an MVP than can solve the problem + Test. Do real users feel like this would solve the problem?

I spent that year helping to update the design system in Figma, contributing and standardizing custom components for Otto. Our developers absolutely loved being able to have a design template to begin with as we worked through building & redesigning apps. Our designers were happy not to have to reinvent the wheel everytime we needed a component for a new project.

To see Otto in action please check out: