Product Design
Open For Work
UXUI Design
Visual Design
Product Design
Open For Work
UXUI Design
Visual Design

User Interface Harmonization:
‍‍Design System Redesign

Product Design
Design System
IntroNavigation RedesignDark Mode RevisionButtons
Form Fields
Typography
Design

Principal Product Designer

2022-2024

As one of the first long-term designers at Edgio, I took the initiative to establish a comprehensive design system to ensure consistency across our products' design and user experience. Prior to this, most components were developed on an ad-hoc basis by various engineers and front-end developers, each with their own UI preferences and varying knowledge of best practices. Harmonizing this disjointed UI was a challenging and time-intensive process that spanned two quarters. However, the result was a significant improvement in both our brand's visual identity and the overall experience of our digital products.

Initiative Solution

Dark Mode Revision

In addition to developing a cohesive component library, we also re-evaluated our application's styling. While we offered both dark and light modes, we found that most users preferred dark mode. However, there were concerns about the color hue and insufficient contrast, which we aimed to address.
// Dark Mode Revision

Improved Accessibility

The previous design lacked sufficient contrast, making it more challenging for users to navigate and read content comfortably in low-light environments. By increasing the contrast, we not only complied with accessibility standards but also created a more inclusive experience.
Redesign
Old UI
The proposed revision vs the old dark mode UI

Component Library

[probably dont need the badge. this section will show the various states of components like fields and buttons, how and why they are used]
// Component Library

Buttons

Inconsistent button styles—whether in terms of size, color, or placement—can create confusion and lacks polish. We consolidated our various button styles and created a hierarchy and guidelines to ensure consistent usage in future.
Button style sheet
I look forward to hearing from you
gaby@mexi.design