Redesigning a Service Trading App: A UX Case Study
My 2nd client project as a UX Design student
To see the UX writing work I did for this design sprint, check out my UX writing case study here.
Introduction
The history of bartering goods and services dates back all the way to 6000 BC and it’s been around since then in some form or another. To this day, people all over the world choose to trade products and services for pure convenience, practicality, and affordability. One thing that’s changed, however, is that now we have the wonderful world of technology at our fingertips (literally).
twoPLUGS is an online platform that allows users to trade services locally amongst each other using an internal currency system — everything from dog walking to tutoring to gardening to haircutting. The company is a budding startup with goals to expand its existing user base throughout Canada and the US, eventually reaching a global market.
Project Brief
My team and I were tasked with optimizing twoPLUGS’ existing iOS app to make it more user-friendly and intuitive, in addition to giving it a visual refresh.
We were brought on to redesign twoPLUGS’ app after the launch of their first design suffered from several usability issues and bugs.
My Role, the Team, and Our Design Process
I primarily worked on the UX for the project alongside Lily Li, and the UI was tackled by Sahil Lungani and Celia Fidalgo.
As a UX designer on the project, I conducted research, created user personas, visualized the user’s journey, designed mid-fidelity wireframes, and tested the prototype.
Our 3-week design sprint consisted of 5 phases executed using agile methodology: 1) Research 2) Plan 3) Design 4) Test 5) Iterate
Research
Competitors
Like every design sprint, we began with research. Before diving into user research, we first conducted a competitive analysis to understand the current market landscape. We did our research in this order so that we could question users on their experiences with twoPLUGS’ competitors (if applicable), so as to help us find any gaps in experience that our redesigned product could fill.
twoPLUGS is not the first online service-trading platform. There are quite a few others that have the same idea: some cater only to specific types of services or only offer product-trading (indirect), while others cater to a variety of services or offer both services and products (direct). We evaluated each platform’s features, design, and brand tone, discovering two main factors that can be used to compare them: 1) Ease of use, and 2) trustworthiness. Below is a visual depiction of the competitive landscape.
After conducting a competitive analysis, it was clear that the key direct competitor here was Bunz — a platform for buying and selling products and services locally that uses its own cryptocurrency, BTZ. As a benchmark for ease of use and trustworthiness, Rover (indirect) really stood out with its super descriptive user-profiles and simple in-app navigation. Moving forward, this helped us generate ideas for how we could set twoPLUGS apart from its competitors.
Surveys and Interviews
To understand our users, we sent out surveys to the general public via Facebook, Instagram, Reddit, and our own personal networks. We collected a total of 50 survey responses and interviewed 5 participants who said they have — at some point in time — used an online platform (similar to twoPLUGS) to trade services with other users. The main things we needed to find out about these participants were:
- Their ages, occupations, and socioeconomic statuses (so as to get an understanding of who our target users are)
- Their preferred method of communication (to determine how users would like to communicate amongst each other to trade services)
- Issues or concerns they have with trading services with people they’ve met online
- Things that are important for them to consider when trading services with people they’ve met online
- Their likes and dislikes regarding service-trading platforms they’ve used in the past
Of the 42 participants who have used an online platform to trade services with other users:
- 83% were students in their early 20s
- 75% preferred to communicate via messaging apps rather than email and phone
- 100% valued trust, credibility, and safety when trading services online
Persona and User Stories
To compile and visualize our user research, we created an affinity diagram from our participants’ responses.
From this affinity diagram, we devised a persona and wrote accompanying user stories (see quotes below) that would represent twoPLUGS’ target user base.
“As a loving dog owner in University, I need someone I can trust to walk my precious fur ball while I’m in class so that I can have peace of mind knowing he’s safe.”
“As a cautious tech user, I want a secure way of electronically transferring money for products and services so that I don’t get ripped off.”
This persona and these user stories will guide us throughout our design process to ensure that we design for our target user’s specific goals and needs.
UX Audits
To understand the issues with twoPLUGS’ existing iOS app, we conducted 4 UX audits with participants who we considered to be twoPLUGS’ target users. Due to the time constraints of the project, our team focused on identifying the major pain points in two key flows: 1) Onboarding, and 2) Finding and buying a service. Below are the screen-by-screen flows from the existing app and the respective user journey maps we created to help us visualize the user’s feelings (positive, neutral, and negative) as they progress through both flows.
From these UX audits, we deduced the following main pain points that needed to be alleviated:
- The onboarding is too long and doesn’t explain well how the app works
- The app is confusing, unintuitive, and hard to navigate
- The app and the user profiles on it don’t seem trustworthy
Planning
After conducting extensive research, we dove into the planning stage of our design sprint. In order to create a successful online service-trading experience, we needed to:
- Simplify the app’s navigation and make it more intuitive
- Provide users with more information about the app, the services offered, and the users providing them
- Establish trust between users through transparency
Feature Prioritization
Before we jumped into designing any screens, we wanted to nail down the key features within the app that would meet the needs of our users. We brainstormed features and prioritized the most important ones.
User Flows
We then created user flows to help us visually map out and sequence the steps our users would take to create an account and profile, provide/sell a service to another user, and find and buy a service from another user.
Because our project was limited to only 3 weeks, we decided to focus on the design of two key user flows: 1) Onboarding, and 2) Finding and buying a service. The onboarding process explains what the app is, its benefits, and how the internal currency system works, after which users are prompted to create an account or login if they already have one. In our second user flow, users are able to browse through services by category or search for a specific service, message a user offering a service they’re interested in, and then strike a deal with that user to purchase the service.
Design
Low-Fis and Mid-Fis
Finally reaching the design stage of our project, my UX partner and I began designing low-fidelity wireframes and then converted them into mid-fidelity wireframes in Figma.
UI Design Direction
The UI designers on our team, Sahil and Celia, focused on the style direction for the app redesign. They wanted the app to evoke a fun and friendly mood with a modern and liberating — but also trustworthy — feel that would resonate with our young millennial users. They used blues and orange accents, along with sans-serif fonts to emulate twoPLUGS’ cool and trendy brand image. Blue is often associated with trust and loyalty, and orange is often associated with joy and happiness — these are all feelings we wanted to evoke in our users. Below is the inception sheet, mood board, and style tile used to direct the design of the high-fidelity wireframes.
Design Decisions and Features
Profile
In the app’s original design, the user profile page showed the following: photo, username, first and last name, gender, about, and city. Based on our persona and user stories, we know that our users have “trust issues” when it comes to dealing with strangers online (as they should — cybersafety is important):
User Story: “As a loving dog owner in University, I need someone I can trust to walk my precious fur ball while I’m in class so that I can have peace of mind knowing he’s safe.”
To make sure our users felt comfortable and safe doing business with people they don’t know, we had to make sure user profiles in the app contained enough transparent information so as to evoke trustworthiness and credibility. We added sections for age, social media links, and verification via phone number and/or government ID. We also added a star rating that is based on other users’ reviews as well as the date the user joined.
Wallet
twoPLUGS’ original system of buying and selling services was not a very secure one. Once a user purchased a service from another user, all it took was for the service provider to tap on one button confirming that they provided the service and the service receiver’s Eeds (internal currency) would be automatically transferred to the service provider. This is not a very safe system as people could easily confirm that they completed a service when in fact they did not. Going back to our persona and user stories, online safety and security are very important to our target demographic:
User Story: “As a cautious tech user, I want a secure way of electronically transferring money for products and services so that I don’t get ripped off.”
To ensure safety and security, we introduced a two-way transaction confirmation feature where both users have to confirm that the service was completed. On top of that, we also added confirmation modals, in case of any accidental finger slips. Once the service provider confirms they have completed the service, the service receiver confirms they have received the service. The VLTs (renamed internal currency) are then transferred from the buyer to the seller and the buyer is able to write a review of the service.
Testing
We tested our prototype on a total of 8 people — 4 of those people were the ones who we conducted our UX audits with, and the other 4 were people who we identified as our target users based on our user persona. We gave our testing participants 2 tasks:
The results from our testing showed that we needed to adjust the copy on the onboarding screens and fix the messaging feature.
For a high-level overview of the copywriting work I did for this project, check out my UX writing case study here.
Issue: Messaging
When given the 2nd task, our participants became confused once they tried to message the other user. Our 1st iteration only had the option to send a pre-written message, “Hi, I’m interested.”, which is something the participants were not used to. They also said they wanted more freedom when choosing what to message another user.
We fixed this by giving our users more freedom when sending the initial message to another user, while still keeping it simple and fairly effortless. We added a “Quick Messages” feature which allows the user to select 1 of 4 pre-written messages or type out their own message. The inspiration for this design decision came from Instagram story’s “Quick Reactions” feature.
Final Prototype
Our final prototype takes the user through the onboarding process to purchasing a dog walking service and confirming that it’s been completed. Check it out here!
Conclusion
Final Thoughts and Future Steps
This project was definitely a challenge but a very rewarding one. Three weeks was obviously not enough time to redesign all the screens for twoPLUGS’ iOS app, however, we believe that we tackled the project successfully. Our prototype met the needs of our user persona by being simple, trustworthy, informative, and intuitive. If given more time, we would love to explore the service seller’s user flow for selling a service to another user, as well as the flows for posting an offer and a need.
Some potential features that could set twoPLUGS apart from its competitors:
- Follow people whose services you use frequently
- Accumulate “badges” or “trophies” for being an avid user (e.g., quick responder)
- Notifications after some time has passed when no action has been taken (e.g., a reminder that a deal proposal is expiring)
Learnings
This project taught me that when it comes to design, sometimes the tried and true way is the best way. There’s never any harm in trying something new, however, typically when people are used to seeing a certain design pattern, they’re going to expect to see it in other products. So designing a feature that has rarely been seen before might not always be a good idea. The best way to find out is to test it.
If you thought this case study was neat, please give it a 👏! Check out more of my work at www.annaromanovskiy.com.
