QUEST AI - DESIGN SYSTEM
QUEST AI - DESIGN SYSTEM
QUEST AI - DESIGN SYSTEM
2023
2023
2023
The definitive (Free) Figma Design System & UI Kit
The definitive (Free) Figma Design System & UI Kit
The definitive (Free) Figma Design System & UI Kit
See More
See More
See More



This Design System was a project that I spread-headed and designed completely on my own.
To help customers build and launch products faster, we set out to create our of design system and component library. The magic of this UI Kit was that you could:
1.
Change the fonts, colors and effects in the Figma file, then sync it to Quest to generate an MUI theme.
Copy and paste any of the components from the component pages into their custom designs and convert the designs into working ReactJS.
2.
We based the kit on MUI and I studied the MUI docs to understand what options to add to the kit. I created the kit with over 30 MUI components that we ended up supporting which were composed of additional atom components to make everything easy to customize. The styles for fonts and colors matched the standards defined by the MUI library.
In addition to all the components that were derived from MUI, we added templates for Applications, Marketing, and E-commerce that used the design system components.
Overall the project took roughly 3-4 months to complete design and another 1 month to code.
Here I’m showcasing some examples pages from the UI Kit but you can click the link below to see it in the Figma Community.
This Design System was a project that I spread-headed and designed completely on my own.
To help customers build and launch products faster, we set out to create our of design system and component library. The magic of this UI Kit was that you could:
1.
Change the fonts, colors and effects in the Figma file, then sync it to Quest to generate an MUI theme.
Copy and paste any of the components from the component pages into their custom designs and convert the designs into working ReactJS.
2.
We based the kit on MUI and I studied the MUI docs to understand what options to add to the kit. I created the kit with over 30 MUI components that we ended up supporting which were composed of additional atom components to make everything easy to customize. The styles for fonts and colors matched the standards defined by the MUI library.
In addition to all the components that were derived from MUI, we added templates for Applications, Marketing, and E-commerce that used the design system components.
Overall the project took roughly 3-4 months to complete design and another 1 month to code.
Here I’m showcasing some examples pages from the UI Kit but you can click the link below to see it in the Figma Community.
This Design System was a project that I spread-headed and designed completely on my own.
To help customers build and launch products faster, we set out to create our of design system and component library. The magic of this UI Kit was that you could:
1.
Change the fonts, colors and effects in the Figma file, then sync it to Quest to generate an MUI theme.
Copy and paste any of the components from the component pages into their custom designs and convert the designs into working ReactJS.
2.
We based the kit on MUI and I studied the MUI docs to understand what options to add to the kit. I created the kit with over 30 MUI components that we ended up supporting which were composed of additional atom components to make everything easy to customize. The styles for fonts and colors matched the standards defined by the MUI library.
In addition to all the components that were derived from MUI, we added templates for Applications, Marketing, and E-commerce that used the design system components.
Overall the project took roughly 3-4 months to complete design and another 1 month to code.
Here I’m showcasing some examples pages from the UI Kit but you can click the link below to see it in the Figma Community.
Company
Company
Quest AI
Quest AI
Year
Year
2023
2023
Skills
Skills
Product Design
UI / UX
Product Design
UI / UX
Product Design
UI / UX
COMPONENTS
COMPONENTS










TEMPLATES
TEMPLATES








More Work
FIGMA PORTFOLIO
FIGMA PORTFOLIO
To view my work in Figma: https://tinyurl.com/yesjasper
A
A
N
N
D
D
R
R
E
E
W
W
J
J
A
A
S
S
P
P
E
E
R
R
UI/UX PRODUCT DESIGNER
UI/UX PRODUCT
DESIGNER
andyjasper@gmail.com
andyjasper@gmail.com
andyjasper@gmail.com
201.615.3861
201.615.3861
201.615.3861
©2023 Andrew Jasper
Site designed and developed by Jasper. All Rights Reserved.