Staged by Stephanie is a business website connecting home sellers, home owners, and realtors with a one stop shop for home staging, home design, & other home services.

I was tasked with identifying the main usability issues within the site, designing a new way to organize information within the site, and implementing a consistent style guide.

Role & Responsibilities

UX Designer
UX Research
Visual Design

July 2021 | three weeks

the problem

Home sellers and homeowners need to find services that are tailored to their needs. StagedbyStephanie provides just that, however, her current website currently has some usability issues which is making the process of viewing services and contacting the business difficult for the user.

the solution

A complete redesign of the website that streamlines important information to our users, establishes business credibility, and implements a more consistent design pattern across the whole site.

see final design see process

starting the design process ~


research |

In order to identify the key pain points users were facing with the website, I conducted user research to gain insights from how our users were feeling navigating through the web experience and identified the main challenges they were facing.

Using the original website, IΒ conducted a usability test with 5 participants to discover the main usability issues.

πŸ‘€πŸ‘€πŸ‘€πŸ‘€ | four out of five users could not find Stephanie's home design portfolio
πŸ‘€πŸ‘€πŸ‘€πŸ‘€ | four out of five users did not like the inconsistent font style, size, and formatting
πŸ‘€πŸ‘€πŸ‘€πŸ‘€πŸ‘€ | five out of five users mentioned an overwhelming amount of information
πŸ‘€πŸ‘€πŸ‘€πŸ‘€πŸ‘€ | five out of five users mentioned the navigation bar was confusing

The most common key pain points I identified through conducting user research further assured my predicted assumptions of challenges users were facing while navigating through the website.

key pain points |

πŸ‘‰ Overwhelming amount of information
πŸ‘‰ Inconsistent design across website
causes confusion
πŸ‘‰ Information scattered across the website
πŸ‘‰ Portfolio is hard to access

key insights |

πŸ‘‰ Users want access to the most important
information Β (i.e. services, portfolio, contact
information, about, testimonials)
πŸ‘‰ Users want to view credentials in order to
establish SBS as credible

usability testing with original website |

discovering pain points |

πŸ‘‰ Information overload: Overwhelming amount of information on landing page makes navigating the website difficult for users.

πŸ‘‰ Inconsistent design: Different typefaces, font size, font style, and formatting make the website confusing to users.

πŸ‘‰ Unclear user flow: Information is scattered across the website and user's don't know where to begin.

πŸ‘‰ Hard to access: Users want access to the most important information first i.e. services, portfolios, testimonials, contact, about, without having to navigate to different pages


challenges &Β how might we's |

Based on my initial user research, I identified key challenges that our users were facing and identified the following problem statements:

πŸ‘‰ How might we connect users to the right information?
πŸ‘‰ How might we organize the information architecture in order to simplify the user journey?
πŸ‘‰ How might we establish business credibility in order to gain user's trust?
πŸ‘‰ How might we create a concise and consistent visual style throughout the website?

meeting user needs and business goals |

Before starting to brainstorm solutions to the problems users were facing, I listed out user needs with business goals to see where the align and how IΒ can adjust my design process going forward in order to ensure both sides were met.

✨ With the challenges for this project, user needs and business goals identified, I was ready to start brainstorming solutions considering end users throughout the entire process.


wireframes |

My initial wireframes helped me to brainstorm possible solutions and visualize how the layout of the new website would look like taking into account the most important features our users wanted to see.

I considered the following key changes:

✨ A streamlined navigation bar to showcase most important tabs
✨ Establishing business credibility to users in order to gain trust from clients
✨ Consistent formatting throughout the website

the new flow |

One of the key pain points users identified was an overwhelming amount of information being thrown at them once they landed on the website. This made navigating through the website confusing to the user as they did not understand where they were located within the site itself.

✨ A new streamlined navigation bar helps to organize the most important information that our users are looking for.

original information architecture

πŸ‘‰ The original information architecture had too many tabs that weren't useful to the user
πŸ‘‰The original tabs used different words such as "packages" and "services" that users did not understand
πŸ‘‰The original navigation bar had separate pages set for SBS's design portfolios which made finding them difficult for the user

new information architecture

✨ The new navigation bar included all three services underneath one "Services" tab
✨ The new information architecture displayed the most important tabs to our users based on user research
✨ The new navigation bar separated "About" and "Contact" to create more streamlined pages within the website

establishing credibility |

Establishing business credibility was important to both the user and the business, as the business wanted to gain trust from their clients, and the users wanted assurance in the services they were seeking.

✨ By including testimonials and credentials in the same area, the user can navigate to a section of the website where business credibility is established and where users start to gain trust with the business.


low-fi prototype & usability testing |

After sketching out wireframes, I decided to create a low fidelity prototype to test out my solutions and test for usability before continuing the rest of the design process and moving on to the visuals for the final prototype.

✨ Focusing on the usability of the underlying UX was key to establishing what worked and what areas needed improvement.

πŸ‘€πŸ‘€πŸ‘€πŸ‘€πŸ‘€ | five out of five users could find SBS's different design portfolios βœ…
πŸ‘€πŸ‘€πŸ‘€πŸ‘€πŸ‘€ | five out of five users could find where to contact SBS βœ…
πŸ‘€πŸ‘€πŸ‘€πŸ‘€ πŸ‘€ | five out of five users mentioned the website being more organized βœ…
πŸ‘€πŸ‘€πŸ‘€πŸ‘€πŸ‘€ | five out of five users mentioned the navigation bar more clear βœ…

After creating my prototype from low fidelity wireframes, I put together a survey and conducted a new usability test with the same five participants asking them to perform a series of tasks. I had hoped to gain enough feedback to take into account in my next iteration of designs.

user feedback |

✨ Intuitive navigation: New straightforward navigation bar showcased most important tabs users wanted to see first.

✨ Organized content: New information architecture made content more organize for the user to navigate through.

✨ Testimonials: A testimonial page serves as a platform to show users how others have benefitted from SBS services and establishes trust.
✨ Consistent design: A new style guide created a cohesive look across the website and pleased users aesthetically.

iterations based on user feedback |

✨ Although the results from my usability test using a low-fidelity prototype brought in some positive feedback, it also showcased areas for improvement within my original design that users wanted to see implemented.

final prototype |

After taking into account the user feedback from my second round of usability testing, I created a final prototype that included my iteration of design changes. This is what the new home staging and design website experience is now.


I conducted a third round of usability testing with 5 participants asking them to perform yet another series of tasks within the high-fidelity prototype in order to validate my design solutions and test for any pain points users would face with the new website redesign.

✨ Testing again, and again, and again, is key to the design process and validating design solutions. This also ensures that the design process stays user-centered and empathetic.

key insights and measuring success |

Although this was a self-developed project, there was still ways to measure success within the new design solution.

what I learned |

This was my first end-to-end UX case study. I learned a lot from this experience (a lot) but some important ones I'd like to highlight are;

✨ how important it is to understand your users by conducting research before brainstorming solutions
✨ how consistent testing and iterations are key for validating a design solution
✨ how the design process really works in practice

& there is always room for improvement! Although this was a self-guided project and my firs time redesigning an existing website, there is still so much that could be improved upon. For the sake of time IΒ decided to focus on the major issues users were facing first and making the website usable. Some next steps I would consider is how to implement educational information the business wants to share with users and how to rewrite content information to improve the UX writing.

back to top
designed & built with <3
andrea maritza romero Β© 2021 all rights reserved