Preston Halstead
UX designer

WACO Title

Home Seller Calculators for Responsive Web

WACO Title was experiencing a massive drop in organic visits to their site due to an outdated design for their Seller's Proceeds Netsheet and Financing Calculators that wasn't responsive. In order to draw more visitors looking to sell their homes, they needed a modern look and feel with a responsive approach to the design.

Project Styleguide

In order to design a component library that was consistent with the established brand styles, I started with a styleguide initiative where I worked with the project stakeholders to define:

  • Primary and secondary color palette

  • Text styles

  • Iconography

  • Field and Form patterns

WACO Title - Home Financing Calculators

Seller's Proceeds Netsheet Calculator:

Guiding Requirements:

  • The Seller's Netsheet needed to provide a clear view of all the output data without the need to scroll.

  • For pricing comparisons, it was necessary to design the calculators to be stacked horizontally (3 max).

  • Each individual output needed to be editable, the design approach allowed for each column to expand vertically to display the input view.

Seller's Netsheet Output - Comparison view

Seller's Netsheet Output - Comparison view

Responsive Design Approach

Since sellers and realtors commonly make calculations on the go, all the calculators on the site needed to respond well when viewing on a mobile screen. The examples below show the landing, input, and output view for the calculator on mobile.

Result: 35%
Jump in organic site visits
"Preston worked with our team with an effective, functional approach to design. We're extremely happy with the results."
-Patrick Curry, WACO Title CEO