CBRE
CBRE
2023
2023
Client
Client
CBRE
CBRE
role
role
Visual Design, Design System Architecture, UI Documentation
Visual Design, Design System Architecture, UI Documentation
Agency
Agency
DEPT
DEPT
CBRE, the world’s largest commercial real estate services firm, manages numerous office buildings across the Netherlands. To enhance tenant experience, CBRE developed an app that centralises building services from facility requests to community updates, all within one digital platform. During its redesign, I joined the team to define and implement a cohesive design system, ensuring consistency across multiple branded versions of the app.
The Ask
The Ask
The redesign required both visual refinement and systematic structure. Each building operated under distinct branding guidelines, making it difficult to maintain consistency. My task was to lead the creation of a scalable design system that unified these variations, simplified collaboration, and improved design–development alignment.
The Ask
The redesign required both visual refinement and systematic structure. Each building operated under distinct branding guidelines, making it difficult to maintain consistency. My task was to lead the creation of a scalable design system that unified these variations, simplified collaboration, and improved design–development alignment.
The Approach
The Approach
The goal was to build a design system that was not only visually coherent but also technically functional and easy to navigate.
The Approach
The goal was to build a design system that was not only visually coherent but also technically functional and easy to navigate.
Establish structure & clarity
Establish structure & clarity
I reorganised design files into clear sections by page and component type, improving accessibility for designers, developers, and project managers. This structure became the foundation for efficient collaboration and faster iteration.
Establish structure & clarity
I reorganised design files into clear sections by page and component type, improving accessibility for designers, developers, and project managers. This structure became the foundation for efficient collaboration and faster iteration.
Components consistency
Components consistency
Buttons were one of the most frequently used yet inconsistently styled elements. I consolidated all existing button styles, refined them for coherence, defined states and interactions, and created adaptable variants for each building’s brand identity.
Components consistency
Buttons were one of the most frequently used yet inconsistently styled elements. I consolidated all existing button styles, refined them for coherence, defined states and interactions, and created adaptable variants for each building’s brand identity.
Building a functional system
Building a functional system
To ensure long-term scalability, I implemented component logic and naming conventions using Figma’s advanced features, including booleans, instance swaps, and variants. This transformed the project from a collection of screens into a structured, living system that could evolve with new requirements.
Building a functional system
To ensure long-term scalability, I implemented component logic and naming conventions using Figma’s advanced features, including booleans, instance swaps, and variants. This transformed the project from a collection of screens into a structured, living system that could evolve with new requirements.
The Impact
The Impact
The new design system replaced disorganisation with clarity. It improved team collaboration, reduced development handover time, and gave stakeholders a clear visual overview of the product. Designers could now work faster and with greater consistency, while developers gained a reliable visual reference for implementation.
The Impact
The new design system replaced disorganisation with clarity. It improved team collaboration, reduced development handover time, and gave stakeholders a clear visual overview of the product. Designers could now work faster and with greater consistency, while developers gained a reliable visual reference for implementation.
More works
Let's create a meaningful experience together.
Let's create a meaningful experience together.
Let's create a meaningful experience together.