Featured Properties Widget
As a Web Design Manager it was important to stay aware of any usability issues and strive towards creating a better product for our customers. One of the biggest selling points for our real estate agent and broker customers was our IDX listings pages, which had a Pinterest Masonry style layout. When I interacted with customers I noticed a trend that many of them were frustrated by our Featured Properties widget which had been developed almost a decade ago. I agreed that it needed a facelift (both in design and function), so I decided to do some research and then design a new alternative to help improve the product.
Meeting With Stakeholders + Business Goals
These were the takeaways I got from speaking to stakeholders:
The widget design needs to be modernized. Currently it appears old and outdated, and that the design hasn't been updated in about 5-8 years.
The photos need to become more of a focal point since they're such an important part of a listing for agents.
There should a clear divide between clicking for more information and simple scrolling between properties.
It needs to be built in a way so we could personalize it for each companies needs. At the very least it needs to be able to have font families and colors changed easily so it's easier to sell.
Strategy + Execution
I did both client and competitor research. Afterwards, I felt confident in coming to a clear solution on how to make the widget better. Here's what I did:
I went with a full-width photo to help attract more attention to the listings and really help sell the house visually.
I kept the same features and established some clear hierarchy in the information, making the location and price stand out a lot more.
I got rid of the excess grey since it wasn't helping the design. Instead I got bolder with the color and text differences, while maintaining a clean modern look that could be customized with CSS.
Below are the 3 designs that I made. I landed on Option 1 as the strongest.