Exclusive
Dry
Cleaners
App
ROLE
TYPE & TIMELINE
User research & analysis
Usability testing
Wireframing
Visual design & UI
Product Design
UI/UX
8 weeks
TOOLS USED
TEAM
Figma
Maze
Balsamiq
Roni Sherby
Meera Patel
Glen Chamberlain
Tania Kabanyana
PROJECT MANAGER APP | UI/UX DESIGN
PROJECT OVERVIEW
“Click it. Bag it. Dry cleaning delivered.”
Exclusive Dry Cleaners (EDC) is a Toronto based pickup and delivery dry cleaning service where clients put orders through the app or website, and schedule a time and place for pickup and delivery. Less than 5 minutes to order your Dry Cleaning and more, delivered straight to your home or office.
HOW WE GOT STARTED
We met with our client and gained clarity on the business model, goals, and user base, and we discussed the scope of the project. EDC would like to design an app that improves the usability of the company’s Android and iOS app and improve existing infrastructure. Some of the questions that came up:
-
What are the problems customers are currently facing when using the app?
-
How can we make the order checkout process quicker and more efficient for users?
-
How can we improve the look and feel of the app to appeal to a wider audience?
-
What infrastructure on the app is helpful to users, and what needs to change?
DELIVERY & SCOPE
Redesign and improvement of existing infrastructure of the iOS app; Update the front-end UX/UI of EDC’s current app to enhance users’ satisfaction, by creating products and interfaces that are intuitive, simple and efficient. By understanding users’ current problems and pain points we set out to:
-
Optimize the process of placing an order to make it as streamlined as possible
-
Refresh the app’s current user interface
-
Improve the app’s user experience by adding new features
-
Provide a high-fidelity interactive prototype using Figma that represents the full scope of the EDC app.
TARGET USERS
Professional individuals, working in a corporate setting, family person (with1-2 kids)
- Age: 35-45
- Comfortable using technology
- Our target user needs a quick, simple and straightforward solution
- Current frustrations & pain points:
- Our target user needs to be able to place an order from anywhere at any time, with quick turnaround times
- Users are not price sensitive, and want the best service regardless of price
Expected Outcomes
-
Streamlined and improved upon customer user flows and content throughout the app
-
Enhanced promotion/rewards system for VIP and corporate members
-
Enhanced and updated Personalized Coupon Code system for consistent users
-
Improved visual and aesthetic elements throughout the app
-
Implementation of “Driver Tracking” feature
-
Ability for users to purchase dry cleaning without creating an account
RESEARCH OVERVIEW
The goal of our research is to uncover and understand users’ current problems and pain points while using EDC’s app. The research phase will be conducted using the following methods:
-
Cognitive Walkthrough
-
Competitive and Market analysis
-
User Interviews
-
Usability Testing
COGNITIVE WALKTHROUGH
A cognitive walkthrough is a usability inspection process in which each task that can be performed in an interactive system is observed, and any problems are noted. This provides us with a deeper understanding of how users interact with the product. The walkthrough will help us determine what areas need to be reworked and the severity of each issue that arises.
Main findings:
-
Design: inconsistencies between Android and iOS versions - wording, design & layout
-
Login: no persistence on the log-in feature
-
Homepage: cluttered, no button hierarchy, no CTA to place order
-
Place an Order: cannot place order without credit card
-
Pricing: no categorization, no search tool
-
Promotions: No active promotions
-
My Account: no ability to add additional credit cards or addresses
COMPETITIVE ANALYSIS
A competitive analysis will allow us to determine the strengths and weaknesses of our client's competitors. As EDC exclusively offers its services in the Great Toronto area, we will research competitors who offer dry cleaning pickup and drop off services in the same region. Through this analysis, we will be able to see where we stand in relation to other players in the market. All of our client's competitors are relatively small businesses, the “Ma & Pa” type model, there is no one dominant player in the marketplace. We set out to find out what each competitor has to offer, their services, and notable features in their apps/websites.
Competitor 1 - Market positioning: environment friendly, family Owned, generous, affordable, accessible
Competitor 2 - Market positioning: well-established, luxury, best quality service
Competitor 3 - Market positioning: accessible, affordable, environmentally responsible
Competitor 4 - Market positioning: well-established, reliable, accessible, environmentally responsible
Our Client - Market positioning: Luxury, Convenient, Lifestyle; Offers varied services other than dry-cleaning only
USER INTERVIEWS
All interviews were conducted using Google Meet. Each interview was approximately 30 minutes in length and were audio recorded. Recordings were then digitally transcribed and the data was reviewed and thematically analysed.
USER 1
Management Consultant
Has stopped using EDC’s services because he has switched to another provider who offers a more convenient locker drop off service for his busy schedule.
USER 2
General Manager at a senior citizen home
Has been using the app for 10 months, puts in an order every 2 months on average.
USER 3
Young Professional working from home
Hasn’t used the app yet, but has placed a single order through EDC’s website.
USER 4
Operations Supervisor and Driver for EDC
Duties include: system backend, QA of company’s cars, training new drivers, QA of customer experience.
All users agreed that the services that EDC offer are very convenient and the app was pretty easy to use to place an order. All users switched to EDC from using a local brick & mortar shop. There were some areas in the app, however, they found to be more confusing than others.
OUR FINDINGS & KEY THEMES
Sign-in Options
Prefer additional login/sign up options such as Apple and Google
“...Google, or whatever login portal is connected”
1
Notification Preferences
Prefer to have the ability to customize their notification preferences
(text, email or phone popups)
“...prefer email as primary, text as secondary, but want both options for my orders”
2
Rewards Programs
Users would be inclined to use a reward/loyalty program if one were offered
“...I would be more likely to use the app if there was some sort of a reward program”
3
Navigation
Navigation through the app could be more intuitive
“...needs a better layout, better landing page...”
4
Pricing Page
It is not clear what some of the items are labelled as (ex: hand pressed, laundered shirts, etc. Pricing structure is also confusing, as the charges are different for shirts/polos/etc.
“...why are the prices for a shirt and polo different”
5
Order History Page
Lacks details on previous orders, users didn't know dates/items that were dry cleaned
“...the app doesn’t acknowledge the previous order I placed”
6
Delivery/Drop Off Times
Delivery times are spread out over the course of a day, making it difficult for some users with
busy schedules who cannot be home for pick-up/drop off
“...didn’t need to worry about coordinating to meet someone at the door”
7
USABILITY TESTING
In this usability test, we tested the main user flows of the EDC app with 5 users using a fixed script, and recorded the feedback expressed verbally or indicated by user actions. This is useful for finding what users consistently struggle with in the app.
LOOK & FEEL
New users generally thought the overall look, feel and behaviour of the app didn’t imply a polished and efficient user experience, and would hesitate to use it based on their first impressions:
-
Felt the main page had a cluttered feel and lacked a distinct hierarchy
-
Felt a lack of orientation throughout the app stemming from limited branding on individual pages
-
Felt the visual design and organization of the app could be improved
-
Found the aspect ratio on the emails they received regarding receipts and pick-up times/notifications made reading them uncomfortable
-
Found that they didn’t feel they could really get a sense of who EDC was from the app: they felt that knowing more about EDC would make them feel more comfortable in placing an order
USABILITY
Users found the main actions of the app navigable, but lacking some expected mobile app conventions:
-
Asterisks were present on the account creation page, but it wasn’t explicitly stated anywhere that an asterisk marked a required field
-
Users found the organization and presentation of the pricing page was confusing and difficult to navigate
-
The Promotions page being present without any active promotions frustrated users
-
Users found the Profile and Orders sections were frustrating to use, and lacked some of of the standards that they would expect from an ordering application
FINAL
FINDINGS
-
Improve Login & Sign Up
-
Improve User Profiles - form autofill, allow users to save multiple addresses & payment details
-
Improve ‘Place Order’ flow
-
Homepage: better navigation & CTA
-
Pricing page: easier navigation
-
Active Loyalty & Rewards Plans
-
Add notifications settings
-
Increase brand visibility on app
BUSINESS CANVAS
Once the research was conducted, the information we obtained was used to develop a value proposition canvas and a lean canvas. A value proposition was used to highlight the business services and how they lined up with customer wants. A lean canvas allowed us to focus on more specific interactions between the customer and the business. We were able to determine if the customer wants and pain points were being addressed with the services offered by the business.
VALUE PROPOSITION CANVAS
A user journey and site map were developed from the insights gained through conducting research. Following the user journey and site maps, we were able to quickly sketch some interface ideas. The sketches were a great way to quickly put ideas down on paper, and see how viable they were.
LEAN CANVAS
SKETCHING THE INTERFACE
LOW FIDELITY MOCKUPS
From the insights gained through conducting research, we were able to quickly sketch some interface ideas. The sketches were a great way to quickly put ideas down on paper, and see how viable they were.
Sign-in
About Us
Register
Forgot
Password
Home
Page
Place Order
Track Order
Help
My Account
My Plans
Pricing
Page
DESIGN CONCEPT & STYLE GUIDE
After presenting our sketches to the client, we proceeded to show him different design concepts - including colour, images, fonts. Below are the final colour palette and fonts we chose to implement in the final product.
Client Feedback:
-
A modern and clean colour palette consisting of a dark blue as the main colour, a white background, and gold colour for highlights and select buttons.
-
A navigation bar including 4 icons with the home, account, my orders and rewards pages. The icons shall be filled with a dark blue, and unlabeled, with the hanger graphic which acted as the navigation divider. The colour of the icon would change when it was selected and the hanger icon would move above the icon respectively
-
A personalized homepage which consisted of a call to action button, a personalized welcome message, and a background image.
-
Additional elements to be implemented were drop shadows on buttons and fonts.
HIGH-FIDELITY WIREFRAMES
VALIDATION & DESIGN ADJUSTMENTS
At the next phase, we implemented the feedback we received in our concept review with the client and insight drawn from our prior research to draft and prototype an early iteration of the final product. We then put the prototypes to the test with a round of usability testing.
USABILITY TESTING
Our usability testing aimed at testing real features of the app with users; This allowed us to find any usability or UI issues. Our users completed 8 tasks each, navigating through the app.
8 Tasks
4 Users
USABILITY TESTING INSIGHTS
-
Users expected to find more info on the business
-
Buttons that are orange look “deactivated”
-
Price Estimation tool was overall confusing, and not noticeable enough
-
Some pages look cluttered
-
Non-editable text should not be in boxes
“The orange needs to pop a little bit more because it makes the buttons and links look deactivated, looks too pastel and can be an issue for colour blindness.”
“I like the colour scheme, it is simple and clean. I think the pop of colour is nice. Blue and white only might feel like Facebook.”
“Tasks are mostly straightforward; harder to go through as a first time user. The app is legible, tidy, and clean; I like the use of the photo in the homepage.”
“UI is self explanatory, clean & smooth. 1st order was a little more confusing; the nav bar icons & rounded bubbles are a bit outdated; the colour scheme makes things legible.”
FINAL SOLUTION
REFLECTION
Try new things
Many a Figma tutorial was viewed, and learning new software Balsamiq. Every idea suggested was valued, although not all ideas made it into the final product.
Draw from insight gained in research
We learnt that research informs effective design decisions, and constantly referred back to our findings.
Strive for synergy - with the client and within the group
Synergy: the interaction or cooperation of two or more organizations, substances, or other agents to produce a combined effect greater than the sum of their separate effects.
Identify and utilize individual strengths
We found that this streamlined our work-flow, and enabled each team member to contribute their best efforts to the project.