top of page

LAUNDRY APP

UX/UI Case Study | B2C Digital | 2020

Overview

Developed an interactive mobile application prototype that simplifies and clarifies the process for tenants to book and cancel shared laundry room slots, while continuously analyzing and refining the UX and UI throughout the design process.

Duration: 1 week
Tools: Adobe XD, Miro, Overflow, AI, PS
Phases: Strategy - Outline of Scope - Sitemap - Wireframes - Visual Mockups
Role: UX & UI Designer

Background

Around 42% of Sweden's population lives in apartment buildings, and sharing a laundry room can be quite challenging. If you're lucky, there might be washers and dryers on each floor, sparing you the hassle of carrying your laundry up and down stairs or to another building. However, in my experience, there was only one shared laundry room for the entire building where I lived. This made the laundry booking system incredibly frustrating, which ultimately inspired me to complete this project.

WechatIMG4.jpeg

A mechanical calendar where the residents got a small key to move around on a large board with dates. 

UX Research

User Interviews

To better understand user needs and behaviors regarding their shared laundry experiences, I interviewed friends and neighbors who had either experienced or were currently experiencing it. I aimed to uncover their feelings about the current laundry booking system, the challenges they faced, and the features they would want in a laundry booking app. The interviews revealed several core user needs related to the laundry-sharing experience, which I documented on post-its to help identify recurring themes and issues.

I have also listed a certain set of common-sense rules of my apartment as examples, which will be fundamental rules for the following application design:

  • Choosing the Right Hours. A common rule is to not use the machines before 7 a.m. or after 10 p.m.

  • Cleanliness. Keep the laundry room cleaning.

  • Timing Your Laundry. You can not enter the laundry room when your booking time is ending. 

未标题-4_画板 1.png

User Needs

According to the previous user research, I found the sources of shared laundry room user needs:

​

User Needs

  • Book and cancel the laundry room 

  • Check available laundry time

  • Laundry time start and end reminder 

  • Be able to set an alarm  

  • Check current laundry user

  • Rebook laundry room 

User Segmentation

The app will focus on the following target audiences:

 

Roles (groups of people with similar goals):

  • Tenant/ who is sharing laundry machine with other tenants in an apartment building

 

Demographics (gender, age, education, occupation, marital status, income, location)

  • Gender - Female and male students live in the same apartment building

  • Occupations - Working or retired

  • Income - Stable income

  • Age - 25-60 years old

  • Location - Riksbyggen, Lund (can be other apartment buildings or student accommodations with shared laundry machine)

 

Psychographics (personality, attitudes, lifestyles)

 1. Personality & Attitudes:

  • Organized 

  • Independence

  • Convenient Life

 2. Lifestyles:

  • Engaged

  • Privacy

  • Economic

User Persona

From the research and user segmentation, a key user persona emerged: David, the apartment tenant. I created this persona to better understand the target audience for whom I am designing the product.

Customer Journey

Scenario #1 — Book laundry room

屏幕快照 2020-03-09 21.47.27.png

Scenario #2 — Check laundry time

屏幕快照 2020-03-09 21.47.37.png

Scenario #3 — Cancel laundry booking

屏幕快照 2020-03-09 21.48.05.png

Scenario #4 — Before laundry start

屏幕快照 2020-03-09 21.47.51.png

Scenario #5 — Before laundry end

屏幕快照 2020-03-09 21.47.57.png

Content & Functionality 

Strategy becomes scope when user needs are translated into specific requirements for content and functionality. This helps define what will be built and what will not.

Information Architecture

I have arrived in the middle of the UX process, ready to tackle the sitemap. The outline of the scoping phase was all about defining users’ requirements, this sitemap phase is to figure out how the pieces of content and functionality fit together as a logical whole that the user can navigate.

Wireframes _Prototyping & Testing

How are the pieces of sitemap presented on the screen? With Adobe XD and overflow, I quickly developed the first set of low-fidelity wireframes based on the content of the application flow. I conducted usability testing with my target audiences. I decided on some tasks that audiences of my testing are going to complete. During the test, I asked them to think out loud about how they felt about the experience or anything ’unexpected’, to evaluate the effectiveness and like-ability of the application. 

 

  • Check available laundry time and book your laundry appointment 

  • You can’t do laundry tonight. You want to cancel your appointment 

  • You forget your laundry time. You want to check via the app.

  • Reschedule your booking form today to sometime next week.

  • Change notification setting

  • After the washing machine start, you want to set an alarm to remind you when the washing machine ends.

Several areas for improvement were identified during the usability tests, including:

  • Combine the ’Appointment’ and ’Book’ features. Making the interface clean and easy to operate

  • Move the ’General alarm setting’ in the ’Notification setting’. Add ’Notification setting’ to ’Settings”

  • Add timer status to ’Appointment’ Page

  • Combine more tasks in the app design. Such as parking, reporting, inspection, and so on

  • Modify the ’Calendar’ feature

Logo & Branding

Hi-Fi Mockups

After several rounds of usability testing and iteration, I incorporated the branding and visual design to produce high-fidelity composites.

bottom of page