Shan Design Logo

Design System

Date Published

Design system hero image

Background

As Airship product grew, the reusability of the code and ease of design and development process became important to maintain a consistent user experience. I led the collaborative design and architecture of a Design system with a team of 10 engineers and 3 designers. Each member represented a product area, which allowed us to be more effective.

A preview of the Design system parts

A preview of the Design system parts

Approach

I worked with Engineering and Product leaders to discuss how the development of a design system would benefit the company strategically, and incorporate their vision into my plan. I engaged with teams to identify potential Design system architectures. I documented findings and how the system should be structured to facilitate an optimal designer-developer experience. I worked with engineers to implement these into the code. In addition provided clear instructions for using and contributing to the Design system.

A preview of a Design system component spec

A preview of a Design system component spec.

Outcomes

Design system at Airship Improved the designer-developer communication and workflow. It provided foundations for system consistency. With the provided documentation and process, teams are able to leverage and improve the Design System efficiently. Ensuring certain Accessibility standards became easy by having them built into the central system. In a complex system, making an update across everywhere in the UI is easy. Creating simple, elegant UI became fun and not worrying about pixel details every time.

Related