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
Messaging System
PROFESSIONAL DESIGN SOLUTIONS OVERVIEW
Client Message Management
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
What features are currently available from competitors in the market?
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
Without live chat, what alternative methods do clients use to contact professionals?
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:
Due to users having to post job requests and complete questionnaires before waiting for responses from professionals, the process is time-consuming.
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
View Prototype
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!