Anywheel
A micro-mobility bike-share app.
Added new features to refine user experience and increase findability.
Background
Overview
Anywheel is a Singapore-founded local micro-mobility bike-sharing mobile app focused on helping people reduce the use of cards and reduce their carbon footprint. Since Singapore’s Land Transportation Authority (LTA) passed the licensing regime in 2018, Anywheel became one of the two largest bike-share stakeholders in the country. A digital app makeover was conducted to provide an enjoyable experience pre and post-riding, but are looking to enhance the user experience for new and existing riders to easily locate bike availability.
As the sole designer for this project, I was responsible for conducting user research, creating wireframes, and user personas, and prototyping to complete usability tests.
Problem
Anywheel has received approval to expand its bike fleet from 10,000 to 15,000 and users’ feedback reveals difficulty in locating nearby bikes amidst the pandemic where there is an increase in ridership as commuters turn to bike-share to avoid public crowds and transportation.
Objective
Create a quantity feature for users to easily locate available bikes nearby and favorite designated parking docks to view parking details.
Research
It is important to define the problems users encounter when using the bike find feature in the mobile app. I wanted to pinpoint the issue before brainstorming and designing any solutions. To gather insights into riders’ experiences with bike sharing, I conducted methods of Market Research, Competitor Analysis, and Online Survey.
1.
Availability means usage
Riders will use the app to find available bikes prior to their trip. The quantity of bikes is a decision-making factor when using bike-share within their city and during their travels.
2.
Inconvenience parking = negative experience
The location of parking docks is a concern for riders when seeking/ parking bikes. A factor of concern is it can be easily located within a rider’s current location. Having more knowledge of parking docks can enhance the experience.
Research Findings
Define
Analyze
I defined the issues users are facing to create personas using the insights discovered in the research phase. The personas allowed me to craft user flow to grasp how users would navigate their decision-making process along with a site map to construct the information architecture of the new feature.
Ideation
I sketched out low-fidelity screens which led to prototyping with medium-fidelity wireframes. Since most users will be utilizing the home screen to find bikes and access rides, it is beneficial to add on the designs with consistency using designs from the current brand.
Medium-Fidelity Designs
Prototype & Test
Following low-fidelity wireframes, I created medium-fidelity wireframes for early prototyping & testing to evaluate the designs.
Bike quantity
A bike quantity number will be visible to detail the number of bikes at that current location enabling riders to plan ahead of their trip.
Enhanced parking dock details
Additional dock details include bike availability with the ability to bookmark giving riders more context as to how many bikes are parked and the control to save the location.
Bookmark feature
A favorite dock list screen is designed for riders to manage their saved docks. They can easily view them by distance and access the details.
Test Findings
I gathered the test insights and sorted them into an affinity map diagram to identify user pain points and confusion for areas of improvement.
Icons are essential
Users were confused about button sizes and what circles (bike icons) are on the map, hence users were unsure where to click to reveal available bikes.
Finding the dock on the map
In response to bookmarking a parking dock to their list, the map view is the most common page riders will use and would ask how they can find their favorite dock on the map itself instead of going to the favorite list.
Research Findings
High-Fidelity Designs
Iteration
The insights on the usability test led us to iteration on the designs and build high-fidelity wireframes. The findings identified gaps and that new solutions were needed while adding the visual elements into the design.
Visual bike icon
Updating the bike’s visual representation on the map from a circle to a bike icon improves the communication of idea to the user and reduce ambiguity. The quantity of bikes with the bike icon easily translates bike numbers on location.
Color consistency in the save dock
Reflecting the color consistency with the favorited icon along with the parking dock creates a response for the user on the completed action and helps distinguish a saved and regular parking dock on the map view.
Saved dock page
The added parking dock list will incorporate a color tone to the saved parking distance with greater color contrast on the parking dock closest to the rider.
Reflections
Learnings
It was my first experience conducting a usability test with medium-fidelity wireframes. I see the advantages to test ideas early with users. It was a learning experience to observe users and learn their perspectives on screens with lesser visuals than usual.
Because Singapore is a country with a high volume of international tourists every year and incorporates dockless parking referred to as the “yellow box”. This may mislead users who are new to the bike-share concept and users with accessibility needs.
What would I do differently?
- Conduct a usability test with medium and high-fidelity wireframes to understand preferences and improve usability testing.
- This app is highly dependent on colors. I would want to understand how users with accessibility needs can better utilize bike-share.