Component Library

  • UX

  • UI

  • DESIGN SYSTEM

SEE IT LIVE


Colour System

THE GOAL

When designing the EPBX Design System  I was concerned with 3 main things

  1. A Component based library in order to cut down on future time devoted to design cycles and future development time by using reusable components

  2. Creating layouts with said components  that could easily be scaled up and down so they could handle small sets of data (1 object with 1 attribute) to larger sets (1-Many objects with 1-Many attributes) with minimal to zero new complaints designed

  3. Creating easily replicated and simple design patterns that could handle both simple relations and complex relations.

THE Process

My first step in any project is identifying who our target users will be. Our initial users were internal administrative staff so there was a lesser emphasis on visual aids, tutorials, and helper functions in order to speed up the delivery timeline. The understanding was that since all staff would be trained internally there was no need for aids to the user. However I was cognizant that eventually our user base would transition to  university administrators with varying levels of technical skills so I designed every components and design patterns with space where I would eventually design these functions when the sprint allowed it

the outcome

  1. Restructuring the pages into more logical groupings

  2. Standardizing design patterns and components so users can intuitively figure out what a page would do or behave based only on visual cues

  3. Using consistent language in order to make users expend less energy on decision making to discern what a component would do.

  4. Decreasing visual clutter on the page by strategically hiding or minimizing less necessary information.

  5. Creating more system feedback to the user in order to self diagnose issues.

  6. Creating more integrated help systems to give the user agency to help themselves without tech support intervention.

  7. Implementing multi functionality to allow users to process large volumes of data faster

  8. A card sorting exercise was done