Design System

Design System allows team members to access a single source of truth and quickly produce value.

Laptop, iPads, and an iPhone displaying products built with the design system.
iPad showing a sample screen from an internal app to group people by their permissions.
iPad showing a sample screen from an internal app to collect contact information from users.
iPad showing a sample screen from an internal app to report on fees received from permits.
iPad showing a sample screen of the home page of the Pelican design system site.

Project Stats

  • Type Employer
  • Platform Web
  • Status Published

Project Roles

  • User Researcher
  • UX Designer
  • UI Designer
  • Frontend Designer
  • Visual Designer
Try Design System

Project Goal

The design system will enable developers and designers to reuse proven user experience patterns within an ecosystem of organizations.

Target Audience

The primary users for this design system are senior developers, mid-level developers, junior developers, and user experience designers. Seondary users are the business analysts and product owners. Tertiary users are stakeholders who decide to adopt the design system for their products.

Persona card for Lalana who represents designers who will use the design system in Figma and during client and business analyst meetings.
Persona card for Umang who represents developers who will use the design system in code and during user acceptance testing.

Research & Key Challenges

The design system’s original research was performed by taking a user interface inventory of two vast web applications which were being modernized.

Performing an inventory across a myriad of official web applications is a monumental task.

Initial Concepts

Wireframes were shared with business analysts and developers as they will have the most exposure to the design system outside of the design team.

Digital wireframe snippet of the homepage design.
Digital wireframe snippet of each area’s landing page design.

Usability

Usability information and benchmarks were captured as group feature requests and roadmap proposals. The design system’s growth would be evaluated against these early brainstorm sessions.

Feature constraints from competitive audits, business analysts, and senior developer requests.
Feature constraints from content managers, and designers.

Conclusion

During the lifecycle of the design system, continuous iteration and maintenance will be paried with best practices and templates for common user flows.