EBY Interior Website Re-design

UX Case Study — Client Project 2018 June

Eric Li

6 min readJul 3, 2018

SihongDesign@Gmail.com

Scope of Project

Business Perspective

Website re-design to increase sales & appeal to the millennial audience.

Client Perspective

Display company‘s service, ethics & value.

Users’ Perspective

Inquire services from the website.

Survey & Interviews

After identifying the project goals, soon I surveyed millennial homeowners and reached out to customers who have hired EBY Interior for renovations in the past.

Only about 50% of the survey answers were from millennials, therefore my research is mainly build-up by the client’s past customers’ interview feedback.

The goal of the research

Identifying customer’s value
Motive on hiring EBY Interior (or other company)

Main Findings

Bang for the buck, quality, and value-driven
Hired EBY Interior/other company from referrals (trust factor)
EBY Interior is the most affordable renovation company in Vancouver

Affinity Diagram

Conducting all the survey & interview feedbacks onto an Affinity Diagram. I migrate all my research results in sticky notes and create categories for a similar pile to determine customer value.

Information Hierarchy

Here is the result of the number of feedbacks —

1.Type of service being offered

2.Trust building content

3.Price inquiry

4.Contact for an appointment.

User Persona

After understanding the customers’ interests, summing up my research with a User Persona to let the Client understand my design decision better.

Analysis of the Problem

Since I am re-designing www.ebyinteriors.com. I need to understand the website’s current problems. These are the feedbacks based on users.

Website testing summary.

Misleading imagery on the homepage.
Super text-heavy & not visionary appealing.
Looks suspicious (Lack of trust).
The contact form is too ambiguous.
Cannot find the services(Users do not know the terminology).

Feature Prioritization

I came up with lists of features based on each pain point. The “Must Have” will be the MVP(minimal viable product), meaning what is needed for a website to be functional, and…

To fulfill both the client’s business goal & the users’ goals.

Information Architecture Card Sort

I invited millennial homeowners as tester users (based on our persona) to card sort each of the features above.

(All the cards are labelled with names of features, tester users are asked to sort them into categories and title each category. )

←Here are the result

The website will have 3 pages

Homepage (Trust Building)

Let users acknowledge the purpose of the website, and be convinced to explore for the services needed.

Services

Let users find the services needed with zero renovation knowledge needed.

Projects

Showcasing past experiences for building trust.

Designing Features

Based on our research, a lot of people were unable to name specific renovation services due to the lack of knowledge in this field.

I created an interactive floor plan, users can navigate through the floor plan based on locations needed services, to check the availability of the service.

I also re-designed the contact form and named it “Get a Quote”.

The form has specific leading questions that allows users to have better communication with the renovation team.

Paper Prototype

Optimal Solution

Versions and versions of the paper prototype created, (quantity > quality )to test the functionality of the Information Architecture, which is presented above in the planning phase.

Contact Form Testing Result

1st iteration of “Contact form”

“Get a quote” takes too many steps, questions were too personal, such as — address and postal code that the users were hesitant to provide.

Final iteration “Contact form”

Cut down questions that were unnecessary and too personal. Slimmer quote form but with enough info for the renovation team to make a decision.

Header Testing Result

← Before

Few users were confused by the wording of “Gallery”.

←After

Click to see the User Interface Design case study here

High-Fi Testing and Revisions

On the website version, projects have hover state when curser are on-top of the image.

Design Thinking Walk-through

Design Decisions

1. Mimicry — Properties that have common/similar elements, which users can easily resonance with and relate to understanding/navigate.

Orange is widely use in renovation related services.
Such as Home Depot , and many others..

2. Users don’t make optimal choices & don’t let users think

（…) users satisfice; they choose the first reasonable option. As soon as they find a link that seems like it might lead to the goal, there is a very good chance that it will be immediately clicked. （click to see source)

User’s end goal is to find the needed service and get a quote.
Having two of the most important Call To Action button displayed on the home page, and the ultimate end goal “Get A Quote” consistently on available on the header.

3. Quality Content — It is been proven that quality contents are more important than great designs, based on my suggestions EBY Interior agrees to hire a photographer to showcase their work & process.