Advantage

Making electric bikes affordable

Role  Product designer - from concept to delivery
Timeframe  Mar - Apr 2021
Advantage is an electric bike leasing company that aims at providing a worry-free and affordable solution.
Challenge

An electric bicycle is not a choice accessible to everyone, especially those who just need a vehicle for a short term.
The goal is to create an alternative solution to purchasing an e-bike for those who have difficulties paying the full price.

Solution

A web-app prototype allowed me to test the idea and confirmed that users would benefit from this service.

My role

I was responsible for the entire product. From research, conducting user interviews, synthesizing and prioritizing goals, brainstorm ideas to finally designing and testing the solution. I created informed based design such as wireframes, low fidelity and high fidelity prototypes, iterating insights along the process.

Approach

I adopted a design thinking process that allowed me to understand and empathise with the customer's needs and generate ideas based on evidence.

Tools used
Miro tool iconFigma tool iconMaze tool iconAdobe Illustrator tool icon
A presentation of the app design screens of an affordable solution to own electric bikes

Process

Empathize process icon
Define process iconIdeate process icon
Prototype process iconTest process icon

Empathize

The discovery phase allowed me to define the business goals, review the competitors, understand our market and client visions, analyze users needs, behaviors and pain points.

To better understand how people approach buying bikes and what they look for and identify potential problems I conducted a user interview before diving into creating a solution.

A preview of the empathy map
Interview & emphaty map

The initial interview revealed that:

  • 90% of participant find the price of electric bike unaccessible
  • 70% of the participant are worried about theft
  • 40% of the participant don't know how to choose an e-bike
  • Many are concerned about the loss of value and maintenance
A presentation of the user persona
User persona

To better guide our design, and empathise with the users I synthesized the interviews and come up with two main personas:

  • Local daily commuter
  • Travelers
A table view of the journey map
Journey map

Knowing who exactly I was designing for allowed me to ask myself how Advantage would fit into the lives of the users.
I imagined ideal experiences and focused on how our personas think and behave to align content and features. This gave me a way to visualise what content would be useful and what were the possible opportunities to improve.

Define the problem

From the initial research, I then prioritized the following problems:

  • P0. How might we make the electric bike market more accessible?
  • P1. How might we create a business model that allows owning e-bikes for the short term?
  • P1. How might we present and help users to choose the bike for their needs?
  • P2. How might we give security to our users and their investment?
  • P2. How might we offer a worry-free experience?
Jody is a casual rider who enjoys riding to work and with friends on the weekend who needs a convenient way to own a reliable electric bike without breaking the bank because he can't afford to pay full price.
Jody is a millennial living in a big city who needs a theft protected bike that gives him peace of mind while leaving the bike parked outside because it is her only vehicle and can't afford to buy it again.
Clara is a wanderer that enjoys exploring new cities and cruising around who needs a convenient and hustle free way to own a bike for a short term because she is moving every 1 or 2 years.
Clara is an active person, busy juggling between two part-time jobs who needs a way to quickly choose a bike without any knowledge because she is not a professional and doesn't have time to do research.
A presentation of the app wireframes

Ideate solution

Based on the research, I opted to build a web app prototype, where the big picture will be communicated through the home page; and the guided filter should help the user with their selection.

Possible solutions and ideas that came from the brainstorming session were:

  • Selling bikes on a monthly membership plan
  • Offer the possibility to return or upgrade the bike
  • Guide users making a straightforward and informed decision while choosing a bike
  • refurbish the return bike so that can be used by other users
  • Track the bikes in case of theft
  • Offer assistance and service on the spot


Note that some of the solutions were not examined from a business side, it would have required business experts to validate the feasibility and develop a business plan

I focused on experimenting with the desirability of the main business idea, with the hypothesis that the business would be attainable.
A preview of the competitive analysis
Competitive analysis

Looking at competitors, I was surprised to discover that there weren't any direct competitors in Australia. Here is a quick overview:

  • Dance is the closest to our idea, however is still in beta and is only offering one choice of electric bike.
  • e-stralians offers membership plan to purchase e-bikes on a monthly plan, targeting mostly employees.
  • Buzzbike offers a worry-free monthly membership to own a bike (not electric)
  • Telstra has a great solution to selling phones on a monthly based contract and has a great solution to show exactly what you should expect.
A 6 step storyboard sketch
Storyboard

Empathising with the users, allowed me to imagine the big picture and how our product could help users.

A preview of the user flow
User flow

After identifying the main scenario, I outlined the primary pathways our personas would take while interacting with our product.

A preview of the initially sketched paper wireframes

Design

Before moving into low fidelity prototype, I used paper rapid sketching to get a feel and establish the basic structure of what the web app would look like. My strategy to create wireframes is to quickly sketch two/three different layouts per page, highlight the best parts and finally compose a foundation for a prototype.

A preview of the initial wireframes for the home and chat screens
Home screen & chat

The home screen gives a brief overview of the service and features provided.

A chat, to support users at any time, is easily accessible by the button in the right corner, or the menu.

A preview of the wireframes for the filtering feature
Guided Filter

A guided experience is designed to assist users in choosing a bike and membership in a clear and simple flow minimising distractions.

The filter will show only available items based on the input entered, to limit the number of unwanted items and reduce the user effort.

Usability study

Before proceeding to design the high fidelity prototype, I needed to figure out what were the specific challenges that users might have faced during the guided process of ordering and choosing their e-bike plan.

I opted for an unmoderated usability study through Maze.co, where I tested 8 participants.

  • Many participants felt confused navigating through the guided steps due to a lack of clear direction and more detailed information.
  • The horizontal scroll used to show and compare the plan options didn't feel natural to most users.
  • Few participants lost interest or felt annoyed completing the guided steps due to many steps.
  • Most participants found difficulties finding or recognizing the chat icon on the navigation bar. Also, they naturally opened the menu expecting to find help there.


Insights

  1. Include descriptive instructions on each step of the checkout
  2. Show the plan options in a more natural and condensed way
  3. Reduce steps where possible to lower drop rate
  4. Make the chat icon more visible and accessible
The comparison of the design changes, before and after the usability test
Iteration after the initial usability study

UI Design & High fidelity

To maintain consistency, I developed a design system, based on reusable components and states. This allowed me to quickly make changes while building the mockup.

A preview of the full logo and the components used to build it
Logo design
A preview of the buttons, card states and component used in the design system
Buttons & components
Guides filter
Plan preview
A preview of the colour and typography system used to style the design
Brand color & typogrphy
A set of styled icons used in the design system
Icon set
Accessories

Key results

Advantage has received both positive and negative feedback since our last test. Users have responded well to the design iteration and shown an improvement in the overall usability score.

There are still improvements to be made, for instance, there is big confusion and drop rate on step 3 “Details” of the guided filter, and the participants requested a more detailed explanation about the pricing information.

To conclude, we can say that this idea has some potential and shows that there is a market that can be covered.

When asked the 23 participants "how likely are you to subscribe to our plan?", 35% of users were highly interested in using Advantage solution  to own an electric bike, while 61% showed interest and might benefit from it.

Takeaways

Working on this project let me practice and opened my mind to a more holistic approach, and reinforced my view on how crucial is to have a broad understanding of the business goal. I learned some important takeaways from this project related to product and business processes.

  1. The high fidelity prototype should be as detailed and functional as possible to get valuable insights.
  2. Avoiding bias is not easy however the more testing and questionnaire you perform, the better it is to keep yourself on the right path.
  3. It’s easy to come up with multiple ideas but prioritization is key to bring the product to life, done is better than perfect.