Contributions to Design System: Components, Iconography, & Accessibility
Duration
2021-2024
My Responsibilities
Component Design Icon Design A11y Framework Design
Collaborators
~4 Product Designer ~2 Developers
Company
Lyearn - A white-labelled learning management system (LMS) and employee productivity platform
Component Design
I audited the entire platform for potential usage spots and researched popular design systems to understand component structuring.
Next, I designed all variants with well-defined properties. I exposed nested properties to boost designer efficiency.
Finally, I defined development specs and documented guidelines for usage of the component.and across the platform.
Icon Design
Crafted large (40px) icons across projects. I added in details to justify extra pixels.
Notice windows in the building icon, realistic handle of the megaphone icon, lines in diamond icon, and flap of the briefcase icon.
A11y Framework Design
Initiated and led the effort to meet AA Level of accessibility for all majorly used components as per WCAG's guidelines to protect against any legal actions. This impacted all 100k+ users of the product!
I researched and filtered out the guidelines for all four areas of accessibility to create a checklist for the team to follow. Using the checklist, the team made sure that all elements of the components met minimum contrast ratio, had focus states, had defined keyboard shortcuts, and included alternate text for non-decorative images.
Component Design
I audited the entire platform for potential usage spots and researched popular design systems to understand component structuring.
Next, I designed all variants with well-defined properties. I exposed nested properties to boost designer efficiency.
Next, I designed all variants with well-defined properties. I exposed nested properties to boost designer efficiency.
Finally, I defined development specs and documented guidelines for usage of the component.and across the platform.
Finally, I defined development specs and documented guidelines for usage of the component.and across the platform.
Icon Design
Crafted large (40px) icons across projects. I added in details to justify extra pixels.
Notice windows in the building icon, realistic handle of the megaphone icon, lines in diamond icon, and flap of the briefcase icon.
A11y Framework Design
Initiated and led the effort to meet AA Level of accessibility for all majorly used components as per WCAG's guidelines to protect against any legal actions. This impacted all 100k+ users of the product!
I researched and filtered out the guidelines for all four areas of accessibility to create a checklist for the team to follow. Using the checklist, the team made sure that all elements of the components met minimum contrast ratio, had focus states, had defined keyboard shortcuts, and included alternate text for non-decorative images.
Contributions to Design System: Components, Iconography, & Accessibility
Duration
2021-2024
My Responsibilities
Component Design Icon Design A11y Framework Design
Collaborators
~4 Product Designer ~2 Developers
Company
Lyearn - A white-labelled learning management system (LMS) and employee productivity platform
Contributions to Design System: Components, Iconography, & Accessibility
Duration
2021-2024
My Responsibilities
Component Design Icon Design A11y Framework Design
Collaborators
~4 Product Designer ~2 Developers
Company
Lyearn - A white-labelled learning management system (LMS) and employee productivity platform