Redesign of a telco mobile app

The Slovenian telecom provider, a member of América Móvil’s A1 Group, launched an overhaul of its self-care mobile app. We rebuilt it from the ground up, relying on user testing to reimagine core functionalities and improve UX.

Redesign process

A1 Slovenia, sought a fresh UX/UI perspective that would refocus the app’s core functionalities on the needs of existing users. We placed usability testing and user interviews at the heart of the redesign process to deliver an app that would delight users and create a frictionless customer experience.

Analysis & Research

From analyzing survey data and Google Analytics to analyzing screens with UX best practices in mind we reported the current state of the app.

The document was made out of our assumptions about the struggles of the user.

We created a list with the 10 most important user issues, these are a few examples:

#1 Issue with navigation

Our assumption:

There were too many items in drawer navigation, the assumption was that it was making users feel disoriented. The app had two navigations ... one at the bottom with main actions and everything else was hidden in the drawer menu.

#2 Switching between services

Our assumptions:

The current solution for switching accounts wasn't intuitive. There was no indicator about account child-parent relation.

#3 A1 Protekt option

Our assumptions:

A1 Protekt activation and deactivation is’t clear enough. The users can't be sure what will happen once they activate/deactivate it. Instructions aren’t clear enough for being unable to activate different options (in the current billing period).

User testing of the current app

Based on previous assumptions we proceeded to the next phase which is user testing. We created a list of tasks for user testing that were focused on the pain points we had in our report to the client.

Usability testing was conducted on the current Moj A1 self-care mobile application for both iOS and Android (version 5.20.2) in order to gather qualitative data that will be used for the improvements of the app. It had a list of 14 tasks and 3 post-test questions about user satisfaction.

Methodology

Live moderated usability testing was used. The testing was conducted on-site in A1 Slovenija offices. 

Nine users tested the application which were selected by the A1 team and were grouped by the services they are using within the app. Participants were screened using an online survey. Each user session was around 30 min long. Users shared their screens via Microsoft Teams which were recorded together with their voice. Their personal applications were used for the testing in order to get feedback on real experiences. 

The testing was moderated by the Undabot team and A1 team.

Example: A1 Protekt option

This is an example of a task for the A1 Protekt option, users were instructed to start from the homepage.

"A friend of yours had a cyber attack on his device, you want to make sure that doesn’t happen to you. Go and explore the price of A1 Protekt."

Usability testing report

We did the report with pain points of the users for each of the tasks, also shared the data in excel for every user with the client.

Example: A1 Protekt option

Most of the users had issues with finding this option. A lot of them were searching for this feature in Options ("Opcije") > Other options ("Druge opcije"). Perhaps that is a place A1 Protekt should be.

Example: Switching to other services/numbers

The option is confusing to users, there is an opportunity to make this more user-friendly. Some of the users mentioned they would like the option to give a name to service/number so it would be easier for them to distinguish them.

Additional remarks

There is an opportunity to evaluate the menu structure and group things together in a way that will be easier for users to understand. Additionally, there is a need for the app to be more visually appealing, especially the graphical data representing users' usage.

Information arhitecture

Restructuring the navigation

Information from usability testing is that users often get lost in the app, so we proposed a new structure. We removed the drawer sidebar and placed most of the actions in the bottom nav bar.

All the categories were rearranged and careful wording here was critical. We had client feedback for category names as well. We managed to pull 2 navigations with many categories into 5 bottom menu items. Each item would take you to the page where options were presented like widgets.

User flows

Example: A1 Protekt activation

The A1 Protekt option was important to the client, as users couldn't find it in usability testing we decided to place this option as the "Homepage" widget and under "My number" widget. The location of A1 Protekt was now under Options, as the majority of our users were searching for it there.

Example: Switching between different services

We added the new functionality for naming your service. Now when selecting the service from the list, you will be able to choose it by name also (not only by number). This is no longer hidden under the drawer menu, but it is the first thing you see on the homepage (if you have more then one account).

Wireframes

Changing service

We made a suggestion for a simpler service changer. Since users mentioned on the last user testing they would like the option to name the numbers, we made that feature possible.

My number and additional options

We grouped add-ons and additional options under My number, including "A1 Protekt" which users couldn't find before.

Quick options for payment and help

Bill payment is one of the most used features of the app, so we made it as simple as possible to access from the main button in the bottom nav bar.

Help is also one of the important features since it is connected to solving technical issues. It was implemented as a floating button.

Current usage and payment

Current usage next to payment is one of the most used features of the app. We tried to make it as clear and simple as possible.

Prototype

The prototype was created on top of wireframes and we were ready for another round of user testing.

Usability testing of the proposed concept

The testing once again was conducted on-site in A1 Slovenija offices. 11 users selected by the A1 team tested the application. Each user session was around 30 min long.

Copy change

Finding package options

Since we had enough users we decided after half of them to make a copy change from "My number" to "My services", since we saw them struggling and on the spot managed to do this smaller change. After this change, it was easier for them to find options for expanding their package.

Finding PUK number

Users didn’t have problems finding this information before our copy change, but some were still often looking under my profile. Once we changed the copy on the navbar from “My number” to “My services” all of the users had issues finding this option. In the end, we decided to move this to “My profile” since we decided on keeping the new copy for “My services”.

Report

Issues summary

  • Users had issues finding the options for the calls abroad suggesting all of it should be under roaming.

  • Some of them had issues understanding what is under Profile and what is under My Number, after copy changes this issue was resolved.

  • Once we changed “My number” to “My services” it was easier for the users to find options to expand their package, but it was harder to find PUK information since the new copy wasn’t relevant to it anymore, some users were looking for this under my profile. We decided that might be a good placement for it.

A lot of the users liked the new suggested wireframes, saying the flow is simple and hierarchy clear giving a score of 8,25/10 on average

Creating the final UI

The next step was implementing all the suggestions into wireframes and start working on the final UI.

We didn't use moodboards here since A1 has strict visual guidelines. But of course, we did try a couple of options.

The app was created for light and dark mode for mobile. Also, screens were adjusted for iPad.

Redesign results

Based on the initial launch survey redesigned application is liked by more than 2/3 of the app's users.

Since our goal was to make this app more user-friendly and to improve satisfaction I am happy with the results. Also, it was a privilege to work on this redesign. Going to beautiful Ljubljana to do user testing was an absolute pleasure. The A1 team was always there to support us, especially with translations to Slovenian. They were fun and friendly to work with. I enjoyed every part of it!

As always, my colleagues at Undabot showed huge support, especially Ana Šeler who came along to accompany me in this redesign journey.

Thank you for your attention!

Head over to Undabot.com for additional info on the A1 case study.

Undabot
Your partner in creating amazing digital experiences.
Get in touch

More by Undabot

View profile