Booking.com
Sign-up Page
— Co-branded affiliate sign-up on CJ
Designing a co-branded, region-ready sign-up experience that improves conversion quality and gives Booking.com full-funnel visibility.
Product Design
UX
Visual Design
Conversion Optimization
Role:
Lead Product Designer
Other credits:
Reynaldo Roman
Image Credits
Courtesy of CJ
~90% reduction in ‘wrong region’ declines
~90% reduction in ‘wrong region’ declines
After redesigning the sign-up flow
After redesigning the sign-up flow
214k+
214k+
Unique Visits
Unique Visits
700k+
700k+
Unique pageviews
Unique pageviews
800+
800+
Active relationships
Active relationships
D E S I G N B R I E F
Challenge
Booking.com was sending high-intent traffic to a dated CJ sign-up page that:
Mixed regions, so publishers often chose the wrong one
Felt off-brand and hard to localise
Didn’t give Booking.com meaningful analytics
In 12 months:
150k visits → 34k applications → ~1k approvals
73% of declines were “wrong region” sign-ups
Pain Point
✳ One generic page + form for all regions → confusion and high rejection rates
✳ No clear guidance when users chose the wrong region or were declined
✳ Legacy forms weren’t mobile-friendly and felt off-brand for Booking.com
✳ No reliable tracking for referral source or on-page behaviour (analytics gap)
✳ One generic page + form for all regions → confusion and high rejection rates
✳ No clear guidance when users chose the wrong region or were declined
✳ Legacy forms weren’t mobile-friendly and felt off-brand for Booking.com
✳ No reliable tracking for referral source or on-page behaviour (analytics gap)
Goal
Improve conversion quality – reduce “wrong region” sign-ups and modernise the flow
Make sign-up easy for publishers – clear regional paths, mobile-ready, accessible forms and messages.
Strengthen CJ’s position with Booking.com – co-branded page plus full-funnel analytics and referral tracking.
✳ Improve conversion quality – reduce “wrong region” sign-ups and modernise the flow
✳ Make sign-up easy for publishers – clear regional paths, mobile-ready, accessible forms and messages.
✳ Strengthen CJ’s position with Booking.com – co-branded page plus full-funnel analytics and referral tracking.
My Role
✳ Mapped current Booking.com → CJ journey and identified drop-off + decline patterns
✳ Defined the information architecture and region model for the new landing + forms
✳ Designed the co-branded UI system and responsive layout
✳ Worked with marketing, product, data, and legal to align on GDPR, tracking, and content
✳ Prepared specs and documentation for implementation and analytics tagging
✳ Mapped current Booking.com → CJ journey and identified drop-off + decline patterns
✳ Defined the information architecture and region model for the new landing + forms
✳ Designed the co-branded UI system and responsive layout
✳ Worked with marketing, product, data, and legal to align on GDPR, tracking, and content
✳ Prepared specs and documentation for implementation and analytics tagging
D E S I G N T H I N K I N G
Discover
Define
Ideate
Prototype
Test
Implement
1.Discover
🗺️ Current user flow audit
🔎 Competitor audit
Documented the full Booking.com to CJ journey, from referral link to approval/decline email, capturing copy, layout, mobile behaviour and technical constraints.
🗺️ Current user flow audit
🔎 Competitor audit
Documented the full Booking.com to CJ journey, from referral link to approval/decline email, capturing copy, layout, mobile behaviour and technical constraints.
🗺️ Current user flow audit
🔎 Competitor audit
Documented the full Booking.com to CJ journey, from referral link to approval/decline email, capturing copy, layout, mobile behaviour and technical constraints.
🗺️ Current user flow audit
🔎 Competitor audit
Documented the full Booking.com to CJ journey, from referral link to approval/decline email, capturing copy, layout, mobile behaviour and technical constraints.
2.Define
🗺️ Problem statement + Hypotethsis
The real issue wasn’t traffic but clarity: high-intent Booking.com publishers were hitting a dated, one-size-fits-all CJ sign-up page where confusing region selection, off-brand UI, and no onsite tracking turned ~150k visits into only ~1k approvals, with 73% of declines.
Our hypothesis was that by reshaping the entry experience around clear region choice and guidance, we could cut “wrong region” declines and recover more qualified approvals.
🗺️ Problem statement + Hypotethsis
The real issue wasn’t traffic but clarity: high-intent Booking.com publishers were hitting a dated, one-size-fits-all CJ sign-up page where confusing region selection, off-brand UI, and no onsite tracking turned ~150k visits into only ~1k approvals, with 73% of declines.
Our hypothesis was that by reshaping the entry experience around clear region choice and guidance, we could cut “wrong region” declines and recover more qualified approvals.
🗺️ Problem statement/Hypotethsis
The real issue wasn’t traffic but clarity: high-intent Booking.com publishers were hitting a dated, one-size-fits-all CJ sign-up page where confusing region selection, off-brand UI, and no onsite tracking turned ~150k visits into only ~1k approvals, with 73% of declines.
Our hypothesis was that by reshaping the entry experience around clear region choice and guidance, we could cut “wrong region” declines and recover more qualified approvals.
🗺️ Problem statement + Hypotethsis
The real issue wasn’t traffic but clarity: high-intent Booking.com publishers were hitting a dated, one-size-fits-all CJ sign-up page where confusing region selection, off-brand UI, and no onsite tracking turned ~150k visits into only ~1k approvals, with 73% of declines.
Our hypothesis was that by reshaping the entry experience around clear region choice and guidance, we could cut “wrong region” declines and recover more qualified approvals.
3.Ideate
🏛️ Concept directions
🧭 Flow
📝 Form experience
📊 Analytics & testing
🌍 Scale & localisation
I explored several directions, from restructuring the flow to tightening the form and making the experience analytics-ready.
🏛️ Concept directions
🧭 Flow
📝 Form experience
📊 Analytics & testing
🌍 Scale & localisation
I explored several directions, from restructuring the flow to tightening the form and making the experience analytics-ready.
🏛️ Concept directions
🧭 Flow
📝 Form experience
📊 Analytics & testing
🌍 Scale & localisation
I explored several directions, from restructuring the flow to tightening the form and making the experience analytics-ready.
🏛️ Concept directions
🧭 Flow
📝 Form experience
📊 Analytics & testing
🌍 Scale & localisation
I explored several directions, from restructuring the flow to tightening the form and making the experience analytics-ready.
4.Prototype
I explored several directions, from restructuring the flow to tightening the form and making the experience analytics-ready.
I explored several directions, from restructuring the flow to tightening the form and making the experience analytics-ready.
I explored several directions, from restructuring the flow to tightening the form and making the experience analytics-ready.
I explored several directions, from restructuring the flow to tightening the form and making the experience analytics-ready.
5.Test
Before hand-off, we treated this as a mini usability + QA cycle rather than a pure visual review.
Stakeholder walkthroughs
Ran click-through sessions with CJ marketing, product, data, and Booking.com stakeholders to validate the journey, region logic, and copy.Usability checks
Asked internal users unfamiliar with the project to “sign up for the right region” and observed where they hesitated or backtracked.
→ Result: simplified region labels, added “which program is right for me?” helper text, and tightened decline messaging.Form & validation QA
Tested field order, password rules, inline errors, and recovery paths (wrong region, incomplete form, duplicate account) on desktop and mobile.Tracking & privacy testing
Verified that key steps (landing, region click, form start, submit, decline) fired the planned Matomo events and URL parameters, and that consent behaviour aligned with GDPR requirements.Accessibility pass
Ran basic checks for contrast, focus states, screen-reader labels, and keyboard navigation, fixing issues directly in the Figma spec.
These rounds gave us confidence that the new flow was clearer, trackable, and implementation-ready before we moved into build.
Before hand-off, we treated this as a mini usability + QA cycle rather than a pure visual review.
Stakeholder walkthroughs
Ran click-through sessions with CJ marketing, product, data, and Booking.com stakeholders to validate the journey, region logic, and copy.Usability checks
Asked internal users unfamiliar with the project to “sign up for the right region” and observed where they hesitated or backtracked.
→ Result: simplified region labels, added “which program is right for me?” helper text, and tightened decline messaging.Form & validation QA
Tested field order, password rules, inline errors, and recovery paths (wrong region, incomplete form, duplicate account) on desktop and mobile.Tracking & privacy testing
Verified that key steps (landing, region click, form start, submit, decline) fired the planned Matomo events and URL parameters, and that consent behaviour aligned with GDPR requirements.Accessibility pass
Ran basic checks for contrast, focus states, screen-reader labels, and keyboard navigation, fixing issues directly in the Figma spec.
These rounds gave us confidence that the new flow was clearer, trackable, and implementation-ready before we moved into build.
Before hand-off, we treated this as a mini usability + QA cycle rather than a pure visual review.
Stakeholder walkthroughs
Ran click-through sessions with CJ marketing, product, data, and Booking.com stakeholders to validate the journey, region logic, and copy.Usability checks
Asked internal users unfamiliar with the project to “sign up for the right region” and observed where they hesitated or backtracked.
→ Result: simplified region labels, added “which program is right for me?” helper text, and tightened decline messaging.Form & validation QA
Tested field order, password rules, inline errors, and recovery paths (wrong region, incomplete form, duplicate account) on desktop and mobile.Tracking & privacy testing
Verified that key steps (landing, region click, form start, submit, decline) fired the planned Matomo events and URL parameters, and that consent behaviour aligned with GDPR requirements.Accessibility pass
Ran basic checks for contrast, focus states, screen-reader labels, and keyboard navigation, fixing issues directly in the Figma spec.
These rounds gave us confidence that the new flow was clearer, trackable, and implementation-ready before we moved into build.
Before hand-off, we treated this as a mini usability + QA cycle rather than a pure visual review.
Stakeholder walkthroughs
Ran click-through sessions with CJ marketing, product, data, and Booking.com stakeholders to validate the journey, region logic, and copy.Usability checks
Asked internal users unfamiliar with the project to “sign up for the right region” and observed where they hesitated or backtracked.
→ Result: simplified region labels, added “which program is right for me?” helper text, and tightened decline messaging.Form & validation QA
Tested field order, password rules, inline errors, and recovery paths (wrong region, incomplete form, duplicate account) on desktop and mobile.Tracking & privacy testing
Verified that key steps (landing, region click, form start, submit, decline) fired the planned Matomo events and URL parameters, and that consent behaviour aligned with GDPR requirements.Accessibility pass
Ran basic checks for contrast, focus states, screen-reader labels, and keyboard navigation, fixing issues directly in the Figma spec.
These rounds gave us confidence that the new flow was clearer, trackable, and implementation-ready before we moved into build.
6.Implement + Iterate
6.Implement + Iterate
Once the flow and specs were signed off, we moved into build and rollout.
Tracking + analytics wiring
Delivered tagging specs so Matomo could capture key events (landing, region select, form start, submit, decline) and source parameters, giving Booking.com a full-funnel view.GDPR & consent
Aligned with legal/privacy to make sure the consent module, cookies, and tracking behaviour met Booking.com’s requirements and local regulations.Launch & monitor
Supported QA in pre-launch, then monitored early data and qualitative feedback with product and data teams, so we could validate improvements and identify follow-up optimisations.
Once the flow and specs were signed off, we moved into build and rollout.
Tracking + analytics wiring
Delivered tagging specs so Matomo could capture key events (landing, region select, form start, submit, decline) and source parameters, giving Booking.com a full-funnel view.GDPR & consent
Aligned with legal/privacy to make sure the consent module, cookies, and tracking behaviour met Booking.com’s requirements and local regulations.Launch & monitor
Supported QA in pre-launch, then monitored early data and qualitative feedback with product and data teams, so we could validate improvements and identify follow-up optimisations.
Once the flow and specs were signed off, we moved into build and rollout.
Tracking + analytics wiring
Delivered tagging specs so Matomo could capture key events (landing, region select, form start, submit, decline) and source parameters, giving Booking.com a full-funnel view.GDPR & consent
Aligned with legal/privacy to make sure the consent module, cookies, and tracking behaviour met Booking.com’s requirements and local regulations.Launch & monitor
Supported QA in pre-launch, then monitored early data and qualitative feedback with product and data teams, so we could validate improvements and identify follow-up optimisations.
Once the flow and specs were signed off, we moved into build and rollout.
Tracking + analytics wiring
Delivered tagging specs so Matomo could capture key events (landing, region select, form start, submit, decline) and source parameters, giving Booking.com a full-funnel view.GDPR & consent
Aligned with legal/privacy to make sure the consent module, cookies, and tracking behaviour met Booking.com’s requirements and local regulations.Launch & monitor
Supported QA in pre-launch, then monitored early data and qualitative feedback with product and data teams, so we could validate improvements and identify follow-up optimisations.
Got an idea?
© 2025 👩💻 Beatriz Afonso
Got an idea?
© 2025 👩💻 Beatriz Afonso