P Street Realty

Category
UX/UI
Client
P Street Realty
Year
2021

Overview

P Street Realty has been in existence for 10 years. They have started moving in the direction of using social media to increase sales. Also, they are starting to do more small-scale events to increase their customer base and sell more real estate. I was contacted by this real estate firm through networking events and was asked to take on this project. They are looking to increase turnover from site visitors, simplify the website flow, and provide additional information regarding the home buying process to new users.

No items found.

Problem

P Street Realty lacked an online digital presence which significantly impacted the ability to gain customers from the web. Existing customers had a fragmented experience which consisted of a lack of content and limited information about the home buying process. In addition, once the users were on the existing site, they would not stay long and ended up abandoning the site. Because of the limited website, users were not able to learn about the realtor or the business as a whole. They were not able to sign up for the real estate events P Street was having and customers did not have a way to register or get confirmation of the events. 

Research

I began by developing a research plan to look at users' needs and expectations regarding the entirety of the home buying process and the P street website. I developed goals and objectives first to help guide my interview questions. In addition, I determined what additional research methodologies were needed and developed some criteria for finding research participants. Through developing some criteria for participants, it enabled me to narrow down the exact users I was trying to target.  I conducted secondary research and completed a competitive analysis to obtain additional knowledge of the digital presence with current realtors in Indianapolis. I wanted to look at what other competitors were doing well and the challenges they faced. When presenting this research process to the main stakeholder of P Street, he was very excited about the results and was able to also use these insights in other areas of his business. 

What We Learned

  • Users want a realtor that knows the neighborhoods they are interested in.
  • Users felt the home buying process was confusing and stressful.
  • Users want a realtor who is knowledgeable to understands the home buying process.

What We Did

  • We designed pages that explain the various neighborhoods in the city of Indianapolis and showed hot spots within those.  We also highlighted different events that could be joined in the various neighborhoods.
  • We developed a page that highlighted various learning events for new and experienced home buyers.
  • We added a meet the realtor section of the website so users could learn more about Jason.  In addition, he is easily accessible through attending P streets events and able to easily be contacted through the website.

Understanding our Users

Through the analysis of the user research, I was able to develop a user persona, customer journey map, and empathy map/storyboard. Jason was one of the users interviewed and was looking to buy his first home. I completed Jason's persona to help guide decisions moving forward in the design process.  It allowed me to always keep the users' needs top of mind. It was exciting to be reminded about how excited Jason was to buy his first home and I wanted to keep the excited emotion in mind in designing the site.  After the persona was designed, I began working on the customer journey map. This helped to frame Jason's home buying experience into a visual medium. This map was extremely popular with the main stakeholder of P street and allowed him to look at his customer experiences, emotions, and opportunities from a whole different perspective. It also helped to lay the foundation for the interactive design. As the last part of the initial research, I designed a combined empathy map and storyboard to better understand the users' pain points and challenges during the process. This allows us to see how Jason is able to “meet” the realtor from the site in a more personable way and also shows his excitement for buying his first home. 

Interaction Design

After gaining an in-depth understanding of our users, I was able to build out the site map. After looking at different options and synthesizing the user research, I organized the site into five main pages. The our story page would showcase the P Street staff and give users a chance to get to know them briefly.  This also would provide an overview of the realtor and owner of P street. The properties page would allow users to view properties from listings, as well as have certain Indianapolis neighborhoods feature. These neighborhood features allow users to get an up-close look at neighborhood hot spots and help choose which one is best for them. The Process page includes all things homebuying, so users can educate themselves on the processes. The events page allows users to attend one of the many live events P Street holds so they can get better acquainted with P Street and certain Indianapolis neighborhoods. Lastly, the contact us page allows users to connect with P street in whichever way they prefer best. To be certain the category structure of the site map was best for users, I conducted tree testing. I had users conduct three tasks to see if they went down the right path on the site. We looked at how they would look for a property in a specific neighborhood, where they would search for a new home, and where they would navigate to learn about first-time home buying experience. The results indicated that most users took the path we had predicted on the site. The tree test allowed me to solidify the site map pages.

Wireframes

After the site map and tree test were completed, I drew sketches based on the research. I then built out wire flows to develop a blueprint of the responsive website to present to the shareholders.This allowed them to get a basic idea of what the website would look like and gave them an opportunity to discuss what they liked and didn't like. I learned through this process that stakeholders also have to be educated in design and usability principles to allow them to better understand the UX process and at the same time reaching our overall UX goals.

Brand Research & Visual Design

Once the wire flows were completed, it was time to begin developing a brand identity for P Street Realty. We started with a blank slate as there was no existing brand identity. I began this process by meeting with the stakeholder and having a discussion about how he sees the P Street brand and what it stands for. We also looked at the deliverables presented up to this point. We then analyzed all of the information to develop a brand story, purpose, vision, mission, tone, and voice.  Once we developed the brand personality, we took the brand adjectives and designed a mood board based on the information we gathered as well as some of the stakeholder's personal preferences.  Through this process, I had to continue to educate the stakeholder on color theory, and the importance of our user research to guide our decision-making. Once he understood that process, he was very receptive to ideas that fit into the brand more seamlessly. We were able to decide on the best colors, typography, and UI elements needed to fit the brand personality. I then began designing the logo. I started by taking some of the ideas from the stakeholder and the research and sketched them out on paper. Once I found a few I liked, I begin to digitize them and continue to iterate on those designs. I came up with a few options and the stakeholder ultimately chose the one he liked the most. Once this was all completed, I develop a style tile/UI kit to visually display all of the visual design elements.

Usability Testing

Once the prototype was completed, I began usability testing. I developed the usability testing plan, where I developed testing goals and objectives. I completed the usability testing with 5 participants using both zoom and in-person methods. Two participants had already purchased a home through P Street Realty and the other three purchased homes elsewhere or were currently in the home buying process. The participants were given three scenarios to complete using the prototype.    


  • Scenario 1- You are searching for a new home in the Indianapolis, Indiana area. You want to contact the realtor from a liked listing you searched for. 
  • Scenario 2- You have never owned a home before and your apartment is just too small. You are considering buying a home. You are looking to attend some real estate events to learn more about the process. You also want to register for the event. 
  • Scenario 3- After searching for listings in the Indianapolis area, you want to filter results with a minimum of 100k.


Participants also gave additional input on the homepage, listings page, and the neighborhood page.  All participants were able to complete the testing. An affinity map was developed to analyze the results of the usability testing. These responses led me to develop actionable solutions to the areas the participants struggled with.

Final Iterations

Lessons Learned

I truly enjoyed working with the client and he was very happy with the outcome. The client was reluctant at first however, once we went through the process he gained valuable insights into customers' wants and needs. He was then able to understand the true value of user research in designing a website. In addition, due to the impact of this work, the client has referred me to a friend of his to complete responsive websites for some of his businesses. I learned that it is very valuable to provide education to the client regarding the UX process and the importance of research in the final outcome. Furthermore, it can give stakeholders additional insights regarding their business goals. This project was handed off to the stakeholders' developer for completion. 

Other Projects
selected work
No items found.

Pride Places

Pride Places

UX/UI
No items found.

Contrak

Contrak

UX/UI
No items found.

Duolingo

Duolingo

UX