YAHOO FINANCE
HOW MUCH HOUSE
CAN I AFFORD
CALCULATOR
Empowering homebuyers by simplifying the mortgage affordability process, based on key financial inputs, making complex decisions easier
Timeframe
1.2024 - 3.2024
Role
Lead product designer
Platform
Desktop, Mobile web
The Overview
Empower home buying confidence with quantitative answer
The goal of the project is to design and launch a "How Much House Can I Afford" calculator that enables users to conduct a quantitative analysis of potential mortgage options based on their financial situation. The ultimate aim is to drive mortgage applications through Yahoo Finance by offering an accessible, user-friendly tool to help users estimate their home affordability.
Opportunity
For User - 
Set Expectation, Simplify, Guide
For a user with a financial goal in mind (saving for a purchase), research has told us that nearly all users (regardless of segment) follow a similar thought process to managing and optimizing their money.
The first step is to Discover, second step is to Analyze. Before deciding, they scrutinize, dig into the details, ask questions as they apply what they learn to build confidence in their intended money moves.

This is where the home affordability calculator can support set user expectation, simplifies complex financial calculations, guides financial planning and build overall confidence.
For Yahoo - 
Support Personal Finance Core Pillar
We know from competitive research that there are four core offerings to support decision-making for consumers in the Personal Finance space:

1. Expert reviews (and often, ratings)

2. Informative editorial that explains and guides

3. Best of lists & rates tables to support comparisons

4. Calculators to support “What if” analysis.

Adding calculators is critical to both attract and satisfy users.
DESIGN HIGHLIGHT #1
Streamlined page flow to provide user guidance

The page layout is intentionally structured to address three key stages in the decision-making process: "What do I have?", "What's now?", and "What to do next?" This flow ensures that users receive relevant information at each step, helping them confidently move towards their financial decisions.

By organizing the page flow into these distinct sections, the design not only maximizes space efficiency but also aligns with the user's thought process, making it easier to transition from analysis to action. This layout ensures users receive a cohesive, engaging experience that supports their financial planning needs.

DESIGN HIGHLIGHT #2
Real-Time Calculations and feedback simplifying calculations

DTI (Debt-to-Income) ratio is the critical concept for this calculation. Based on DTI and loan information, we can calculate, at different affordability, how much house users can afford and how much monthly mortgage needs to be paid. Users monthly income won’t change, so the change is their savings and payments.

There are 3 main critical DTI values:



1. 20%-36%: Affordable (highly LIKELY get approved by lender)

2. 37%-43%: Stretch (MAYBE get approved by lender)

3. 44%-50%: Aggressive (highly UNLIKELY to be approved by lender)

In order for users to understand how different DTI affects how much they pay, how much of the house and eventually how likely they will get approved, I designed a slider which allows users to visualize the impact of different financial decisions in real-time with dynamic recalculations for different loan terms or interest rates.

DESIGN HIGHLIGHT #3
Shared widget to drive traffic via Yahoo & Yahoo Finance ecosystem
Given the variety of content such as mortgage articles, financial news, and investment pages will benefit users with quick access to the calculator without leaving the page, I created a embeddable widget to place within Yahoo's broader content network.

We not only enhanced user engagement but also drove significant traffic back to the main calculator page. The shared widget played a pivotal role in increasing cross-platform user interaction, leveraging Yahoo's extensive ecosystem to maximize engagement and revenue.
DESIGN HIGHLIGHT #4
Call to Action and Lead Generation
Fixing redundant experience

To encouraging seamless next steps, in the result section, the affiliate program module is added to  show mortgage offers directly related to the user’s calculated affordability. The affiliate program module is a separate independent module, be able to drag and drop to wherever it fits.

While time and efficiency are lifted, users will have to re-enter the inputs that they have just entered for the calculator again, which indicates a redundant experience. Thus, rounds of testing work has happened with the Engr team to make sure those once independent modules now communicate with each other.

Mortgage Rate Drop Alert
A lot of times, a slight drop in mortgage rate can greatly affect the confidence of users continuing the home buying process. Thus, I designed the feature allowing users to set email alerts for when mortgage rates drop below a certain threshold, increasing engagement and repeat visits. A more realistic calculation results lead to more direct sign ups of the affiliate programs, leading to more revenue to Y!Finance in the long term.

This involves collaboration with the central messaging team on setting up the logic for alert setting for logged in and logged users, logistic planning on phase 1 requirements involve how many alert should we allow, and plans for phase 2&3 release.
Business Impact & Results
Higher conversions, higher revenue
The calculator is expected to significantly increase user engagement and drive new revenue streams through affiliate conversions and mortgage applications. Yahoo Finance anticipates a boost in search traffic (MAU) from approximately 201,000 monthly search queries for related keywords.

Search CTR: Targeting a position #4 in search results, with an estimated click-through rate of ~8%.

Affiliate CTR: Anticipated affiliate click-through rate of ~1.4%, driving users towards mortgage offerings.

Monthly Revenue: the expected potential monthly revenue is approximately ~$1.2k.

These metrics will help measure success by driving meaningful engagement and revenue growth through the Yahoo ecosystem.
Conclusion
Simplifying Finance for Broader Impact & Future Growth
This project reinforced the importance of simplifying complex financial information for broad audiences while aligning with business goals. Moving forward, I recommend introducing personalized experiences and further expanding the calculator suite to support broader financial planning needs.