Designing a scalable consent system under legal, business and technical constraints
End-to-End
E-commerce

Company
Coolblue BV
Scope
Netherlands
Belgium
Germany
Stakeholders
Legal
Marketing Tech
Marketing Web Development
Status
Ongoing
Context.
Coolblue operates across multiple European markets, each with strict privacy regulations and different technical setups. Cookie consent is a critical system that impacts legal compliance, customer trust and marketing performance at scale.
Key constraints
- GDPR compliance across markets
- Existing tracking infrastracture
- Business sensitivity to opt-in rates
- Reuse within an existing design system
- Staggered rollout per country
Reframing the problem: Compliance vs Conversion
Following a €40,000 fine due to non-compliant consent patterns, Coolblue needed to redesign its cookie experience across three subsidiaries and platforms. The existing solution optimised acceptance rates but relied on dark patterns that no longer met regulatory requirements.
The challenge was not simply to add missing legal elements, but to translate legal requirements into usable interaction patterns without significantly impacting opt-in rates. At the same time, the solution needed to work within existing technical constraints and be scalable across web and mobile platforms.
In this project, I led the UX concept and design of a new consent system, focusing on stakeholder alignment, system-level consistency and long-term reusability.
Discovery.
Non-negotiables from legal and marketing stakeholders
Early alignment with legal and marketing stakeholders clarified several non-negotiables:
- Visitors must be able to deny non-essential cookies
- Transparency into cookie categories and services must be available
- The solution must support a phased rollout starting with Belgium, followed by Germany and the Netherlands
These requirements formed the baseline for all design decisions.
Defining ethical and usable consent patterns
To ground the design in compliance and user expectations, I reviewed established best practices and known dark patterns in consent design.
These findings were synthesised into three guiding principles:
- Choice clarity: User should clearly understand and control their consent
- Visual neutrality: No option should be misleadingly emphasised
- Reversibility: Consent choices should be easy to change later
These principles informed the design criteria rather than prescribing specific UI patterns.
Auditing the existing consent experience across subsidiaries
A cross-market audit was conducted of the existing cookie banners in the Netherlands, Belgium and Germany.



Key findings:
- All subsidiaries used a cookie wall that blocked access to content
- Language was locked to the default market language with no switching option
- The Netherlands used an “Oké” action instead of an explicit “Accept all” option
- Belgium and Germany allowed granular control, but through inconsistent patterns
This highlighted the lack of a shared consent system and the risk of fragmented compliance.
Learning from the market without copying it
I benchmarked consent patterns used by leading companies in the region to understand common expectations and interaction models.




Observed patterns
- Three-option structure: Accept all, Deny non-essential, Set preferences
- Use of accordions to manage category and vendor complexity
- Language switching support
- Bottom-sheet patterns on mobile

Evaluating consent placement and behavioural impact
The existing cookie wall placement was originally chosen to optimise acceptance rates, despite being a dark pattern. To challenge this assumption, I reviewed studies on consent placement and interaction behaviour.
Research suggested that bottom-placed overlays can increase interaction with both acceptance and decline options. This insight informed the initial design direction, even though later technical constraints prevented full adoption.
Design.
Translating insights into requirements
Based on discovery, I translated insights into system-level requirements:
- Deny non-essential cookies available in the first layer
- Transparent display of cookie categories and services
- Granular control at category and service level
- Expandable and collapsible information hierarchy
- Language switching per subsidiary
- Reuse of existing design system components
Designing the interaction model
Before designing screens, I defined the interaction model and decision flow for the consent system and mapping the key actions to support compliance and usability.

Iterating with stakeholders and technical realities
Mid-fidelity wireframes were used to align stakeholders on the concept and assess feasibility.


Key outcomes from stakeholder review:
- Overlay placement remained centred due to backend tracking dependencies and capacity constraints
- Brand imagery was retained to maintain visual consistency
- Language switching required further technical investigation
- Button styling remained unchanged, with future A/B testing planned to explore a more neutral visual approach
- Mobile app experience would align with the new consent model
These decisions reflect tradeoffs between ideal UX, technical feasibility, and business risk.
Designing a scalable consent pattern
To manage complex category and service information, the consent system used an accordion-based structure. This allowed users to progressively disclose information while keeping the interface manageable.
During design, I worked with design system developers to validate whether nested accordions were technically supported. Confirming this early ensured the solution could scale without custom components.
Aligning the cross-platform experience
With the interaction model and accordion based structure validated, I collaborated with the mobile app designer to align the experience across platforms. Collectively, we decided on the following key decisions:
- Group all primary and secondary actions consistency in second layer
- Use checkboxes instead of toggles to clearly represent selection states
- Preserve interaction logic while adapting layouts per platform


The design outcome

Validation & Iteration
A/B Testing and regulatory impact
An A/B test was planned to compare the new design against the existing implementation. However, a regulatory update in Germany required an immediate update to the existing banner, introducing a deny option in the first layer.

This change resulted in a 20% drop in acceptance rates, highlighting the sensitivity of consent patterns to regulatory-driven changes and reinforcing the need for a more considered system-level approach.
Second design iteration
Following these results, stakeholders requested exploration of alternative approaches that could better balance compliance and business impact.
Explored changes:
- Consolidating category and service information into the first layer
- Re-evaluating the structure of first-layer actions
- Updating action copy to improve clarity
This iteration focused on refining the interaction model rather than reverting to dark patterns.
Final design


What’s Next
Current status & next steps
The consent system design has been aligned across web and mobile platforms and reviewed with legal, marketing tech and development stakeholders. The key design decisions have been validated for compliance and technical feasibility with the solution ready for the phased rollout.
As implementation progresses, the focus will be on validating the solution in real-world conditions and iterating pragmatically:
- Monitor consent behaviour per market after rollout to identify unexpected drops or friction
- Validate user understanding of consent choices through usability checks
- Adjust content hierarchy and copy where clarity or trust issues emerge
- Document learnings to support future compliance-related components and patterns
Key takeaways


