UX/UI Design / Product Design

TIER App Battery Swapping

Educating riders on what it is about

Screens for TIER


Mobility is changing. The current climate challenges demand more efficient, safe and sustainable ways of moving people around urban spaces. We all a play a part in this change.

So does TIER, the client Adriana Liotta and I worked with for this project, over the span of two weeks.

TIER is a Berlin-based company which provides an e-scooter-sharing system to users in urban spaces. TIER's scooters are used for short-term rentals and picked up and dropped off through their app.

In 2020, TIER became the first micro-mobility company to be fully climate-neutral. This helps the environment and ensures a sustainable future for us all.


The battery is the component that stores the energy to power the whole e-scooter. And the most efficient, safe, and sustainable way to charge e-scooters is through swappable batteries.

There are many reasons why it's time to swap to swappables:

Everybody benefits from this. The environment - due to an estimated 56% to 81% reduction of operational CO2 emissions and traffic congestions; the users - for each battery swapped, they get 20 free minutes to ride an e-scooter; and the local busineses - which experience an increase in store visits and sales without any extra costs.

In theory, the battery swap process seems rather straightforward. It consists of three steps:

Battery swap proccess broken down

TIER's battery swap proccess broken down into three steps

The challenge TIER presented to us was to then educate riders on what swapping is about through the app.

For the project, the team adopted a design thinking, user-centered process.

The first step in our design process was to lead an interview with the stakeholder, in order to discover the main problems TIER users are facing when they swap a battery. Here are the main insights:

Main insights gathered from the stakeholder interview

Main insights gathered from the stakeholder interview

Afterwards, we led user testing with the current swapping battery process, in order to empathise with the user and understand his/her problems.

First, we assessed how experienced each user was with e-scooter-sharing services and with the battery swapping process.

Then, we instructed the user to book an e-scooter and we asked questions along the way about their decisions.

Finally, we requested users to swap a battery, asking how would they would proceed.

The main insights we gathered with our users were the following:

Main insights gathered from the user testing sessions

Main insights gathered from the user testing sessions.

The results of our research indicated that most of our users could not initiate the battery swapping process on their own. Therefore, the scope of the problem had to be expanded. Before we educate riders on what battery swapping is all about, we first need to make them aware of it and its benefits.

With this in mind, we kept going forward with the research project.

The team led a competitive analysis of the e-scooter market, in which we compared competitors according to price, country availability, fleet, amidst other criteria. TIER is the only company allowing users to swap batteries in SwapSpots and this is a major competitive advantage.

The user persona we kept in mind while designing is Georgi Gelashvili, a 26 year old barista who just moved to Berlin.

The user persona for the case study - Georgi

The user persona for the case study - Georgi

In the customer journey we envisioned, Georgi regularly uses shared scooters to move around the city. He jumps between apps, depending on the closest e-scooter.

Once he opens the app and is exposed to battery swap possibility for the first time, he starts learning about the benefits. He then swaps his first battery.

After the first initial learning curve, Georgi completes his battery swap. He then keeps on swapping batteries, accumulating minutes with each. Georgi ends up only riding TIER because of the economical and environmental benefits.

The user flow we created tried to simplify the whole process by reducing a few steps of the battery swap.

The user flow for the case study

Our simplified version of the user flow

In the ideation phase, the team had more ideas than time would allow to implement. Therefore, we led a MoSCoW prioritisation to define which features would be more beneficial for the user and the stakeholder.

MoSCoW matrix to prioritise the features in the ideation stage

MoSCoW matrix to prioritise the features in the ideation stage

Our main task was to rearrange the architecture information, ensuring that the battery swap feature was more visible and understandable.

Subsequently, we started designing, going from lo-fi prototypes to mid-fi.

Along the way, we tested with users to validate our designs, ensuring that our solution would make the battery swap process more seamless and simple.

After a few iterations, we were ready to deliver the final prototype. The high-fi prototypes were designed with TIER's design system.

Below, we compare the designs of current app design with our solution to the problems identified.

High fidelity prototypes for TIER's battery swap process

A screen was added to the navigation to explain the battery swap

High fidelity prototypes for TIER's battery swap process

The filter options highlight once again scooters with swappable batteries

High fidelity prototypes for TIER's battery swap process

The map and scooter selection modals focus on the the swap feature

High fidelity prototypes for TIER's battery swap process

The Swapspot screen was redesigned to accomodate the "Book a Battery" feature

This was a great opportunity to simplify the process for a very complex user flow, with the aid of a design system.

The feedback of the stakeholder was very positive. Our work confirmed some of their existent hyphotesis but also identified some opportunities for improvement.