Business Communication Tool: Web App UX/UI Design

Creating a web app of a business communication tool for small business owners that features a centralized inbox

Type

Web-based business communication tool (Centralized inbox, TeamChat, and Calls)

Capacity

In-House Full Time Senior Product Designer

Overview & My Role

Upon joining the team as a senior product designer during the design phase, I was tasked with leading the creation of a new business communication web app — from conception to production, including user research, usability testing, and prototyping. The project had a tight timeline for launch, so I worked closely with the CPO, product managers, architects, and developers to create the initial designs and succeeded in meeting the deadline. I also mentored a junior designer throughout the project.

Key Accomplishments

   •  Owned and led the entire design process from conception to final production
   •  Managed the entire UX/UI design & research processes
   •  Produced flow/interaction prototypes, all design mockups, design assets
      and design guidelines
   •  Provided mentorship to a junior product designer, both professionally and
      personally
   •  Redesigned the onboarding and sign-up/sign-in flows through data-driven
      design enhancements, resulting in a 20% to 43% boost in the conversion
      rate
and a 50% to 10% decrease in the drop-off rate
   •  SUS score for version 2.0 increased by 38.5% from version 1.0 (65.7 -> 91)

Result After Version 2.0 Release

Problem Statement

Pre-launch

The new "Command Center" project, a communication tool for small businesses, faced two major challenges in its early stages:

1. Limitations of the existing design system from a 3rd party company
2. Constraints on creative freedom due to the need to follow the design direction set by the previous designer in order to meet a tight launch deadline

Post-launch

Early user surveys highlighted issues with UI clarity and UX flow. To address this, I conducted multiple rounds of usability tests and user interviews via UserTesting.com and led a full redesign of the Command Center, including its core centralized inbox feature.

Design Explorations

Accept & Analyze

Kickoff Meeting

At the start of this project, I participated in a comprehensive kickoff meeting led by the CPO. I collaborated with key stakeholders, including product managers and cross-functional team members, to ensure alignment on project goals. Product managers provided background on the design status and constraints, given the tight deadline.

Discovery & Planning

Sprint Process Overview

In this initial session, we collectively discussed and analyzed:
   •  Necessity and functionality of proposed features,
   •  Prioritization of focus areas,
   •  Long-term goals, and
   •  Primary user journeys.

Despite the project already being in the design phase with a tight deadline, I quickly adapted to the constraints, understanding that flexibility would be limited for the initial launch. Accepting these conditions, I moved forward to accelerate the design work within the set framework.

User Testing Process

a) Planning

I oversaw all cycles of user testing, including planning, execution, analysis, and implementation of improvements. In each sprint, usability testing and user interviews were essential in assessing the readiness of features for launch. I also used RICE scoring to prioritize test ideas, and A/B tested to reposition essential info, simplify content. I ensured that QA was completed before usability testing, so our users could engage with fully functional features during their sessions.

Usability Test Design and Rationale

b) Execution

Moderating technique
  •  Concurrent think-aloud (CTA)
  •  Retrospective probing (RP)

UserTesting.com & Zoom (Multiple rounds with over 100 users)
Leveraged UserTesting.com and Zoom to gather feedback from over 100 small business owners, yielding critical insights for the redesign.

Metholodogy

Primary product metrics: Monthly Active Users
Top-line UX metrics: Ease of Use and Satisfaction Level

Usability testing : Tasks were based on core features to uncover bugs and gather direct behavioral insights and feedback from users. The data and results collected established a clear, measurable connection between UX improvements and business value.

User interview : To capture authentic user feedback on pain points, ideas for improvement, and overall impressions of the service, I conducted brief interviews with current users via Zoom. This approach allowed me to gain a broader perspective on their experiences and thoughts about the product -- beyond usability testing alone. The insights gathered from these sessions provided direction for a more user-centered redesign.

c) Analysis

Findings from User Testing
From behavioral data to ratings and user comments, insights from user testing were gathered and shared with the Product team to guide prioritization of action items for launch and for a high-quality user experience. Post-launch, I collaborated with cross-functional teams to monitor data logs and weekly user data from the Sales team to respond to emerging issues in real time.

Industry metric benchmark
After applying design improvements based on user test findings, the Command Center scored a good NPS (Net Promoter Score) at 46 (average score for the Saas industry was around+36 in 2023) and a SUS (System Usability Scale) score of 91 in the Excellent category rating (UI bugs fixed rate: 60/103=58.2%).

d) Amendments

Usability testing proves its value when insights lead to action. I prioritized addressing observed issues, ensuring that critical and high-severity problems were resolved and re-tested before launch -- within tight timelines.

Highlights from user testing analysis slide deck

Command Center Inbox Redesign
(Launch Version 2.0)

Following multiple rounds of user testing, I analyzed the data and shared insights with the Product team. After iterating on design solutions, I held review meetings with the CPO, product managers, architects, and developers before finalizing the redesign. Key improvements included:

1. Modernized Layout
As part of the Design team's effort to replace the third-party designsystem that caused multiple design constraints, I took a big role in creating a custom design system that modernized the UI of Thryv's services.

2. WCAG/ADA Compliance Testing
Ensuring accessibility for users with disabilities, I redesigned UI elements (i.e. conversation balloons, etc.) to meet WCAG/ADA standards.

3. Refined Top Toolbar and Left Navigation Bar
I streamlined the user flow for accessing other centers/tools that Thryv offers by adding a waffle switcher to the top toolbar and introducing a collapsible left navigation bar.

4. New Feature for Enhanced UX
The Command Center’s centralized inbox lets users manage conversations across email, social, and SMS channels. Addressing users' pain points, I proposed and designed a “filtered conversations by channels” feature to improve navigation within the inbox.

Example of a prototype

Redesign Project Outcomes

The redesign project, backed by the CEO and stakeholders, exceeded expectations:

   •  SUS score improvement from 65.7 to 91
   •  47% reduction in time needed to switch between centers.
   •  24% increase in NPS score.
   •  User feedback highlighted an improved experience:
      💬  “The new layout is fantastic. This experience was much better than
              the previous [communication] process.”

Additionally, collaborating with the Marketing and PLG (Product-Led Growth) teams, I redesigned the onboarding and sign-up/sign-in flows through data-driven design enhancements, resulting in a 20% to 43% boost in the conversion rate and a 50% to 10% decrease in the drop-off rate.

What I Learned

1. Current Design Trends in Communication Tools
During the initial phases of this project, I conducted research on the latest design trends for business communication tools. The insight I gathered from the research enabled me to craft user-friendly and practical designs tailored to the needs of small business owners. While the project initially followed a strict CPO-driven direction due to a tight deadline, which resulted in a launch with limited UX focus, the user tests I conducted post-launch revealed key areas for improvement. The redesign that followed significantly increased user satisfaction, reinforcing the long-term value of a user-centric approach.

2. Value of Cross-Functional Collaboration
Consistent with my past experiences, collaboration across teams proved invaluable in achieving successful outcomes. Working closely with product managers, architects, and developers led to a more cohesive and refined final product, highlighting the importance of strong communication and alignment across functions.

3. Simple Solutions Can Be Powerful
Some of our most effective changes didn’t require heavy engineering work. Using the CMS to push updates quickly demonstrated the value of being scrappy and resourceful.

4. Data-Informed Decisions
Using RICE scoring to prioritize tests helped us focus on the highest-value opportunities. It reinforced how critical it is to align user insights with strategic goals.

This project reinforced my belief that prioritizing user needs ultimately benefits both the company and its users, creating products that are not only functional but also enjoyable to use.

Are you interested in learning more?

Thank you for reading. If you are interested in discussing my work in further detail, please get in touch with me at ryanjshin824@gmail.com.

Next Project →