Redesigning a real estate portal
Design Challenge
Timeline: 2 weeks
Methodology: Heuristic reviews, Baseline Usability Testing, User Interviews, Affinity Mapping, Prototyping feedback and Testing
Tools: Figma
The Business
Property.com.au (http://property.com.au) is a leading online real estate portal in Australia, enabling people to buy or rent properties. They have one of the largest databases of property listings and have over half the online property portal market share. They have good SEO and rank quite high on common search terms for the property.
The situation
They are facing intense competition from other online property sites that offer a better user experience despite not offering the latest and most accurate property listings. One of the key challenges on the site is the ability to find the most efficient way to search for a property to buy or rent.
The brief
Heuristic review of the site and highlight the top feature for revamping.
Discover
I did a Heuristic evaluation and check against Nielsen Norman’s usability principles. Some of the checklists include Consistency and standards, Recognition rather than recall, Flexibility, & efficiency of use, and Aesthetic and minimalist design for example.
A baseline usability test and user interview were conducted with 5 testers to align the insights. Shortlisted testers included a local real estate agent, 3 house owners who recently purchased their own apartment (of which one is residing in Melbourne), and one of them is currently house hunting (yay!). This was all conducted via Zoom.
Heuristic evaluation and user interviews insights
Landing page
Cons
• 3/5 testers commented that feels too bare and doesn’t give a “trustworthy” or “credible” look.
• 3/5 testers mention that the background photo doesn’t quite relate to real estate.
• 3/5 testers didn’t notice information on the footer. 2 testers mentioned they can’t really read it.
• 4/5 testers weren’t sure if they are on the “Buy” or “Rent” page.
• All of them ignore the keyword search option. When asked: 3/5 say “they are afraid that the keyword function will exclude properties they may be interested in because it fully depends whether or not the listing copy/text happens to contain the keywords they input”
Pros
• 4/5 testers like the search menu as it’s clear and has enough options for the initial search.
Search results page
Cons
• All testers commented that this page feels “very outdated” and feels highly distracted by the moving ads.
• 3/5 testers mention that the photos are too small to see anything without clicking.
• 4/5 testers feel there’s too much scrolling up & down to make edits to the search.
• 3/5 feels the text is too small to read
• All testers say they will look at apartment size (first) which is mostly not available.
• All testers were distracted by the different coloured borders and all the real estate logos. The page feels cluttered.
• 3/5 testers mentioned that some of the information and icons provided are not very consistent. They can’t tell which is clickable and which is not.
• 3 testers noticed that there’s no option to save search nor bookmark any property listing at this point. Having to set your specs every time you use the site is not very efficient.
Pros
• All testers like that they can see some key details (floorplan, beds, bath & photos) without clicking into “View Details”.
Property detail page
Cons
• 4/5 testers felt that they are on a different site from the previous one. Only 2 of them noticed that they are (actually) on a different site.
• 3/5 testers feel that the information presented is all over the place.
• 4/5 testers commented that they can’t see/find the floor plan.
• 4/5 say that they will not select their mortgage thru the website, as it would require more research and comparison on their own. They would rather see the market prices of similar properties sold as a reference.
Pros
• All testers agreed that there is a lot of useful info without leaving the page.
Define
• Users feel the landing page is too bare and it doesn’t give a credible or trustworthy vibe.
• The Search results page feels too outdated and messy with too many agent logos, coloured boxes, and moving ads.
There is a lot of inconsistency in the way the information is presented and the font size is too small to read comfortably.
• While users like that there’s an ample amount of valuable information on the property details page, they are also overwhelmed by the lack of organization.
Most importantly, the users feel like they are visiting a third-party site as the website’s layout and vibe change from page to page. They start from a clean landing page to a cluttered & messy search results page, and finally to a disorganized property details page…
Develop
To have a clearer idea of what needs to be addressed, I mapped out a user flow and highlighted what the user needs at each point of their process.
Wireframes
LANDING PAGE
• Updated the search bar but retain the search information.
• Improve the readability of the “About us” and “Contact us” information.
• The brand colour is used consistently throughout to maintain brand awareness.
SEARCH RESULTS PAGE
• Moved the search bar from the left to the top, and for it to remain constantly on top when users scroll.
• Improve the readability of font size and upsize the photos.
• Introduced the “Save Search” button as 4/5 testers want to be able to save a search and shortlist/bookmark them for future use.
• Instead of coloured boxes with the agent’s logos littered all over the site, I’d simplified the boxes, and updated & modernized the overall image of the site.
PROPERTY DETAIL PAGE
• Notice that the way the information is presented differently throughout the pages, I’d introduced tabs to sectioned the different parts of the house-hunting process. This makes the house hunting process a lot more enjoyable.
• Displaying the timestamp and floorplan prominently.
Here’s the first iteration of the desktop and the mobile that I used for usability testing…
Results from user testing
I conducted user testing to test out the way information is now presented. Five testers are screened and are all in the process, or had recently purchased their own apartment.
LANDING PAGE
• All testers feel more confident about the website and can easily locate the rest of the information.
• “Buy” & “Rent” tabs are much clearer now, no more confusion about which page they are on.
SEARCH RESULTS PAGE
• All testers like that the “search bar” is constantly on top even when they scroll, making it easier for them to make changes to their search at any time they needed to.
• This page is now cleaner and much easier on their eyes.
• They also like the option to “Save search” and be able to shortlist/bookmark their listing.
PROPERTY DETAILS PAGE
• All testers like that the “floorplan” is easily located together with the rest of the essential information.
• All the information is now better organized and can be easily accessed.
• Users couldn’t find the price guide for recent sales of similar apartments. The category has to be renamed for better UX. Now it’s renamed as “Loans & price guide” as named previously as “Loans & finance”.
“Oh, this isn’t real? I thought it was a real website!”
What one of the testers said
Next steps
• To conduct further research to better understand the Australian terms and market.
• Conduct card-sorting and tree-testing to better categorize the information.
• Explore ways to showcase the ads without annoying the users.
• To explore a comparison page to compare properties features and prices etc.
Reflections
This project started off as a 1-week design challenge as part of an interview process but since the interviewers were busy, the presentation was postponed another week. With the extra week, I thought I should put my prototype thru some tests to make the extra week I had worth it.
In the initial part of the research, I interviewed a local real estate agent and she gave me a lot of insights coming from the “other” side.
As this portal is targeted at the Australian market, I’m really grateful to have found at least one tester that resides in Melbourne (yay!) and had recently purchased his own apartment (double yay!). His insights, combined with the local testers, opened my eyes to the different needs of the local and foreign buyers.
And it’s also thru this project, I began to learn more about Figma prototyping. I was initially more keen on prototyping on Axure, but this project has really opened my eyes to what Figma can now do! Now I truly understand how Figma is winning hearts all over the world!
