Van Wyck & Porter

Project Scope

  • Overview

  • Research

  • UX Vision

  • Sketches/Wireframes

  • User Testing

  • Prototype

  • Usability Testing

  • Results


3 Weeks

My Role

- Project Lead  - UX/UI Design - 

- User Research - 


Van Wyck & Porter (VW&P) redesigned their website a few years ago(2015) to reflect the more modern look and feel of the company and it’s owners. The redesign included a new logo and color scheme. These were then implemented into the new website design. The website does reflect as a “hip” company upon first view of their site. The problem arises when you begin to look at the functionality and content of the site. The site does not reflect the needs of their users and the important information that users will be coming to the site for is not easily accessible.


Defining the UX Problem

  • What route are users going through to reach the VW&P site?

  • Why are users coming to VW&P?

  • What are they looking for when they come to the site?

  • What are users emotions and feelings when looking at real estate sites?

The Process

- Use research to find most important aspects of a real estate website and bring the necessary information to the forefront of the website.

- Make the website easier to navigate and more intuitive for first time users.

- Understand the feelings of users in order to provide the right experience for them.

- Give off the modern feel and look that defines VW&P.

IMG_7339 2.jpg


A stakeholder interview with the two owners of the company and the marketing manager helped us understand more about their place in the real estate industry and where they plan on developing in the future. It helped us figure out what type of user they were trying to target and how to focus our user research. 

Site Analysis

The next step was performing a site analysis on the existing site. It was very important for us to know the VW&P website thoroughly so we knew what mistakes not to make in the redesign and understand what elements were working for them.


Heuristic Site Analysis

  • The homepage does not clearly state they are a real estate company or outline the key services of VW&P.

  • Much of the homepage content is either unnecessary or out of order.

  • The white bar below the navigation bar is nearly impossible to see and is sometimes inaccurate depending the page.

  • The properties page only shows featured properties and the sold properties can only be reached through the properties dropdown menu.

  • A few of the items on the homepage dropdown take you to a different page other than the homepage.

  • Image sizes: Many of the photos including, headers, properties, and team members are too large.

  • Blog is listed in the navigation bar but the page is still under construction when clicked on.

heuristic image.png

System Usability Scale

In order to understand the problems with the current and site and give us the ability to measure success post-redesign we performed a standardized test that classifies ease of use of a website. 

We asked the users to attempt three tasks starting from the homepage:

  • Find a VW&P real estate agent

  • Find the address of a property

  • Contact a real estate agent

The user then completed a system usability scale (SUS) based on their whole experience. This produced a score between 0-100. An average score is 68. 

initial sus graphs.png

Current VW&P Website



Our first step was to put out a screener survey to gather some general information as well as identify candidates to interview further. We received over 60 responses and were able to gain some valuable insights. 


Survey Results:

  • 67% of respondents found their agent by word of mouth/referral

  • Next highest response was services like Zillow or Redfin

  • 82% of respondents used a mobile device

  • Most popular apps are Zillow and Redfin


User Interviews

From the survey, we identified 9 candidates to interview. 5 individuals and 2 couples. All interviewees had either bought or sold a home in the past.

The interview focused on the home buying process, important attributes in a realtor/company, and major pain points.

To analyze the large amount of feedback we collected we made an affinity diagram. Through this process, we were able to identify some major themes, key words and pain points. 


Research Takeaways

  • There are a range of emotions involved in the buying/selling process;

    • Scared/Excited

    • Happy/Nervous

  • It is one of the biggest decisions in a person's life.

  • The process is very complicated. You put your trust in the people working for you.

  • Referred to realtor by family member or friend.

  • Use Zillow and/or Redfin to search for homes.

Paint Points

  • Unsure of what to expect during the process

  • The Seattle Market; bidding and losing, competition, compromising.

  • No knowledge of local area.

  • Trusting your realtor and feeling confident that they are looking out for your best interest.

Infographic of Main Themes

Primary Persona

UX Vision/Goals

Emphasize the most important features and services of Van Wyck & Porter in a website that is functional, reliable, and usable for all users. Convey a message of trust and experience while also giving off the modern, contemporary feel that sets them apart from many other companies


Keys to achieving this vision:

  • Bring forth experience in the Seattle market

  • Make sure services are clearly defined

  • Make the important information readily available and easy to find

  • Have many “call to action” buttons

  • Make it easier to navigate and see where you are at on the site

  • Convey a feeling of honesty, trust and experience.

  • After achieving functionality, reliability, and usability make sure the site conveys the contemporary and modern feel that VW&P is striving for.



Information Architecture

Addressing hierarchy, the addition or removal of pages and site mapping was the first priority. Once it was reorganized we could base the rest of our design decisions on it. 

Current Site Map

Revised Site Map

  • Added an Agents page to easily view the agents and contact them

  • Added an Acquisitions page to more thoroughly discuss that service and generate leads

  • Removed homepage dropdown menu.

  • Combined items in the About Us dropdown menu

  • Removed Blog until content is available.


Re-designing the navigation bar was very important. On the original site it was nearly impossible to see where you were at within the site. In our redesign, we used the brand’s orange color to make a very visible line to indicate which page you are on. We also surrounded the contact button in an orange box to make it highly visible to the users. 

nav bar designs 1.png


The homepage was our biggest design challenge and most important page on the site. It sets the tone for how the user will interact with and view the rest of the site. I took on the job of designing a homepage that would connect with users and highlight the most important aspects of Van Wyck & Porter

The goal of the new homepage is to make it instantly clear what VW&P does, make communication easy, highlight their experience, focus on the most important services and project a feeling of trust and knowledge. 

  • A bold branding statement welcomes the user accompanied with a "Contact Us" button to encourage interaction.

  • The sales infographic is a great example of their long and successful history in the Seattle market.

  • Traditional buy/sell, land acquisitions, and connecting with an agent are the most important services to highlight.

homepage key features 5.png

New Pages

Van Wyck & Porter were not giving any attention to some of their most important services. We created a few new pages so that these important services could be highly visible to their users. 

agent page w: highlights 2.png


Land acquisitions make up the biggest portion of VW&P's business. Much of this business is done by cold-calling and connecting with builders. We thought this was still an important part of the business to highlight. It is another example of VW&P's experience in the Seattle market and their partnerships in the industry. It also serves as a place for potential sellers to learn more about this process and how it may benefit them. 

  • 3 main benefits are highlighted and explained.

  • Call-to-action is highly visible.

  • Builders section exemplifies


Our research showed how personal choosing a real estate agent is. You are putting your trust in someone who is going to guide you through one of the most important decisions in your life. For this reason, we wanted to make the agents very visible and give the user a chance to get to know them. 

  • "Agents" is now the first choice in the nav bar.

  • Large photos give a personal feel.

  • Contact info is right up front.

  • Learn more allows the user to read a bio and contact an agent.

acquisitions final 2.png


User testing throughout the design process informed and validated many of the design choices we made. After multiple iterations, we felt that we had a high-fidelity prototype that could be used to perform a post-redesign system usability scale test. This would give us quantitative data on whether or not the redesign improved the usability of the system. 

System Usability Scale (Post)

We asked user's to perform the same set of three tasks:

  • Find a VW&P real estate agent

  • Find the address of a property

  • Contact a real estate agent

The user then completed a system usability scale (SUS) based on their whole experience.

sus results.png



The system usability scale is only one way of measuring success but based on our UX goals we achieved success by greatly improving the sites scores when trying to complete the main tasks. I feel that we made a huge impact on the usability, functionality and learnability of the site while also reflecting the modern look and feel that sets VW&P apart from most other real estate companies. 

Upon implementation the main ways we can measure success will be increased time on site and increased contact from users. Ideally, the site would generate more traffic but there are many factors that are out of our control that affect overall traffic to the site. In our presentation to the client, we recommended search engine optimization and Google Adwords. Prior to the redesign, our client was not considering these options because their site was not reliable and not a good representation of their business.

Our redesign can make Van Wyck & Porter feel confident about the image they are giving off to their clients. Their services are clearly defined and up front, contacting them is simple, and their experience and trustworthiness are reflected throughout the whole site. The new version of the site is optimized for the user which will accomplish the business goals.