Mobile app
HSF App
A dating app for people looking to get married.
- Product
- Dating app for marriage
- Platform
- Mobile, 375 x 812 frames
- Deliverables
- 67 screens, user flows, UI design
- Features
- Matching, chat, calls, Wali, ID check
Overview
Finding a spouse, with faith in every step.
HSF, short for Halal Spouse Finder, is a dating app for Muslims who want to marry.
I designed the whole app, from onboarding and OTP sign up to matching, chat, calls, Wali access and ID checks.
The challenge
Trust must come before the first match.
- 01Users need to know who they talk to.
- 02Sect and religiosity matter as much as age and city.
- 03Some users want a guardian, the Wali, in chats.
The approach
Check early, show values, keep family close.
- 01Setup ends with a selfie check. Settings add front and back ID checks.
- 02Profiles show Religiosity chips like Sunni, Practising and Convert/Revert.
- 03In any chat, users can add a Chaperone (Wali) by email.
User flow
Twelve screens, two journeys.
Getting in ends with a selfie check. Then matching and messages share one tab bar.
Getting in
Matching and chat
Key screen
Home.
One profile at a time, with key facts up front.
- 1Greeting header
User photo and name, plus a notification bell.
- 2Search and filters
Search and a filter button for age, location and education.
- 3One profile at a time
A full photo card with name, age and city.
- 4Key facts as chips
Gender, profession and nationality as small tags.
- 5Pass, message or like
Three round buttons decide what happens next.
- 6Four tabs
Home, Explore, Messages and Profile tabs.
Key screen
View profile.
A full profile reads like a short hello.
- 1Save for later
A bookmark in the header saves the profile.
- 2Photo gallery
Swipeable photos with page dots under them.
- 3Name, age and city
Big text right under the photos.
- 4About Me
Height, marital status, children and marriage plans as chips.
- 5Religiosity
Sect, conversion and practice sit in their own group.
Visual language
Fresh mint on deep ink.
Mint for actions, ink for text, soft tints for backgrounds.
- Mint
#4EC492 - Teal
#50A99A - Ink
#101828 - Light Mint
#D0FFF7 - Ghost White
#F8FAFF - White
#FFFFFF
Typography
Typeface
Aa
Prompt
Prompt across the app, from Regular body text to Bold names and titles.
- Regular
- Medium
- SemiBold
- Bold
Type scale
Aliyyah, 27
Prompt
Real sizes from the profile screens.
- Bold 22
- Bold 18
- Bold 16
- Regular 14
- Medium 12
- Regular 12
Deliverables
What I delivered.
- User flow
- Onboarding
- Sign up and OTP
- Profile setup
- Matching and explore
- Messages and calls
- Chaperone (Wali)
- ID verification
- Settings and subscriptions
- About, help and blogs
Want this kind of clarity for your mobile app?
Book a free 30 minute call. You leave with 3 written fixes, even if we don’t work together.
Nafees ZulfiqarUsually replies within an hour
5.0 from 33 Upwork reviewsTop Rated
