A responsive website for an interior design company that provides a showcase of the designer’s work.
Danneale Bell Design
Role: Product Designer
Dates: August-September 2022 (65hrs)
Team: Amanda Walker
Tools: Figma, Whimsical, Maze, Google Meet, Zoom, Miro
Introduction
Danneale Bell Design is an interior design business founded in 2021 by Danneale Bell. The company is wanting to grow its customer base.
Problem
A website didn’t exist for DBD and so the company was only able to gain customers through word of mouth. Potential clients were unable to learn about DBD services, see past work and contact the designer easily.
Research
Competitive Analysis
First, I created a competitor analysis in order to learn about direct and non direct competitors in the industry. Researching other interior designers that Danneale looks at for inspiration, helped to get a sense of how competitors were structuring their sites and the overall aesthetic. Next, I developed some provisional personas. This assisted in starting to think about what types of potential clients would be visiting Danneale’s site.
User interviews
Participants:
3 phone interviews, female and male, ages 34-41
3 Google form surveys, anonymous
Goals & Needs:
Save time
Designer would provide a better plan
Work within the user’s budget & vision
Frustrations:
Assumption that service is expensive
A user could furnish their home themselves
Work could take longer than expected
Key Motivators:
ALL users thought home decorating was very important
Need to see past work
Transparent pricing
Testimonials
Email communication
User persona
Gathering insights from my interviews and other research, I developed a user persona. Meet Olivia!
-Olivia full-time career in marketing.
-She enjoys shopping for items for her home in her spare time and will watch some videos for inspiration.
-Due to the limited spare time she has, she is looking to hire an interior designer to furnish her home as long as it’s within her budget.
Define
Roadmap and Sitemap
For the next phase of the project, based to the feedback from my user interviews, I developed a roadmap of the necessary features for the DBD website and created a sitemap.
Task flows and User flows
Keeping Olivia in mind, I created a task flow where she could hire an interior designer to help furnish her living room. I also created a user flow in which Olivia arrives at the Danneale Bell Design homepage. I included the different paths she could take in order to learn about DBD’s past work and services in which she ultimately decides to contact Danneale.
Design
Sketches
Incorporating the user flow, first I sketched ideas for how the wireframes would look.
Wireframes
Next, I digitized the wireframes in Figma for desktop, tablet and mobile. I tested the wireframes and made some iterations after feedback. The below version shows the wireframe stage prior to applying UI elements.
UI Kit
The stakeholder provided a logo and font choices. I chose to have the photos remain the main source of color while keeping the rest of the color palette throughout the site neutral. Additionally, I created navigation bars and button and input fields with different states.
Prototyping
In preparation for usability testing, I implemented the elements from my UI kit and made adjustments to my wireframes based on the feedback from my initial testing, in order to create a mid-fidelity prototype.
Test
Usability Testing
Participants:
3 Google Meet/Zoom interviews, female, ages 34-64
4 Maze tests, anonymous
Objectives:
Test overall look and ease of use
Determine how users navigate the site to learn about Danneale
Test if users can successfully contact Danneale
Test if users can find where to log in to the project room
Observe any areas that the user finds difficult or frustrating
Goals & Needs:
Save time
Designer would provide a better plan
Work within the user’s budget & vision
Frustrations:
Assumption that service is expensive
A user could furnish their home themselves
Work could take longer than expected
Key Motivators:
ALL users thought home decorating was very important
Need to see past work
Transparent pricing
Testimonials
Email communication
Iterations
After gathering feedback from my usability testing, and making a priority list for revisions, I made these changes to my prototype:
Hero Problem
Multiple users expressed that when they saw the hero image on the landing page, they didn't know what the website was for or thought the image was a splash page, where you click on the logo to enter the site. To help the user, I added a "SEE MORE" scroll indicator, so they knew to continue to move down the page to see product images. I tested this added feature with a couple other users to ensure it was a beneficial change.
Photo Viewing Problem
Another issue I discovered was that users didn't realize you could click the arrow buttons on the pop up window in order to see additional images. Due to not being able to see a plethora of photos of past projects, users felt that DBD appeared to be a new business and a "work in progress." As a result, I changed the layout of the projects to a case study approach where users could gain more context and understanding of the few projects Danneale has currently worked on.
Project Link Location Issue
I tasked users with located the project room link for established clients. I had placed it initially on the contact page. All users were unable to find where the link was located. Upon review, because this feature was out of scope, I removed the link. However, if this is a feature I choose to add in the future, I will create a CTA button on the navigation bar for better accessibility.
CTA Button UI Problem
During testing, I received feedback that the CTA button wasn’t very prominent on the page. I decided to change it to black so it was more accessible for the user.Prototype
In conclusion
By listening and empathizing with users during this design process, I was able to create an intuitive, responsive website for Danneale Bell Design that will meet potential clients needs. They are able to see an in-depth overview of projects she has worked on. They can learn about Danneale and hear from past clients. The services she offers are transparent and include pricing information. Additionally, the website offers a seamless way for users to contact her. Danneale now has a user friendly tool to promote and grow her business and provides potential clients with the confidence to hire her.
I am excited for the next step of building and launching the website for Danneale so that she can share it with her clients.