Homes.com

Enabling users to seamlessly co-shop, communicate, and collaborate with a partner and an agent by allowing them to share interesting homes whilst removing friction during their search for a perfect home.

6+ Months

Lead Designer

00. Introduction

My initial project was to assist the other designers in establishing the foundation for the launch of Homes.com. After designing the design system and components, I was tasked with my first major project, collaboration. I would be taking entire ownership of the designs for this product feature, particularly Messaging and Notes.

Although daunting at first, I was excited to work on a product from the ground up alongside my product manager, along with the occasional design critique by my senior designer.

Our goal for these product features was to increase leads and increase user engagement - not only for consumers but also for agents. All of this was to be done in time for the National Association of Realtors(NAR) conference, where we would show off all the exciting new features to realtors. At the start of my collaboration projects, NAR was roughly 6 months away.

Our team worked in a 3-week sprint, in which I would work with my PM to establish design requirements, create visual designs, and handoff those designs to developers with documentation for behaviors of all interactions. Towards the end of development, I would keep in close contact with the developers and conduct extensive VQA, while ranking bugs based on priority, to ensure that all was good in time for NAR.

01. Focus Groups

At the start of this project, I was given a report based on month-long studies of the home-buying process conducted by our in-house UX research team.

The overall opinion on collaboration based on these findings can be defined by the following statement:

quotes icon

Collaboration functionality should focus on staying organized and communicating quickly and easily with agents and family, not friends.

02. Competitors

Upon analyzing direct competitors, I noticed that they were lacking critical collaborative features that would solve this issue.

Many other major sites, such as Zillow and Realtor.com, did not have any collaborative features integrated within them. Some enabled users to message only agents or share properties that they’re interested in with others via email.

Other sites such as Redfin.com and Compass allowed users to write comments on particular listings. However, Compass only allowed users to comment on properties with agents. Redfin, on the other hand, allowed users to connect with “Search Partners” and agents to view comments written on properties.

Our proposal was to separate these experiences into Messaging and Notes in order to encourage collaboration through every step of the home-buying process.

03. Messaging

The inbox is a place for people to share thoughts without the need to switch to an external app. It enables home-buyers to be in constant contact with whoever they want, be it their Co-Shopper, Agent, or even parents. It is also accessible through the inbox header and on any listing details page(as long as one is connected with an agent).

04. Notes

Notes grant users the ability to write down their thoughts about a property. Co-Shoppers are able to view each other’s notes along with their agent’s note that was specifically written for them. Agents, however, are not able to view their client’s notes as this was a privacy concern that participants in the focus group had.

For this feature, I had to consider the pages in which notes would lie. In contrast to messaging, notes are tied to a specific property, which is viewable on each Listing Details Page(LDP) and a notes page that contains all notes in a condensed view. I needed to figure out a way to bring a cohesive experience without disrupting users for each breakpoint for each page.

LISTING DETAILS PAGE (LDP)

For this page, I had to collaborate with the team responsible for the LDP to come up with a design that flows with the page while not taking up too much real estate. After many iterations, we landed on a clean design that flows cohesively with the other sections on that page.

NOTES PAGE

My goal was to create a page where users can view a condensed view of all notes that have been written by themselves or any of their other connected users. 

I experimented with the existing LDP notes designs to try to incorporate those same designs into the notes page. I attempted to link notes to a placard while showing as many notes in one viewport.

For mobile, the linking between placard and note proved to be not as clear as desktop. To better separate them, I added notes inside each placard.

VQA

After handoff to devs, I was tasked with conducting VQA for both features. The original method of handling VQA was to add to an excel sheet. However, the problem I faced was that some VQA items were only understandable through images, which weren’t easy to place into excel. To ease our process, I created a system within Figma which mimicked the excel sheet.

My process included divvying up the bugs based on priorities, along with a description and images, with the occasional redline to help pinpoint where exactly needed to be fixed.

This method proved to be quite fruitful, as it allowed me to quickly communicate problems with the devs with less need for clarification.

CONCLUSION

Looking back, I am incredibly proud of all I have done within the last half year. I experienced a high-pressure, start-up-esque environment to produce major features in a tight deadline. These projects, alongside other smaller ones, allowed me to gain a better understanding of what the corporate process is like by learning to communicate with various stakeholders for the product. 

For the future, I would love to obtain some metrics on user engagement and conduct user research to discover what was done well or could be done better. Although it is too early to see the impact of my contributions, you can test these features out on Homes.com. I’d love to hear any feedback, positive or negative, that you may have.

Home