QUATT
At Quatt, I worked as a UX/UI Designer and Design Lead, managing a team of designers and delivering projects that spanned digital platforms, marketing assets, and large-scale event design.
Intro
Together with the design team, I developed a comprehensive brand guideline for Quatt, translating the brand’s vision into a clear and consistent visual system. We refined the identity across logo usage, color, typography, iconography, imagery, graphic elements and digital applications, while defining how each element should work together across different touchpoints.
A key part of the process was creating a system that could balance Quatt’s technical and innovative character with a warm, approachable and lifestyle-driven feel. From the New Energy Flow visual concept to the color system and UI applications, every decision was designed to make the brand feel cohesive, recognizable and easy for teams to apply.
The result is a flexible design system that provides clear creative direction while leaving enough room for the brand to evolve across digital products, marketing and communication.
Brand guidelines
My task involves the process of creating a visually appealing and user-friendly interface that aligns with the Zero Height's capabilities and the specific needs of the organisation.
Brochures
I designed this brochure to introduce Quatt’s Partner Programme in a clear, engaging and visually consistent way. The goal was to translate a large amount of information into an easy-to-navigate piece of communication while staying true to Quatt’s bold visual identity.
Partner programme
The design combines strong typography, photography, brand colours and structured layouts to guide the reader through the programme, its benefits and Quatt’s modular product ecosystem.
My role: Visual Design · Layout Design · Print Design · Brand Application
For this brochure, I was responsible for the full visual development and design, transforming the content into a clear, engaging and cohesive piece that reflects Quatt’s brand identity. I developed the complete layout and visual storytelling across the brochure, combining photography, custom graphics, illustrations and data-driven elements to make technical information feel accessible and easy to navigate.
I also explored AI-generated imagery to create specific visual assets that supported the story and complemented the existing brand photography. From the overall art direction to the smallest graphic details, I worked across every visual element to create a consistent experience from cover to cover.
Product brochure
My contribution included:
-
Art direction & visual concept — defining the overall look and feel of the brochure
-
Editorial & layout design — creating the structure, hierarchy and flow across all pages
-
Illustrations — developing custom visuals to explain products, systems and concepts
-
Graphics & infographics — turning information into clear and engaging visual elements
-
Tables & data visualisation — designing complex information to be easy to scan and understand
-
AI-generated imagery — creating and art-directing custom images to support the content
-
Image selection & composition — integrating photography throughout the layouts
-
Brand application — translating Quatt’s visual identity consistently across typography, colour and graphic elements
-
Print-ready design — bringing all elements together into a polished, cohesive final brochure
I designed a multilingual Safety Instructions brochure for Quatt, with a strong focus on clarity, accessibility and consistency. Since the document communicates essential safety information, the challenge was to create a layout that could accommodate a large amount of technical content while remaining structured, easy to scan and visually aligned with the Quatt brand.
Safety instructions
The brochure was developed in six languages, requiring a flexible design system that could adapt to different text lengths without losing visual consistency. I also created the complete icon system, using clear visual cues to help users quickly identify warnings, important information and different types of safety instructions.
My contribution included:
-
Brochure & editorial design — complete layout and visual hierarchy
-
Multilingual design — adapting the brochure across 6 languages
-
Custom iconography — designing the warning and information icons
-
Information hierarchy — structuring technical content for quick scanning
-
Typography & spacing system — maintaining consistency despite varying text lengths
-
Brand application — translating Quatt’s visual identity into technical documentation
-
Print-ready artwork — preparing a consistent final document across all language versions
I designed this direct mail piece for Quatt, targeting homeowners who could benefit from switching to a hybrid heat pump. The goal was to turn a large amount of product and subsidy information into a clear, persuasive piece that would immediately capture attention and encourage homeowners to request a personalised quote.
Direct mail campaign
I developed the complete visual layout, creating a strong hierarchy between the key message, product benefits, subsidy information and call to action. The design combines product photography, customer testimonials, review ratings, icons, QR code integration and branded graphic elements to build trust while making the information easy to scan. The reverse side adds educational content about how the heat pump works alongside social proof from an existing customer.
My contribution included:
-
Direct mail concept & visual design
-
Editorial layout and information hierarchy
-
Product and lifestyle imagery
-
Icons & branded graphic elements
-
QR code and CTA integration
-
Customer testimonial & review design
-
Print-ready artwork and production
-
Translating complex product information into an accessible, conversion-focused design
I designed this half-page newspaper advertisement for Quatt, created to introduce the Quatt Hybrid heat pump to a broad homeowner audience through one of the Netherlands’ leading newspapers.
Newspaper ad
The challenge was to communicate a strong commercial message within a traditional editorial environment while still making the advertisement feel unmistakably Quatt. I combined product imagery, typography, brand graphics, reviews, key benefits and a clear call to action into a layout that is bold, easy to scan and visually distinct from the surrounding newspaper content.
My contribution included:
Creative concept & art direction
Half-page print ad design
Layout & visual hierarchy
Product image composition
Brand graphics & typography
Review and benefit integration
QR code & call-to-action placement
Print-ready artwork for newspaper production
I worked on the UX/UI design of the Quatt website, translating the brand into a clear, intuitive and scalable digital experience. From page structures and user flows to individual UI components, I helped shape a consistent experience across the entire website.
Alongside the website design, I created and maintained a reusable UI library, establishing the components, visual elements and patterns needed to keep the platform consistent while making it easier to design and build new pages.
UX/UI - Quatt.io
My contribution
-
UX/UI design for the complete Quatt website
-
Page structure, hierarchy and user flows
-
Responsive desktop & mobile experiences
-
UI components and reusable design patterns
-
Figma component library
-
Buttons, forms, cards, navigation and interactive elements
-
Visual assets, icons and supporting graphics
-
Design consistency across pages and touchpoints
-
Collaboration with developers from design to implementation
User centered design
I started with research to understand user needs, pain points and motivations. This insight shaped the structure, content and experience of the website.
-
User research
-
Competitor analysis
-
User flows
-
Wireframes
-
Prototyping
-
Usability testing
Wireframes
I created a scalable design system to ensure consistency, reusability and an efficient collaboration with developers.
Design system
Social media
Digital marketing content is expected to adhere to Quatt’s most current brand guidelines to ensure visual and tonal consistency, brand recognition, and coherence across all digital channels. Alignment with the Brand Foundation and Visual Identity System provides the necessary framework to maintain the integrity of Quatt’s strategic and aesthetic direction.
The tone and character of digital communications should reflect the core attributes of the brand: clarity, confidence, and a forward-driven energy. Content is intended to embody a precise balance—technologically advanced yet human, accessible yet professional, assertive yet measured.
Emails follow a consistent structure made up of modular sections, as shown on the right. The order and presence of these sections may vary depending on the content and purpose of the email.
To maintain a cohesive and calm look, each email uses a unified colour scheme. We avoid mixing too many colours and instead select tones that align with the product featured.
For example, the email on the right focuses on the HomeBattery, so the dominant colour used is our brand calm green — reinforcing product recognition and visual harmony.
Email marketing
To ensure visual consistency across all printed materials, our brand colors must be reproduced accurately using the correct print color profiles. For print applications, we utilize CMYK and Pantone Matching System (PMS) color specifications.
Offline marketing
