Property Pro

Searching for the right property can be a tedious and confusing process. Property Pro aims to alleviate the pressure of searching for the perfect property by guiding the user towards properties that suit their needs.

By allowing users to truly customize their search, Property Pro is able to eliminate listings that aren’t a good fit, taking on the brunt of the search work for the user.

Property Pro mocked up on a laptop, tablet and iPhone

Key Functionality

Purchasing a property is an exciting and emotional experience. Without professional guidance, home buyers often end up wasting their time viewing properties that don’t match their needs.

The goal of the initial wireframes was to carve out a robust search feature that would allow users to hone in on the perfect property, cutting out all of the noise along the way. Users are able to compare properties they’ve selected against each other to find the best possible match.

Low Fidelity, paper wireframes of the Property Pro website

The Design

There were a few options considered for the Property Pro design. As described in the below mood boards, I looked at a more natural colour scheme with mint and cream tones, as well as a darker colour scheme with deep blues and copper accents. 

Ultimately, I made the decision to go with the darker colour palette, as the blues evoked feelings of trustworthiness and a sleek modern vibe which worked well with the direction I wanted to take the brand in.

The Result

Once applied to the wireframes the deep blues add a fun pop of colour without feeling overwhelming or too loud. Adding custom icons and illustrations throughout the website helped to bring a sense of trustworthiness and relatability to the brand.

A collection of the final Property Pro screens. High fidelity mock ups.

Animation

Finally, the addition of some simple animation adds a modern touch to the website. As the content within the website requires a more serious tone I kept the animations simple. This loading screen adds an element of excitement to an otherwise tedious task, waiting for content to load.

Gif of Property Pro loading animation

Property Pro Style Guide

I put together a style guide to ensure the brand is portrayed consistently across all mediums. The document discusses the elements, icons, illustrations, imagery, fonts, and colours that can be found throughout the website and how they should be used. The complete document is available for download here Property Pro Style Guide.

Property Pro Style Guide
Property Pro mockup of mobile screens
Property Pro app open on someone's phone
Mockup of mobile screens for Property Pro

Test the Prototype!

If you would like to test out a prototype of the Property Pro website, one can be found here Property Pro Prototype. Enjoy!