The Royal Richmond
Full website designed and delivered from scratch
Full website designed and delivered from scratch
During the venue takeover, the business needed a new website live quickly due to a change in digital ownership and limited access to previous site assets. I designed the experience in Figma and built the core site in Webflow, then handed over a developer-ready project for final implementation and launch.
Role: UX/UI Designer
Platforms: App & Web
Framer, Webflow
Timeframe: 2 weeks
THE BUSINESS CHALLENGE
A new website needed quickly to support a venue takeover
A new website was required to support the venue takeover and ensure continuity of the venue’s online presence. Due to a change in digital ownership and limited access to the previous website assets, the priority was a fast, credible launch with clear navigation and strong booking visibility.
I designed in Figma and built the core experience in Webflow to accelerate delivery and provide a developer-ready handoff for final refinement and deployment.
Phone off by 10:30
Morning walk
Focus session
Stretch for 5 minutes
Clean workspace
Meditate
Track water
Write journal
4.7 rating (based on 125 reviews)
Stay consistent with a system that fits into real life. Simple cards, clear routines, and gentle nudges help you build progress that lasts.
Habits with structure
A layout that keeps your day clear.
Habitline brings clarity to your routines with clean cards, realistic progress tracking, and guidance that adapts to your day.
Flexible streak rules
Traditional habit trackers are too rigid. Miss one day and your 50-day streak is gone forever.
Smart daily planner
A simple view that shows only the habits that match your current time of day.
Good Morning!
Tuesday, 25 Nov
15%
Completion
07:30 AM
Morning walk
15 minutes
09:00 AM
Drink 3 glasses of water
Before 11:00 AM
10:00 AM
Deep work session
60 minutes
11:30 AM
Read 10 pages
30 minutes
05:00 PM
Stretch routine
10 minutes
10:00 PM
Plan tomorrow
5 minutes
07:30 AM
Morning walk
15 minutes
09:00 AM
Drink 3 glasses of water
Before 11:00 AM
10:00 AM
Deep work session
60 minutes
11:30 AM
Read 10 pages
30 minutes
Routine stacks
Group habits into simple blocks so your day feels organized instead of scattered.
*Simple blocks help you stay on track without thinking.
Weekly reflection
A clear summary of your week that highlights what improved and what needs adjusting.
Your week at a glance
Workout
Meditation
Reading
Streaks completed
3 streaks improved
Focused sessions
Total time: 4h 20m
Gentle reminders
Short, calm nudges that help you stay consistent without pushing too hard.
8:30 PM • Evening Wind-Down
Time to stretch and refresh before your next task.
I'm on it
Later
Stretch for 2 minutes
A quick reset helps reduce stiffness.
Review your next task
Stay on track for the next hour.
Take a 5-minute break
Your focus session is almost done.
Plan the next day
A quick reset helps reduce stiffness.
Evening reset
Tidy up and prepare for tomorrow.
Drink a glass of water
You’re behind today’s hydration goal.
Clear your desk
Create a clean, distraction-free space.
Silence notifications
Protect your focus for what matters.
Posture check
Sit tall and realign your body.
Stretch for 2 minutes
A quick reset helps reduce stiffness.
Review your next task
Stay on track for the next hour.
Take a 5-minute break
Your focus session is almost done.
Plan the next day
A quick reset helps reduce stiffness.
Evening reset
Tidy up and prepare for tomorrow.
Drink a glass of water
You’re behind today’s hydration goal.
Approach
Turning contact drivers into product improvements.
I translated high-volume support drivers into clearer UX patterns focused on clarity, visibility, and next-step guidance at the point of friction.
Clarity
Replace vague or technical language with clearer in-product explanations.
Visibility
Surface important account and payment information at the moment it matters.
Context
Explain why a restriction or requirement exists within the journey itself.
Guidance
Give users better next-step support so more issues can be self-served.
Fits every lifestyle
Some Key Friction Points & Solutions
More actionable deposit error states
Problem: Failed deposits and duplicate payment restrictions surfaced vague or technical messaging, leaving users unsure what had gone wrong or how to recover.
Solution: I redesigned deposit error states to better explain blocked or failed payment attempts and support self-service before contact was needed.
Improved withdrawal guidance
Problem: Users were asked for bank wire details or left waiting on withdrawals without enough explanation, field guidance, or timeframe visibility.
Solution: I added clearer withdrawal messaging, form guidance, and processing expectations to make the journey easier to understand and less support dependent.
Added field guidance for bank wire withdrawals
Problem: Users were asked for details like SWIFT/BIC and IBAN without enough explanation, making the withdrawal form hard to complete confidently.
Solution: I added clearer field guidance and supporting help content so users could understand the required details and complete the form more easily.
Added explanation for bank wire withdrawal requirements
Problem: Users were prompted to enter bank wire details without understanding why this was necessary, especially when their original deposit method did not support withdrawals.
Solution: I introduced a clear in-page explanation to give context at the right moment, helping users understand why bank wire details were needed and what to do next.
Turning known contact drivers into clearer, more self-serve payment experiences.
Prompts users to enter bank details when withdrawals require bank transfer.
Proactive status message sets expectations and reduces ‘where is my money?’ queries.
Persistent verification reminder shown in account area until completed.
Priya
-
Busy Parent
Restriction banner surfaces account status and directs users to the next step (Contact Us).
Leo
-
Creative Professional
Confirmation banner reassures users and communicates payout timeframe.
Potential Projected Impact
600,000+
Fewer chats in 6 months
I translated high-volume support drivers into clearer UX patterns focused on clarity, visibility, and next-step guidance at the point of friction.
of deposit contacts resolved
"Where is my withdrawal?" reduced
Outcome
The work addressed high-friction payment moments by improving clarity around restrictions, failed actions, and withdrawal requirements helping users understand issues in-product instead of relying on support.
Final takeaway
Clearer guidance at the point of friction created a more transparent, self-serve experience across deposit and withdrawal journeys.
Live project
bet365
Customer Contact Drivers
Customer Contact Drivers
Cut 2.4 million payment support chats by redesigning deposit & withdrawal flows
Cut 2.4 million payment support chats by redesigning deposit & withdrawal flows
Cut 2.4 million payment support chats by redesigning deposit & withdrawal flows
This project focused on improving high-friction payment journeys that were driving avoidable customer contact. Using contact-driver insights, live chat reviews, and stakeholder input, I designed clearer messaging, guidance, and error handling to help users understand issues and self-serve.
This project focused on improving high-friction payment journeys that were driving avoidable customer contact. Using contact-driver insights, live chat reviews, and stakeholder input, I designed clearer messaging, guidance, and error handling to help users understand issues and self-serve.
Role: UX/UI Designer
Platforms: App & Web
Tools: Sketch, Photoshop, Illustrator
Timeframe: ~8–12 weeks
Timeframe: 2 weeks
Timeframe: 2 weeks
THE BUSINESS CHALLENGE
THE BUSINESS CHALLENGE
Payments drove 35.53% of all Virtual Assistant contacts
Payments drove 35.53% of all Virtual Assistant contacts
Payments drove 35.53% of all Virtual Assistant contacts
6.8 million Virtual Assistant chats were recorded over a 6-month period.
The top 3 contact reasons accounted for 73.03% of all chats, highlighting a strong opportunity to reduce support demand through clearer product experiences.
6.8 million Virtual Assistant chats were recorded over a 6-month period. The top 3 contact reasons accounted for 73.03% of all chats, highlighting a strong opportunity to reduce support demand through clearer product experiences.
Withdrawal journey - friction points
Withdrawal journey - friction points
Withdrawal journey - friction points
Research highlighted key moments in the deposit flow where unclear messaging and blocked actions were driving avoidable customer contact.
START
SELECT
WITHDRAW
ENTER BANK
WIRE DETAILS
ENTER AMOUNT
ENTER PAYMENT
METHOD DETAILS NEEDED
DEPOSIT
SUCCESSFUL
SUBMIT
WITHDRAWAL
DEPOSIT
SUCCESSFUL
SUBMIT
WITHDRAWAL
PROCESSING
END
FRICTION:
Account restricted │Vague
message – no explanation
26.89% of deposit contacts
FRICTION:
Same card details | "Ref
DCN01 – contact us"
18.36% of contacts
FRICTION:
Failed deposit |
Vague "check details"
FRICTION:
Account restricted │Vague
message – no explanation
26.89% of deposit contacts
FRICTION:
Account restricted │Vague
message – no explanation
26.89% of deposit contacts
FRICTION:
Account restricted │Vague
message – no explanation
26.89% of deposit contacts
START
SELECT
WITHDRAW
ENTER BANK
WIRE DETAILS
ENTER AMOUNT
SUBMIT
WITHDRAWAL
SUBMIT
WITHDRAWAL
PROCESSING
END
FRICTION:
Account restricted │Vague
message – no explanation
26.89% of deposit contacts
FRICTION:
Same card details | "Ref
DCN01 – contact us"
18.36% of contacts
FRICTION:
Failed deposit |
Vague "check details"
FRICTION:
Account restricted │Vague
message – no explanation
26.89% of deposit contacts
FRICTION:
Account restricted │Vague
message – no explanation
26.89% of deposit contacts
FRICTION:
Account restricted │Vague
message – no explanation
26.89% of deposit contacts
Deposit journey - Friction Points
Research highlighted key moments in the deposit flow where unclear messaging and blocked actions were driving avoidable customer contact.
START
SELECT
WITHDRAW
ENTER BANK
WIRE DETAILS
ENTER AMOUNT
SUBMIT
WITHDRAWAL
SUBMIT
WITHDRAWAL
PROCESSING
END
FRICTION:
Same card details | "Ref
DCN01 – contact us"
18.36% of contacts
START
LOG IN &
SELECT MENU
SELECT DEPOSIT
SELECT PAYMENT
METHOD
ENTER PAYMENT
METHOD DETAILS NEEDED
ENTER PAYMENT
METHOD DETAILS NEEDED
DEPOSIT
SUCCESSFUL
BALANCE UPDATED
END
FRICTION:
Same card details | "Ref
DCN01 – contact us"
18.36% of contacts
FRICTION:
Same card details | "Ref
DCN01 – contact us"
18.36% of contacts
FRICTION:
Failed deposit | Vague
"check details"
FRICTION:
Account restricted │Vague
message – no explanation
26.89% of deposit contacts
Deposit journey - Friction Points
Research highlighted key moments in the deposit flow where unclear messaging and blocked actions were driving avoidable customer contact.
ENTER PAYMENT
METHOD DETAILS NEEDED
DEPOSIT
SUCCESSFUL
DEPOSIT
SUCCESSFUL
FRICTION:
Account restricted │Vague
message – no explanation
26.89% of deposit contacts
START
LOG IN &
SELECT MENU
SELECT DEPOSIT
SELECT PAYMENT
METHOD
ENTER PAYMENT
METHOD DETAILS NEEDED
DEPOSIT
SUCCESSFUL
BALANCE UPDATED
END
FRICTION:
Account restricted │Vague
message – no explanation
26.89% of deposit contacts
FRICTION:
Failed deposit |
Vague "check details"
FRICTION:
Account restricted │Vague
message – no explanation
26.89% of deposit contacts
Support contact overview
Support contact overview
Support contact overview
Payments were the largest contact-driver category, making payment journeys a high-impact area for friction reduction.
Payments were the largest contact-driver category, making payment journeys a high-impact area for friction reduction.
Top payment contact drivers
Top payment contact drivers
Top payment contact drivers
Research showed that deposit and withdrawal contact was most often driven by users not understanding why they could not complete key payment actions.
DEPOSIT TOP DRIVERS
Where is my deposit?
Why can't I deposit?
How do I deposit?
WITHDRAWAL TOP DRIVERS
Where is my withdrawal?
Why can't I withdraw?
How do I withdraw?
Approach
Turning contact drivers into product improvements
I translated high-volume support drivers into clearer UX patterns focused on clarity, visibility, and next-step guidance at the point of friction.
Clarity
Replace vague or technical language with clearer in-product explanations.
Visibility
Surface important account and payment information at the moment it matters.
Context
Explain why a restriction or requirement exists within the journey itself.
Guidance
Give users better next-step support so more issues can be self-served.
Approach
Turning contact drivers into product improvements
I translated high-volume support drivers into clearer UX patterns focused on clarity, visibility, and next-step guidance at the point of friction.
Fits every lifestyle
Some Key Friction Points & Solutions
Some Key Friction Points & Solutions
Some Key Friction Points & Solutions
More actionable deposit error states
More actionable deposit error states
More actionable deposit error states
Problem: Failed deposits and duplicate payment restrictions surfaced vague or technical messaging, leaving users unsure what had gone wrong or how to recover.
Solution: I redesigned deposit error states to better explain blocked or failed payment attempts and support self-service before contact was needed.
Improved withdrawal guidance
Problem: Users were asked for bank wire details or left waiting on withdrawals without enough explanation, field guidance, or timeframe visibility.
Solution: I added clearer withdrawal messaging, form guidance, and processing expectations to make the journey easier to understand and less support-dependent.
Added field guidance for bank wire withdrawals
Problem: Users were asked for details like SWIFT/BIC and IBAN without enough explanation, making the withdrawal form hard to complete confidently.
Solution: I added clearer field guidance and supporting help content so users could understand the required details and complete the form more easily.
Added explanation for bank wire withdrawal requirements
Problem: Users were prompted to enter bank wire details without understanding why this was necessary, especially when their original deposit method did not support withdrawals.
Solution: I introduced a clear in-page explanation to give context at the right moment, helping users understand why bank wire details were needed and what to do next.
Added field guidance for bank wire withdrawals
Problem: Users were asked for details like SWIFT/BIC and IBAN without enough explanation, making the withdrawal form hard to complete confidently.
Solution: I added clearer field guidance and supporting help content so users could understand the required details and complete the form more easily.
Improved withdrawal guidance
Problem: Users were asked for bank wire details or left waiting on withdrawals without enough explanation, field guidance, or timeframe visibility.
Solution: I added clearer withdrawal messaging, form guidance, and processing expectations to make the journey easier to understand and less support-dependent.
Added explanation for bank wire withdrawal requirements
Problem: Users were prompted to enter bank wire details without understanding why this was necessary, especially when their original deposit method did not support withdrawals.
Solution: I introduced a clear in-page explanation to give context at the right moment, helping users understand why bank wire details were needed and what to do next.
Turning known contact drivers into clearer, more self-serve payment experiences.
Turning known contact drivers into clearer, more self-serve payment experiences.
Turning known contact drivers into clearer, more self-serve payment experiences.
Maya
-
Student
Completed 21-day streak using Habitline
Prompts users to enter bank details when withdrawals require bank transfer.
Daniel gray
-
Founder
87%Improved weekly consistency
Proactive status message sets expectations and reduces ‘where is my money?’ queries.
Aaron Lee
-
Remote Engineer
Stopped breaking habits on weekends after switching to Habitline
Persistent verification reminder shown in account area until completed.
Priya
-
Busy Parent
Logged 40 focus sessions this month with Routine Stacks
Restriction banner surfaces account status and directs users to the next step (Contact Us).
Leo
-
Creative Professional
10 DaysHit hydration goals
Confirmation banner reassures users and communicates payout timeframe.
Potential Projected Impact
Potential Projected Impact
Potential Projected Impact
600,000+
600,000+
Fewer chats in 6 months
I translated high-volume support drivers into clearer UX patterns focused on clarity, visibility, and next-step guidance at the point of friction.
of deposit contacts resolved
of deposit contacts resolved
"Where is my withdrawal?" reduced
"Where is my withdrawal?" reduced
Outcome
Track what matters, stay organized, and improve at your own pace.
The work addressed high-friction payment moments by improving clarity around restrictions, failed actions, and withdrawal requirements helping users understand issues in-product instead of relying on support.
Final takeaway
Track what matters, stay organized, and improve at your own pace.
Clearer guidance at the point of friction created a more transparent, self-serve experience across deposit and withdrawal journeys.
Outcome
The work addressed high-friction payment moments by improving clarity around restrictions, failed actions, and withdrawal requirements helping users understand issues in-product instead of relying on support.
Final takeaway
Clearer guidance at the point of friction created a more transparent, self-serve experience across deposit and withdrawal journeys.