Year
Aug – Sep / 2024
Industry
OccHealth · SaaS
Type
Design System · UI/UX
Tools
Figma
Duon
Duon started as an internal tool at Maxipas — an occupational health company with 25 years of national presence. When DSG spun it out as a scalable SaaS, the product had no design language, no visual hierarchy, and 40% of users were dissatisfied. My job: build the design system from the ground up.
Born from a cost-reduction need. Built to scale as a product.
DSG Technology was created inside Maxipas to replace expensive third-party software with a proprietary product. Duon was that product — an occupational health platform covering exam scheduling, SESMT management, and eSocial integration. The ambition was to eventually sell it to other companies in the sector. But before that could happen, the design had to become something worth selling.
Primary Typeface
Inter
Designed by Rasmus Andersson · Google Fonts
Specimen
A B C D E F G H I J K L M N O P Q R S T U V W X Y Z
a b c d e f g h i j k l m n o p q r s t u v w x y z
0 1 2 3 4 5 6 7 8 9 . , ! ? @ # &
Weight Scale
Display / 800
Duon
Heading / 600
Dashboard
Body / 400
A scalable, component-driven interface built for teams that ship fast and need design to keep up.
Primary
Brand Blue
#364DE7
Blue Gray (Slate)
50
100
200
300
400
500
600
700
800
900
BEFORE
AFTER
No design team. No visual language. 40% of users dissatisfied.
Visual inconsistency everywhere. Similar components behaved differently across modules. There was no shared pattern — every screen had been built in isolation.
Accessibility issues at every level. Low contrast, confusing error messages, missing field descriptions. A PCD exam scheduling flow was entirely broken — the interface never told users they needed to attach a medical report.
No centralized component library. Developers duplicated effort on every feature. There was no single source of truth — only a growing pile of similar-but-different UI pieces.
BEFORE
AFTER
A single source of truth — from research to production-ready components.
UX Research
Online survey (40% dissatisfied, scheduling sector most affected) + field visit to Maxipas in Criciúma observing the support team in action.
Component Mapping + Design Tokens
Full audit of existing UI components, catalogued and replaced with a token-based system for color, spacing, and typography.
Style Guide + Design System
Documented visual language covering hierarchy, accessibility, and component behavior — the first single source of truth Duon had ever had.
High-fidelity Screens
Exam scheduling, SESMT management, and eSocial integration flows — all redesigned, accessible, and implementation-ready.
