top of page

SaaS Website Redesign & Expansion

Redesign Using
UX Strategy to Reduce Bounce Rate

As a UX designer at Expert Reputation, I had the opportunity to redesign their website with the goal of making it more accessible and modern. I created new pages to help expand their reach into new industries and developed an on-boarding system that they previously did not have.

Project Overview

Objective​

  • Redesign website to better communicated product’s value and benefits, incorporating design trends to make the website look modern "up-to-date."

  • Make the website accessible. 

  • Create new pages to expand to new industries and an on-boarding system that was previously done manually.

The Challenge

  • To match the current product design while also making sure the new redesigned product, which will be developed throughout 2023.

  • make the site unique and to stand out from competitors.

  • Creating new design system using their existing brand color.

 

Current Steps
Adjusting launched website to meet WCAG’s AA level compliance.

About Expert Reputation
Since 2011, Expert Reputation provides online reputation management softwares.

My Role 
Evelyn Brokering: Solo UX/UI Designer

Duration
2022 September - November

Business Solution Overview

Clarified product's value and emphasized CTA

Business Problem

  • The original website has a high bounce rate and a low sales conversion rate.

  • Not enough users are scheduling free demos.

  • The website is not accessible.

The Solution

  • Clarified information about the company and communicated the product’s value and benefits.

  • Emphasized the call-to-action buttons.

  • Made the text/font readable and accessible, passing WCAG's AAA color contrast guidelines.

VS

Users Solution Overview

Engage and educate users what solution they need for success

User Needs/Frustrations

  • Professionals who want to improve their online reputation struggle to find resources and tools to manage their reviews.

  • The website appears outdated and unappealing.

  • The navigation menu is disorganized, making it difficult to find information.

VS

The Solution

  • Recommend services for their industry and educate users.

  • Created a new style guide that helped communicate the brand attributes and made the website look modern and up-to-date.

  • Developed a new site map, restructuring the navigation menu and footer for simple navigation and a clear product directory.

Landing Page Solution Overview

Landing Page Before

Landing Page After

Introduced all 3 software by using a carousel

Trust/Value:
Average customer experiences

Trust/Value:

Highlighted important features

Trust:

Brought testimonials more to the front

Visual Hierarchy:

Made font bigger/bold for headers

Why value:

Educated users how it works and why it is important

New Industry Pages Solution Overview

Created three "how might we" statements to pinpoint user needs, and provided solutions to be implemented on each industry page.

HMW 1: How might we provide Eric with Review management advice/suggestions so he can get Good reviews/rating?

HMW 2: How might we provide Eric with a platform where he can see all reviews in one place so he can manage with Low effort?

HMW 3: How might we provide Eric generate more patient review so that he can get better online rating and visibilit?

Alternative Healthcare 

Healthcare Professionals

Industry characters that users can relate to

Trust: partners

HMW 1: Recommended Services for their industry 

Trust: Testimonials

HMW 2: Introduce Service; Review IQ

HMW 3: Introduce Service; Listing Manager

HMW 3: Introduce Service;

SurveyNow

HMW 1: Educate users

The Redesign Process

From the initial research through the final solution, getting feedback from the user was key to my process.

👇 Click on a process below to skip👇

1. Research & Analysis

  • Market Research

  • Site Audit

  • Competitive Analysis

2. Define

  • User Needs & Business Goals

  • Defining the Problem

  • User Persona

  • POV & HMW

3. Ideate

  • Ideation Board

  • Low-fidelity wireframes

  • Task/User Flow

  • Site Map

4. Design

  • UI Design

  • New Design System

  • High-Fidelity Wireframes


 

5. User Feedback
& Prototype

  • Usability Testing

  • Final Prototype


 

Research

Site Audit

Dissecting the original site

The site audit process allowed me to identify what was not working with the current website. One of the issues identified was that the website did not pass the scroll test, as there was too much unnecessary content that needed to be removed.

Audit for the landing page:

The Issue:

  • CTA does not have hover and active states 

Possible Solution:

  • Create 3 states: default, hover, and active (clicked)

  • Why? Using the hover state you can inform your users whether their mouse is over the link’s hit area or not

The Issue:

  • Center align text is harder to read 

Possible Solution:

  • Use left aligned text

The Issue:

  • Inconsistent corners

Possible Solution:

  • Use the same rounded corners

The Issue:

  • Font color against the background color is not accessible, does not pass AA and AAA required contrast

Possible Solution:

  • Change background or font color

The Issue:

  • The video does not have sound

  • The youtube icon is very hard to access

Possible Solution:

  • Make the audio work

  • Move social icons so it doesn't overlap with the messaging 

Market Research & Competitive Analysis

Ideating how to stand out from our competitors

I studied the top 5 competitors to understand information architecture and design trends for the market to create a framework for structuring Expert Reputation's website.

 

I found that most competitors had similar websites, with software introduction on the right and CTA on the left, similar to Expert Reputation's current website structure.

Competitors similar hero section:

I proposed a design solution to rotate all three of Expert Reputation's software offerings in the center of the website. This style is popular among SaaS companies in other markets, making it an effective way for ER to stand out in the review management market. It also highlights that Expert Reputation provides multiple softwares, not just one.

Hero Section Before

Hero Section After

Research

Define

User Needs & business goals

Identifying and prioritizing pain points

I met with the Business Development, marketing, and software Development team to understand the company's history, project needs, goals, and objectives for my research.

I learned that highlighting the benefits of the product and reducing the time required for customers to make a purchasing decision were most important for Expert Reputation.

User Needs:

  • Help finding resources and tools to manage their reviews

  • Education on the value of good reviews

  • Efficient management of online listings

Business Goals:

  • Maximize sign-ups

  • Increase scheduling of free demos

  • Increase website traffic

  • Increase email sign-ups

OVERALL GOAL:
Increase interest in review management for Healthcare, Alternative Healthcare, Automotive, and Home Services professionals.

Defining the Problem

Identifying and prioritizing pain points for users

I pinpointed three pain points the current website was facing through the site audit, market research, and understanding of the business goals and user needs.

Users are confused about which service to choose.


Professionals who want to improve their online reputation struggle to find the necessary resources and tools to manage their reviews and don't know how to do it.

Poor Navigation Menu

The navigation menu is not organized and it is difficult for users to find the information they need. Users become frustrated when buttons do not work as expected.

Design: Not Accessible & Outdated 


The website's overall design looks outdated, with bold dark colors and a lack of modern elements. Additionally, it is not accessible to all users.

Define

User Persona

Persona to help create the new industry pages

With my findings from the research, I created a user persona named "Dr. Eric" to better understand our target user. Understanding his goals and corresponding needs were key in developing this persona.

From Dr. Eric’s goals and needs, I created his point of view (POV). With his POV, I was able to identify how I can help Dr. Eric’s by creating a “how might we” statement.

Ideating the Solution

Ideation Board

Finding solutions to the “how might we’s”

From the three 'how might we' statements I previously created, I brainstormed solutions and researched competitors to see how they address these issues. I created an ideation board for each of the 'how might we' statements to organize my ideas, and made sure the 'how might we' statements were clearly answered on the industry pages.

Ideate

Healthcare Professionals

Industry characters that users can relate to

Trust: partners

HMW 1: Recommended Services for their industry 

Trust: Testimonials

HMW 2: Introduce Service; Review IQ

HMW 3: Introduce Service; Listing Manager

HMW 3: Introduce Service;

SurveyNow

HMW 1: Educate users

HMW 1: How might we provide Eric with Review management advice/suggestions so he can get Good reviews/rating?

HMW 2: How might we provide Eric with a platform where he can see all reviews in one place so he can manage with Low effort?

HMW 3: How might we provide Eric generate more patient review so that he can get better online rating and visibility?

New Site Map

Restructuring the site map

The problem:

  • Pages were not in the correct category.

  • Eight primary navigation menu. Some can be combined.

  • Pages that were 5 pages on the footer Navigation Menu that was not the primary navigation menu.

  • Sub-navigation menu needs improvement in design

The Solution:

  • Categorizing pages to be in the correct navigation.

  •  “Company” and “About Us” page became one page called  “About Us”

  • “Success Stories” and “Testimonials” page became one page called  “Testimonials”

  • Keep pricing page since the heat map showed it was most used 

  • Bring the 5 pages that was buried in the footer to the top.

I categorized the page to be in the correct category. I also looked at other SaaS companies and how they were addressing the navigation menu.

Navigation item "Services" Before

Navigation item "Services" After

Design

UI Design

New Style Guide

The existing style guide had very few elements, so I created a new one to follow. I met with the Marketing Director and developers to discuss the issues the current website was facing. I understood the branding goals and values to inform the UI design I should implement.

Current UI problem:

  • icons our outdated

  • too boxy

  • not consistent with shadows

  • overall not modern

  • looks dark

Brand Values:

  • Innovation

  • Impact

  • Integrity

  • Customer Success

  • Trust

Branding and Tone Goals:

  • Exciting

  • Approachable

  • Modern

Design

User Feedback & Prototype

User Feedback

Feedback from new industry target users

After creating the high-fidelity mockups, I conducted usability testing on the new industry page with five participants, who completed a round of three tasks.

Research goals:

To determine if the new industry page is appropriately targeted for the new target users.​

Research conclusion summary:

  • 100% of users said the stock photos were not offensive and appeared natural.

  • 100% of users had no trouble finding the information.

  • 100% of users found the "recommended services" feature to be very useful.

"We only know how to do our job and we are not experts on online review management, so getting advice on what services we need is very useful."  
- 52 year old, Home Service Industry  

User Feedback

Final Prototype

Primary Navigation

Landing Page Before

Landing Page After

Pricing Before

Pricing After

New "Industry" pages

Alternative Healthcare 

Healthcare Professionals

Home Services

Automotive

Next Steps

Post-launch analysis & KPI success metrics

The expert Reputation team and I are currently awaiting the results to determine the success of the redesign process. Once we receive the KPI metrics, we will conduct a post-launch analysis.

KPIs we will be looking at:

- Bounce rate

- Average time on task(how long a user completes to purchase)

-Task complete rate(Task success rate)

-Retention rate

-User Error rate

-Abandonment rate

Thank you for your time on reviewing my work on Expert Reputation Website Redesign!

bottom of page