🧑🏻🎤 My Role
Product Designer, Governance Designer, UI Kit Maintainer & Creator Contributor, Orgs. Designer
📑 Project Type
Design System, Flow Design, UI Components, Technical
👯♀️ Collaborators
Engineers, Product Designer
🗓 Date & Place
Jun 2022 - Now, Kargo Technologies
'How might we unify Kargo's ecosystem experience with better collaboration across team?'
💻 Final Output
Governance Flow
I design the governance workflow, and this is the output. For the first iteration, I'm not going deep into the details yet, so testing flow and some other details is not established yet as for now.
Governance Flow for Armada V 2.0
Design System Element Hierarchy
We redesign our file structure, making it align with our engineers' approach.
Refined Content
We re-evaluate what content each component should have on a foundational level.
Element Tracking
I built the element tracking to track all of the component requests, and allow other designers to contribute to the system (since our organizational model is federated, we have the core team but also allow people to contribute if they want to)
Story Book
Engineer start to build their own shared component.
Governance Flow for Armada V 2.0
✨ Outcomes
We just launched it, so we haven't measured much. but..
Adoption of our design has been sky-rocketing after our first socialization
We're flooded by feedback & request, trying to exercise our governance workflow in parallel and keep improving it
We're now starting to measure component adoption & detachment and investigating it for improvement <3
Kargo has several Platforms/Apps at that moment, from a high level they look the same and are very similar to each other. But it doesn't look like it when we look at it from a different perspective, even though they all look similar, for 1 use case we might have multiple patterns, and we are not sure why it happened, this problem scales along with our company and design team's growth.
All of the information can't be verbally shared anymore, someone has to codify it so everyone has a shared understanding. It all leads us to this project, to document and build a system that works so that our pattern, and experience, can scale consistently with clarity. The goal of this project is to, at least, launch our 1st release so that we can keep iterating afterward.
We don't have a subject matter expert in design systems in the company at that time, so we have to figure out our-self, we did these:
What is a design system?
How other companies build their design system?
Where are we right now?
Discovery Highlights
We did an audit, held a weekly meeting to discuss any discrepancies.
We also find a reference for our north star, to be an optimized organization
There are lots of deliverables of this project, what I'm going to share here is how we explore a use case of a component.
Usually we will start with its meta data first, try to benchmark, and discuss it in our weekly meeting.
We explore the user interface afterwards, once it finished, then we will ask people to try it out and start building out the acceptance criteria so that the component won't break
Lastly we wrap it out with documentation such as guidelines/anything that will help designer to understand the context of the component
As organization grows the more explicit knowledge > tacit knowledge, applies to anything including design system
How to communicate with engineer, it's very tricky when we're talking about design system
Understand better how figma works, with auto layout, breaking things down into atomic level. It can be very tricky sometimes, so I have to be also strategic when developing component
The importance of governance to keep the system living, and the feedback looping.
Armada 2.0
