A Refined Deals Experience
From cluttered marketing banners to high-conversion UI
I swapped cluttered deal cards for psychology-backed, mobile-first layouts. By prioritizing trust and clarity, I turned the deals page into a smooth journey.
Lead Designer
2 Months
Lead Designer
2 Months
A Refined Deals Experience
From cluttered marketing banners to high-conversion UI
I swapped cluttered deal cards for psychology-backed, mobile-first layouts. By prioritizing trust and clarity, I turned the deals page into a smooth journey.
Lead Designer
2 Months
Lead Designer
2 Months
The Challenge
Aesthetics Hindering Value Functionality
Deal cards featured cramped information architecture where overlapping graphics hindered legibility and visual flow. By placing product names inside complex visual elements, the design created clutter that distracted from vital attributes like treatment zones. The lack of contrast in price displays meant critical decision data was buried, leading to a disjointed experience where aesthetic choices overshadowed functional user needs.
The Diluted Value Proposition
The introduction suffered from poor visual hierarchy and high cognitive load due to dense, centered text. Lacking clear typographic distinction or a prominent CTA, the value proposition was difficult to scan, forcing users to dig for relevant information. This layout felt disconnected from Faceland’s premium medical status, presenting more as a generic information page than a high-converting entry point for a luxury service.
The Desktop-First Mobile Friction
On mobile, the interface failed to optimize screen real estate, causing significant scrolling fatigue. Oversized hero elements pushed essential content below the fold, while filter tabs lacked ergonomic, thumb-friendly placement for seamless navigation. Bulky graphic elements often pushed primary action buttons out of the immediate viewport, creating conversion friction and making the experience feel like a desktop afterthought rather than a mobile-first solution.
The Challenge
Aesthetics Hindering Value Functionality
Deal cards featured cramped information architecture where overlapping graphics hindered legibility and visual flow. By placing product names inside complex visual elements, the design created clutter that distracted from vital attributes like treatment zones. The lack of contrast in price displays meant critical decision data was buried, leading to a disjointed experience where aesthetic choices overshadowed functional user needs.
The Diluted Value Proposition
The introduction suffered from poor visual hierarchy and high cognitive load due to dense, centered text. Lacking clear typographic distinction or a prominent CTA, the value proposition was difficult to scan, forcing users to dig for relevant information. This layout felt disconnected from Faceland’s premium medical status, presenting more as a generic information page than a high-converting entry point for a luxury service.
The Desktop-First Mobile Friction
On mobile, the interface failed to optimize screen real estate, causing significant scrolling fatigue. Oversized hero elements pushed essential content below the fold, while filter tabs lacked ergonomic, thumb-friendly placement for seamless navigation. Bulky graphic elements often pushed primary action buttons out of the immediate viewport, creating conversion friction and making the experience feel like a desktop afterthought rather than a mobile-first solution.
The Challenge
Aesthetics Hindering Value Functionality
Deal cards featured cramped information architecture where overlapping graphics hindered legibility and visual flow. By placing product names inside complex visual elements, the design created clutter that distracted from vital attributes like treatment zones. The lack of contrast in price displays meant critical decision data was buried, leading to a disjointed experience where aesthetic choices overshadowed functional user needs.
The Diluted Value Proposition
The introduction suffered from poor visual hierarchy and high cognitive load due to dense, centered text. Lacking clear typographic distinction or a prominent CTA, the value proposition was difficult to scan, forcing users to dig for relevant information. This layout felt disconnected from Faceland’s premium medical status, presenting more as a generic information page than a high-converting entry point for a luxury service.
The Desktop-First Mobile Friction
On mobile, the interface failed to optimize screen real estate, causing significant scrolling fatigue. Oversized hero elements pushed essential content below the fold, while filter tabs lacked ergonomic, thumb-friendly placement for seamless navigation. Bulky graphic elements often pushed primary action buttons out of the immediate viewport, creating conversion friction and making the experience feel like a desktop afterthought rather than a mobile-first solution.
The Desktop-First Mobile Friction
On mobile, the interface failed to optimize screen real estate, causing significant scrolling fatigue. Oversized hero elements pushed essential content below the fold, while filter tabs lacked ergonomic, thumb-friendly placement for seamless navigation. Bulky graphic elements often pushed primary action buttons out of the immediate viewport, creating conversion friction and making the experience feel like a desktop afterthought rather than a mobile-first solution.
The Desktop-First Mobile Friction
On mobile, the interface failed to optimize screen real estate, causing significant scrolling fatigue. Oversized hero elements pushed essential content below the fold, while filter tabs lacked ergonomic, thumb-friendly placement for seamless navigation. Bulky graphic elements often pushed primary action buttons out of the immediate viewport, creating conversion friction and making the experience feel like a desktop afterthought rather than a mobile-first solution.
Research and Wireframes
Desktop Hero Section
The main idea was to alleviate user overwhelm and reduce Cognitive Load by focusing attention. The central content block utilizes the Gestalt Principle of Proximity to group deal components (title, description, action) into unified, scannable chunks. This design decision, validated externally, ensures superior Perceptual Fluency, allowing users to rapidly process deal information without being visually overloaded.
Research and Wireframes
Desktop Hero Section
The main idea was to alleviate user overwhelm and reduce Cognitive Load by focusing attention. The central content block utilizes the Gestalt Principle of Proximity to group deal components (title, description, action) into unified, scannable chunks. This design decision, validated externally, ensures superior Perceptual Fluency, allowing users to rapidly process deal information without being visually overloaded.
Desktop Cards Component
The main design decision was to structure each deal using the Gestalt Principle of Common Region. By enclosing all related deal information (image, title, price, CTA) within a single card boundary, the user instantly Chunks the content as a unified offer. This significantly reduces Cognitive Load during scanning. The uniform grid layout further aids Pattern Recognition, enabling rapid comparison of deals. This highly organized structure, validated through testing, drastically improves Findability and efficiency, preventing visual overload on a deals-heavy page.
Desktop Cards Component
The main design decision was to structure each deal using the Gestalt Principle of Common Region. By enclosing all related deal information (image, title, price, CTA) within a single card boundary, the user instantly Chunks the content as a unified offer. This significantly reduces Cognitive Load during scanning. The uniform grid layout further aids Pattern Recognition, enabling rapid comparison of deals. This highly organized structure, validated through testing, drastically improves Findability and efficiency, preventing visual overload on a deals-heavy page.
Mobile First Layouts that Reduce Cognitive Overload
Given that most users navigate on mobile devices, the layout was rebuilt from the ground up with mobile as the primary experience. Information is broken into digestible blocks. The spacing, typography and visual rhythm guide users through the content without friction.
Mobile First Layouts that Reduce Cognitive Overload
Given that most users navigate on mobile devices, the layout was rebuilt from the ground up with mobile as the primary experience. Information is broken into digestible blocks. The spacing, typography and visual rhythm guide users through the content without friction.
Mobile First Layouts that Reduce Cognitive Overload
Given that most users navigate on mobile devices, the layout was rebuilt from the ground up with mobile as the primary experience. Information is broken into digestible blocks. The spacing, typography and visual rhythm guide users through the content without friction.
From Wireframes to High-Fidelity Prototypes
Stronger First Impressions For The Hero Section
The transition from wireframes to final designs was a disciplined, iterative process driven by user feedback. The wireframes established the foundation, implementing principles like reducing Cognitive Load for structure. We then applied the new visual language (color, typography) in prototypes. Critical decisions, such as the clear CTA and card organization, were rigorously tested externally. This validation cycle ensured continuous refinement, resulting in final designs that merged the brand's aesthetic with high Perceptual Fluency and superior usability across all devices.
From Wireframes to High-Fidelity Prototypes
Stronger First Impressions For The Hero Section
The transition from wireframes to final designs was a disciplined, iterative process driven by user feedback. The wireframes established the foundation, implementing principles like reducing Cognitive Load for structure. We then applied the new visual language (color, typography) in prototypes. Critical decisions, such as the clear CTA and card organization, were rigorously tested externally. This validation cycle ensured continuous refinement, resulting in final designs that merged the brand's aesthetic with high Perceptual Fluency and superior usability across all devices.
From Wireframes to High-Fidelity Prototypes
Stronger First Impressions For The Hero Section
The transition from wireframes to final designs was a disciplined, iterative process driven by user feedback. The wireframes established the foundation, implementing principles like reducing Cognitive Load for structure. We then applied the new visual language (color, typography) in prototypes. Critical decisions, such as the clear CTA and card organization, were rigorously tested externally. This validation cycle ensured continuous refinement, resulting in final designs that merged the brand's aesthetic with high Perceptual Fluency and superior usability across all devices.
From Wireframes to High-Fidelity Prototypes
Stronger First Impressions For The Hero Section
The transition from wireframes to final designs was a disciplined, iterative process driven by user feedback. The wireframes established the foundation, implementing principles like reducing Cognitive Load for structure. We then applied the new visual language (color, typography) in prototypes. Critical decisions, such as the clear CTA and card organization, were rigorously tested externally. This validation cycle ensured continuous refinement, resulting in final designs that merged the brand's aesthetic with high Perceptual Fluency and superior usability across all devices.
From Wireframes to High-Fidelity Prototypes
Stronger First Impressions For The Hero Section
The transition from wireframes to final designs was a disciplined, iterative process driven by user feedback. The wireframes established the foundation, implementing principles like reducing Cognitive Load for structure. We then applied the new visual language (color, typography) in prototypes. Critical decisions, such as the clear CTA and card organization, were rigorously tested externally. This validation cycle ensured continuous refinement, resulting in final designs that merged the brand's aesthetic with high Perceptual Fluency and superior usability across all devices.
From Wireframes to High-Fidelity Prototypes
Stronger First Impressions For The Hero Section
The transition from wireframes to final designs was a disciplined, iterative process driven by user feedback. The wireframes established the foundation, implementing principles like reducing Cognitive Load for structure. We then applied the new visual language (color, typography) in prototypes. Critical decisions, such as the clear CTA and card organization, were rigorously tested externally. This validation cycle ensured continuous refinement, resulting in final designs that merged the brand's aesthetic with high Perceptual Fluency and superior usability across all devices.
AI Powered Visuals Enhancing Deal Cards
The treatments section highlights the most popular option within each category with refined visuals and layouts. This gives users early clarity about the types of services available and improves the visibility of high demand treatments.
Improved Map Experience
Users can now quickly locate any of the 60 plus clinics across five countries. The new map integrates directly with Google My Business which means that opening hours and content update automatically. Tapping on a clinic lets users open directions instantly in Google Maps which creates a seamless journey from discovery to action.
Project Outcome - A Refined Deals Experience
The Objective
This project focused on modernizing the clinic’s deal cards to align with the new premium design language. The goal was to provide users with essential information through a cleaner layout and improved visual hierarchy, reducing cognitive load while maintaining the brand's luxury positioning.
Minimizing the "Chameleon Effect"
By replacing clashing marketing banners with a stable, professional visual system, the redesign establishes immediate brand trust. This streamlined approach is designed to reduce the "visual overwhelm" that often leads to high bounce rates on landing.
Enhanced Perceptual Fluency
Through the use of high-end, aspirational imagery and a clear "A-brand" ticker, we created a more immersive experience. The focus shifted from "discount skimming" to active engagement, encouraging users to navigate deeper into the curated deals offerings.
Optimizing Findability and Conversion
The redesign of the "Deals" CTA and the integration of clear credibility markers (USPs) directly improve the Findability of primary offers. This ensures the new design doesn't just look luxurious—it is strategically engineered to drive users toward key conversion actions.
Project Outcome - A Refined Deals Experience
The Objective
This project focused on modernizing the clinic’s deal cards to align with the new premium design language. The goal was to provide users with essential information through a cleaner layout and improved visual hierarchy, reducing cognitive load while maintaining the brand's luxury positioning.
Minimizing the "Chameleon Effect"
By replacing clashing marketing banners with a stable, professional visual system, the redesign establishes immediate brand trust. This streamlined approach is designed to reduce the "visual overwhelm" that often leads to high bounce rates on landing.
Enhanced Perceptual Fluency
Through the use of high-end, aspirational imagery and a clear "A-brand" ticker, we created a more immersive experience. The focus shifted from "discount skimming" to active engagement, encouraging users to navigate deeper into the curated deals offerings.
Optimizing Findability and Conversion
The redesign of the "Deals" CTA and the integration of clear credibility markers (USPs) directly improve the Findability of primary offers. This ensures the new design doesn't just look luxurious—it is strategically engineered to drive users toward key conversion actions.
The Challenge
Aesthetics Hindering Value Functionality
Deal cards featured cramped information architecture where overlapping graphics hindered legibility and visual flow. By placing product names inside complex visual elements, the design created clutter that distracted from vital attributes like treatment zones. The lack of contrast in price displays meant critical decision data was buried, leading to a disjointed experience where aesthetic choices overshadowed functional user needs.
The Diluted Value Proposition
The introduction suffered from poor visual hierarchy and high cognitive load due to dense, centered text. Lacking clear typographic distinction or a prominent CTA, the value proposition was difficult to scan, forcing users to dig for relevant information. This layout felt disconnected from Faceland’s premium medical status, presenting more as a generic information page than a high-converting entry point for a luxury service.
The Desktop-First Mobile Friction
On mobile, the interface failed to optimize screen real estate, causing significant scrolling fatigue. Oversized hero elements pushed essential content below the fold, while filter tabs lacked ergonomic, thumb-friendly placement for seamless navigation. Bulky graphic elements often pushed primary action buttons out of the immediate viewport, creating conversion friction and making the experience feel like a desktop afterthought rather than a mobile-first solution.
Matteo Favetta
Lead Product Designer based in The Hague, Netherlands, speciliased in Applied Cognitive Psychology
4+
Years of Research & Design
1
Published Scientific Paper
5
Global Markets Optimized
100% Human Designed. No AI tools used. © 2026 Matteo Favetta. All rights reserved.
Matteo Favetta
Lead Product Designer based in The Hague, Netherlands, speciliased in Applied Cognitive Psychology
4+
Years of Research & Design
1
Published Scientific Paper
5
Global Markets Optimized
100% Human Designed. No AI tools used. © 2026 Matteo Favetta. All rights reserved.
Matteo Favetta
Lead Product Designer based in The Hague, Netherlands, speciliased in Applied Cognitive Psychology
2.5
Years of experience
16
Impactful Projects Shipped
1M+
Sessions / month
100% Human Designed. No AI tools used. © 2026 Matteo Favetta. All rights reserved.
Matteo
Matteo
Favetta
Favetta
Lead Product Designer based in The Hague, Netherlands, speciliased in Applied Cognitive Psychology
In an era of generic AI templates, this portfolio remains 100% human-designed. Every layout, interaction, and strategic decision was custom-built from the ground up. No prompts, just craft, because authentic UX requires a human touch.
© 2026 Matteo Favetta. All rights reserved.
4+
Years of Research and Design
1
Published Scientific Paper