My Role & Scope
I was the sole product designer, responsible for end-to-end ownership of the user experience:
- Problem definition and UX strategy
- User flows and information architecture
- Interaction and responsive design
- Design validation and iteration
- Translating UX decisions directly into a shipped product using AI-assisted workflows
I treated this as a production product, designing with scalability, performance, and real-world constraints in mind.
The Problem
Buying a home is one of the most complex financial decisions people make, yet most mortgage tools prioritize calculations over comprehension.
For Homebuyers
- Mortgage calculators were confusing and number-heavy
- Users struggled to understand tradeoffs, not just monthly payments
- Financial anxiety caused drop-off before meaningful insight
For Realtors
- Limited visibility in search results
- No simple way to offer value before asking for contact information
- Lead capture tools felt disconnected from real buyer intent
The Gap
No unified tool that combines smart calculators, local housing assistance programs, and realtor-branded lead capture in one experience. The product needed to bridge financial tools that are technically accurate but emotionally overwhelming with marketing tools that generate traffic but fail to guide real decisions.
Goals
Clarity Over Calculation
Help homebuyers understand affordability clearly, not just calculate it
Trust Before Conversion
Build trust and deliver value before asking for commitment
Scalable Lead Capture
Give realtors a scalable way to capture and nurture qualified leads
Constraints & Tradeoffs
Mortgage logic is inherently complex but needed to feel simple
Users needed confidence before being asked to convert
SEO requirements influenced page structure and content hierarchy
Product had to work seamlessly across mobile and desktop
These constraints shaped every design decision - balancing technical accuracy with emotional clarity, SEO needs with user experience, and speed of execution without sacrificing UX quality.
Market Research
of first-time buyers are unaware of local/state housing grants
Keyword searches: "mortgage calculator [city]", "first-time buyer grants in [state]"
Realtors spend heavily on lead-gen but complain about recycled leads
Opportunity
Visibility + Trust + Lead Ownership in one tool.
User Personas
Sarah
First-Time Homebuyer, Age 29
Income
$65k annually
Goal
Buy a starter home within 12 months
Pain Points
- Confused about affordability
- Hidden costs uncertainty
- Unaware of grants available
Needs
A trustworthy tool that shows real numbers and grants
James
Realtor, Age 41
Background
Runs a small team in Atlanta
Goal
Capture more exclusive leads without paying Zillow
Pain Points
- Spends $1500/month on leads
- 60% of leads are junk
- Low brand visibility
Needs
A co-branded page that ranks locally and brings in quality buyers
Process
1Understanding User Behavior
Instead of assuming users wanted "more data," I focused on how people make financial decisions under stress.
Users don't trust numbers they don't understand
Too many inputs upfront increases abandonment
Comparison and explanation matter more than precision
2Defining the Core Flow
I designed the experience around progressive clarity, not instant results.
- Short, approachable input flow
- Results framed around understanding, not judgment
- Clear explanation of what the numbers mean
- Visual comparison instead of dense tables
This helped users feel guided instead of evaluated.
3Realtor Value Without Aggressive Sales
For realtor-facing pages, the challenge was building trust before lead capture.
- Co-branded pages focused on education first
- Soft CTAs placed after value delivery
- SEO-optimized structure without feeling promotional
- Clear separation between guidance and contact
This positioned realtors as helpers, not salespeople.
User Journey Maps
Homebuyer Journey
Google search: 'how much house can I afford in Atlanta'
Finds local realtor's Mortgage Easy partner page
Submits info to 'Check Eligibility' -> lead captured
Uses calculator -> sees affordability + assistance programs
Connects with realtor via branded page
Realtor Journey
Mortgage Easy App Landing page
Become a Partner
Creates co-branded partner page (SEO optimized)
Shares link across socials & Google indexes it
Leads flow into dashboard with contact info
Competitor Analysis
| Competitor | Strengths | Weaknesses |
|---|---|---|
| Zillow | High traffic, trusted brand | Generic, recycled leads, realtor invisible |
| Bankrate | Strong calculators | No local grants, no realtor branding |
| DownPaymentResource | Good grant data | No lead capture, not realtor-focused |
| Mortgage Easy | Local SEO + assistance programs + branded lead capture | New player, smaller market presence initially |
Prototyping & Testing
Realtor User Wireframes
Become Partner Form -> Partner Page -> Check Eligibility Form -> Calculator
Become Partner Form
Hover to zoom
Partner Page
Hover to zoom
Check Eligibility Form
Hover to zoom
Calculator
Hover to zoom
High-Fidelity Prototypes
Comprehensive Mortgage Calculator
Co-Branded Realtor Partner Page
Usability Testing
10 beta testers (5 buyers, 5 realtors)
Buyer Feedback
Loved affordability + grant transparency
Realtor Feedback
Appreciated SEO ranking and exclusive leads
Iterations Made
- Free trial replaced with 30-day money-back guarantee
- Added PDF export for buyers to share results
Development & Shipping
Tech Stack
Features Built
- Smart calculator (affordability + rent vs buy)
- Partner pages /partners/[slug] with SEO
- Admin portal (leads, premium users, analytics, broadcast inbox)
- Automated SEO article generation with DALL-E images
- Partner dashboard (CSV leads, subscription, referrals)
Deployment
- Hosted on Vercel
- Weekly cron job for SEO content
- Secure Firestore rules
- Stripe webhooks for subscription + refunds
Results
Partner pages ranked for long-tail searches ('mortgage calculator Newark NJ')
Realtors gained exclusive inbound leads within first 2 weeks
50+ housing programs added across multiple states
Increased partner conversions with referral rewards
Lessons Learned
Realtors value lead ownership more than 'features.'
Buyers need trust-building transparency (grants + true costs).
SEO automation is a game changer for local visibility.
Next Steps
Expand assistance programs nationwide
Launch mobile app version
Integrate AI chat assistant for real-time buyer Q&A
Scale realtor onboarding with referral + partnerships
Key UX Decisions
Progressive Disclosure
Reduced cognitive load by revealing complexity only when needed
Plain-Language Explanations
Financial concepts explained in human terms
Trust-First Design
No forced signup before value is delivered
Mobile-First Layouts
Designed for real-world usage patterns
System Consistency
Shared patterns across buyer and realtor experiences
Intentional Simplicity
Avoided features that added noise without clarity
Outcome & Execution
Beyond design, I translated UX decisions directly into the live product using AI-assisted workflows in VS Code, ensuring:
- Design intent matched real interaction behavior
- Edge cases were handled early
- UX decisions were validated in production, not just in mockups
This closed the gap between design and delivery.
Fully Shipped Product
A production-ready SaaS platform with clearer decision-making experience for homebuyers
Scalable Foundation
System designed for realtor acquisition and lead capture without UX debt
While still early-stage, the product demonstrates strong alignment between user needs, business goals, and technical execution.
Reflection
This project reinforced the value of designing not just screens, but systems that help people make confident decisions.
If continuing this work in a team environment, I would:
- -Expand user validation with a broader range of buyer profiles
- -Collaborate earlier with engineering on performance optimization
- -Explore deeper personalization for returning users