AIDN Visual Design

UI, interactions, and more.

Results:

  • Increased Productivity and Quality of Design and Front-end Development.
  • Introduced an improved cross-functional team workflow that significantly increased productivity.
  • Supported the creation of multiple digital platforms.
Alt Image Text Needed!

01

Chapter one

In the Beginning

I joined the RCI UX/UI Team in order to build a Design System for them as part of a larger digital transformation project. It was initially intended to be a design tool and style guide, but I proposed taking it further. Fortunately for me, my leadership provided incredible support and opportunity for me to craft and bring my vision into reality.

Surveying the Construction Site

I first began by analyzing the Design Team’s tools, project types, and workflows. I then connected with the Club Project’s architects and front-end developers to learn about the tech stack they would be using to build what we design. After surveying the preferences of the dev team and researching many incredible design systems, I opted to use Bootstrap 4 as the base of my new Design System. It was familiar to most developers and gave me a great foundation to work from. For some UI elements, the design team referenced Google’s Material Design System and IBM’s Carbon Design System."

02

Chapter two

The Two Sides of the Gap

When I first began presenting the Design System to stakeholders, most assumed it was just going to be a fancy digital style guide they would reference on InVision. They were pleasantly surprised to learn that it was a robust, production ready, code library.

If I have seen further it is by standing on the shoulders of Giants.

Isaac Newton