Quatt App
Amsterdam · 2022–2026
Amsterdam · 2022–2026
Quatt is a Dutch company on a mission to accelerate the transition to sustainable home energy for everyone. To achieve this, Quatt develops, produces, and installs smart energy products, such as heat pumps and home batteries. I joined as the sole product designer and built the full mobile experience from scratch, including the design system powering five distinct products.
The real challenge was not designing individual screens. It was building coherence across a fast-growing ecosystem with hardware, embedded systems, front and back-end, and product teams all moving at the same time.
During these 4 years, five products were being built (sometimes) in parallel across different teams with no shared design language. Components diverged, tokens were inconsistent, and every new feature created new debt. The app needed to feel like one product, not five cobbled together.
For each feature, CFTs of up to 10 people needed to move fast. The solution had to make design more accessible, not more gatekept.
I joined to design the app and quickly realised the work was bigger than screens. I ended up owning the full design function: research, flows, UI, design system, documentation, and cross-team alignment.
Owned the full design process from early discovery to production handoff across 23 flows, including the home dashboard where you can see live data, energy insights, HeatPump sound control (SoundSlider), tariff management, device onboarding, Chill temperature and fan speed control, shower minutes for HeatBattery and earning/consumption insight for HomeBattery (and more...)
Built a full Figma design system with semantic design tokens connected to code. Gave engineers and designers a shared language, reduced inconsistencies across products, and made updates propagate instantly across the system.
Integrated the design system with Claude through Figma MCP, enabling product managers to prototype features independently inside the system. The idea is that not only designers, but also Product Owners could develop small features/concepts without overloading developers, so they could focus on delivering hard features.
Drove alignment across CFTs of up to 10 people spanning hardware, embedded, front and back-end, and PM. Facilitated app design critiques, structured handoff documentation on Figma, and translated complex hardware and energy constraints into clear UX decisions.
For me, a design system is not a UI library. It is organisational infrastructure that allows teams to move faster together. Every decision was made with that lens.
Multiple button variants existed independently across each product, with no shared base.
A single unified component with clearly defined variants, states, and usage rules applied across all five products.
Raw hex values and inconsistent spacing scales used differently in each file and team.
Semantic token system — primitive, semantic, and component layers — fully aligned with the engineering implementation.
Beyond shipping features, the lasting outcome was a product culture where design and engineering shared the same language.
