Ed Tech Design System Audit
Lead Designer
Client Project
Ed Tech
Problem
Our existing design system was inconsistent and inefficient; there were duplicate styles for some elements, yet insufficient styles for new use cases. My goal was to identify where our team could unify styles, prioritizing changes with the most positive impact.
Approach
I logged element types and instances across core pages, then prepared data models to highlight inefficiencies across core pages.
To accomplish this, I mapped the exhaustive list of URLs that the division I belonged to was responsible for. Next, I determined all the places each of these pages went to (to make a site map). I used the data I collected as a basis to determine which pages to dive deeper into, and then I mapped current component instances across these live pages to find patterns and discrepancies. From there, I built data visualizations and made recommendations.
Lastly, I prepared an hour-long presentation of my strategy, findings and recommendations, and I presented this to a 20+ person audience.
Wins
Built a custom Airtable to track and visualize site structure, user paths, and instances of components.
Mapped the full portion of the site my team worked on, identifying 133 URLs in total.
Charted all the paths a user could take from any of those pages.
Tagged all URLs to page levels, parts of the business, etc.
Identified the top 16 pages based on input from product, and examined those pages in detail.
Logged 250 unique element types (future state components), with 556 total instances across the 16 pages.
Identified opportunities for quick wins, like header and button inconsistency, and showed key paths both visually and numerically.
Lessons
I would seek business approval to use a crawler to compile the list of URLs and screenshots, so I could devote more time to analysis.
I would socialize findings over a longer time period, with smaller audiences, to give people more space to ask questions and make suggestions.
