Ideal Image Design System
Goal / Create the design system for Ideal Image to speed up design time and ensure consistency across their experiences.
Starting Out
Designers did not use components most of the time.
Sporadic components were created but were spread across different files—only made for one file’s use, not with scalability in mind.
Inconsistent hex codes used, including brand colors.
Elements would be copied between files or recreated each time—designers would need to remember the most updated version before copying.
APRIL 2022
Collaborative Sessions
Before beginning any design work, I put together multiple collaboration sessions with my designers to determine what we needed to accomplish and how we wanted to do it. Some of the collaboration sessions included:
Iconography Audit
Documented all icons used across the site and app. Determined the best replacement icons from the Ionic icon set.Design Systems Research
Research existing Design Systems and talk through the elements we liked about each (ex. naming conventions, layouts, documentation).Components Audit
Document the components we would need. Determine if there were ones that could be consolidated. Discuss with Dev if there were existing Ionic components that could be leveraged.
Reviews
While building out the Design System components, I would do multiple reviews with our designers and Brand team to ensure what we were creating would meet standards.
Building Out
I created documentation as I went, outlining how each component could be used, its spacing, and interactions. This was also helpful when doing dev hand-offs as it laid out each variant and how they should be expected to behave.
Deprecation
When components were no longer needed and ready for deprecation, they would be moved to a Deprecation page with a “.” in front of the name to hide it from publishing.
The component would not be deleted from any files it was used it, but it would no longer be available to select in the Asset library.
A communication would be sent out to the teams in a Design System chat letting them know of the update.
