OSST Service App and Web Platform

Build a bridge for connection between clients and professionals, ensuring a smooth partnership.

Tımelıne

Nov.1st, 2023 - Jan.1st, 2024

status

Estimated launched time: July, 2024

Client

OSST

Our team

Design Director | Lawerence Tang

Project Manager | Qiqi Dong

Ux Designer | Suri Wang

Ux Designer | Coco Fan

Ux Designer | Yifan Jiang

Other team

Developers

Product Manager

Operation Director


OVERVIEW


Background:

In the UK, finding the right professional for home renovations can be a daunting task for homeowners, and similarly, skilled tradespeople find it challenging to reach potential clients. OSST, an innovative startup, addressed this issue by launching an app and website that facilitate seamless connections. This platform links homeowners with over 3 million skilled professionals across the UK, streamlining the search and communication for both parties.

Problem:

Finding suitable professionals across multiple platforms can be a cumbersome process, and maintaining effective communication during collaborations is often inconvenient. This results in frustrating and unsatisfactory experiences for both clients and professionals.

The Goal:

Our objective is to expedite and simplify the process of matching individuals with the ideal professionals, ensuring seamless communication throughout the service. This leads to users effortlessly completing renovations with expert assistance.

Target Users:


People looking for professionals for renovations

Professional trades

CLIENT DESIGN SOLUTIONS OVERVIEW

Quick Professional Finder

This feature offers an easily navigable layout, allowing users to quickly pinpoint and select suitable professionals via a user-friendly filtering system.

This feature offers an easily navigable layout, allowing users to quickly pinpoint and select suitable professionals via a user-friendly filtering system.

Messaging System

This system facilitates real-time interactions between customers and professionals, highlighted by live online statuses next to user avatars. It also allows for bookmarking important conversations, ensuring easy retrieval at any time.

This system facilitates real-time interactions between customers and professionals, highlighted by live online statuses next to user avatars. It also allows for bookmarking important conversations, ensuring easy retrieval at any time.

PROFESSIONAL DESIGN SOLUTIONS OVERVIEW

Client Message Management

This web-based platform empowers professionals to effectively manage a broad spectrum of client communications seamlessly and in real time.

This web-based platform empowers professionals to effectively manage a broad spectrum of client communications seamlessly and in real time.

So, how did I get there?

Before embarking on the design of OSST, a brand-new website, it's crucial to analyze the operations of our peers in the UK within this sector.

Raise Questions

  1. What features are currently available from competitors in the market?

  2. By analyzing user feedback, what strengths and weaknesses have been identified in their offerings?

The research team supplied insights on five direct competitors: Checkatrade, Myjobquote, Rated People, TrustATrader, and MyBuilder, alongside one indirect competitor, Houzz. I have compiled a comparative chart summarizing their features related to professional outreach.


What I got from these competitors

PROS:

Each platform provides access to a wide variety of professional types.

Every professional features a detailed personal information profile.

CROS:

The majority of these companies do not provide a real-time chat feature.

Only a few companies lack search filtering capabilities.

Raise Questions

  1. Without live chat, what alternative methods do clients use to contact professionals?

  2. Given the availability of filters, a broad range of professionals, and comprehensive introductions, why do users still face challenges in finding the right professionals?

With these questions in focus, I delved into the survey and interview data for a more thorough analysis.

100 clients in the UK seeking convenient, efficient, and stylish renovation and design services.

80% seek a simpler, more direct way to convey needs to professionals for tailored design solutions.

50% report challenges in communicating with professionals on existing platforms.

70 professionals in the UK.

70% want a platform that helps users find them easily and streamlines communication, reducing potential client loss.

50% face communication delays that impede understanding client needs, affecting work efficiency and satisfaction.

The research team carried out interviews with five clients and five professionals to gain deeper insights into their requirements. The aim was to extract and highlight information critical to achieving our objectives.

Client

“We often find it challenging to navigate through the current platform to connect with professionals. We are renovating our home, and coordinating with various professionals has become tiresome and time-consuming. We need to post the jobs, then wait for replies. Sometimes one professional confirms availability for next Monday, but delays in responses from others result in the Monday slot being booked by someone else”

“In the UK, as professionals, we have too many customers to respond to, and sometimes calls from clients don't get through because the line is occupied by calls from several customers at the same time. We respond to emails in chronological order, which inevitably leads to inefficiency.”

Professional

I developed a journey map reflecting the current user experience to visualize the process and identify stages requiring enhancements.

Client's Journey Map

Professional's Journey Map

Key insights from research and journey map:

01. Finding professionals is inconvenient.

01. Finding professionals is inconvenient.

Due to users having to post job requests and complete questionnaires before waiting for responses from professionals, the process is time-consuming.

02. Limited Contact Options

02. Limited Contact Options

While these platforms offer email and phone contact methods, professionals may not always respond quickly to emails, and phone lines can be busy.

So, how might we facilitate a quick and convenient process for people to find suitable professionals and ensure smooth communication between them throughout the service?

STEP1: TURNING INSIGHTS INTO CONCEPTS


1.1 Approaches for Finding Professionals


Approach 1: Clients post a job, after which the system automatically matches a professional to them, utilizing the details provided by the clients.

Approach 2: Eliminate the 'post a job' feature, enabling clients to independently search for professionals using specific filters for a more tailored discovery process.(Selected)

Reason: The system's matching process sometimes fails to work properly, potentially requiring multiple attempts to achieve a successful match.

1.2 Approaches for Keeping Communicate


Approach 1: Facilitate real-time interactions by introducing live chat capabilities.(Selected)

Approach 2: Create a client portal for monitoring the professional's work progress and scheduling call times.

Reason: The project manager stated that OSST can only provide information on renovation companies; all tracking of the renovation process must be done independently. Users are unable to schedule appointments, track work progress, or make payments through OSST.

STEP2: DESIGN FLOWS


2.1 Initial two flows:

2.2 Iteration:

1

Inclusion of Decision Nodes:

  • Improvement: Boosts user autonomy and elevates the overall user experience.

  • Reason: Offers users the flexibility to navigate different choices at multiple points in their journey, like opting to check messages right after landing on the home screen, instead of diving straight into a search.

2

View All or Specific Categories:

  • Improvement: Enhances search efficiency and boosts the chances of connecting with the right professionals.

  • Reason: Gives users enhanced control and more precise filtering capabilities, enabling them to tailor the display of professional information to their specific requirements.


3

Save Functionality:

  • Improvement: Provides a tailored user experience by allowing easy tracking of preferred professionals.

  • Reason: Enables users to bookmark professionals they're interested in, simplifying future access and increasing convenience.

STEP3: TURNING FLOWS INTO WIREFRAMES & USABILITY TEST

To tackle identified pain points and enhance our service, we conducted user testing with 8 participants, split evenly between 4 men and 4 women. The following improvements were implemented in response to their feedback.

Iterate design 01

1

Add professionals’ details in recommendations and recently viewed.

6/8 participants felt that they didn't have enough information to make a decision on whether to choose this professional.

2

Change the display method of professionals' status.

4/8 participants expressed confusion regarding availability and were uncertain about what it means.

Iterate design 02

1

Add unread message feature.

7/8 participants felt they couldn't distinguish between read and unread messages.

2

Remove the vertical bar in the current chat

4/8 participants suggested removing the vertical bar, as in most cases, the front of the chat box is the current chat.

Iterate design 03

1

Add services tags:

6/8 participants believe that directly browsing the services offered is more convenient for finding the desired professionals than reading the about section.


2

Remove redundant message and phone icons:

4/8 participants feel that the repeated appearance of message and phone icons looks too cumbersome.

STEP4: STYLE GUIDE

STEP5: FINAL DESIGN


Select a role before signing up

Browsing professionals(Client)

Real-time chat(Professional)

Comprehensive Profile(Professional)

Final Iteration

In the final round of testing, we learned that for professionals, managing messages on mobile devices proves inconvenient. With a high volume of clients, it's easy for some messages to be missed. Our survey revealed that approximately 65% of professionals favor using the desktop version for easier management.

After submitting the final versions tailored for both clients and professionals

👨🏻‍💻

The Engineer Highlighted

The engineer pointed out that my layout is predominantly non-responsive, leading to several adverse outcomes:
1. Without a responsive design approach, developers might need to figure out how to adjust these designs for various devices independently, possibly augmenting the workload.
2. This situation could result in a final user experience that diverges from the designer's initial concept.

Ultimately, I ensured all layouts were made responsive and summarized my experiences as follows:

TAKEAWAY

Diving Deep into UX Research:

Think of competitor analysis not just as skimming through user reviews but as jumping into the website's world. We wear the user's shoes, click around, and snapshot every step. It's like being a digital detective, unearthing clues to make our site not just good but great.

Picking the Right Platforms:

Every user is a world of their own, with needs as varied as the stars. We don't just build; we listen, survey, and adapt. It's like crafting a bespoke suit—every stitch counts, saving us from the dreaded redesign.

Responsive Design: (The Game Changer)

In the digital arena, responsive design is the knight in shining armor. It's not just about looking good on any screen; it’s about opening doors to everyone, boosting your SEO knight, and keeping your coin purse full. For those crafting the web, it’s not just a skill but a superpower.


NEXT STEP

We remain committed to actively seeking feedback from front-end developers to balance user-friendliness with technical feasibility in our product designs. Following the upcoming launch of our product, we eagerly anticipate receiving feedback from a broad spectrum of users. This will enable us to refine and enhance design elements that may have been initially overlooked, ensuring our product not only meets but exceeds user expectations.

You've made it to the finish line... Curious for more? Dive into my other projects and discover what else I've been up to!

© 2024 by Coco Fan. All rights reserved.

© 2024 by Coco Fan. All rights reserved.

© 2024 by Coco Fan. All rights reserved.