Three

Customer Account

Usability Testing, Data Vizualisation, Wireframing & Prototyping

CustomerAccount_1.png
 

01 Context


Telecom Industry in the UK

Three is one of the top 4 largest mobile telecommunication network providers in the UK. The development of new technologies, the societal and behavioural evolution due to mobile usage and the growing proportion of millennials and younger generations are major factors impacting the industry in which Three operates. Competition is strong in the mobile telecom industry and, in this context, assessing and improving the online experience of customers represents a great differentiation opportunity. In this theoretical project, my objective was to identify  the company’s positioning in the mind of its customers and to identify any weak points. I carried out a usability test on Three’s website with a sample of actual users in the UK in order to get insights on the usability of its online services The test results helped me to draw redesign recommendations in order to improve the overall user experience. 

This project was theoretical because it was part of my Master degree work. I had to choose a subject that would fit the purpose of completing a whole CIF (Common Industry Format) Standard usability test and to redesign a new proposal based on my research results. As a Three's customer myself, I found very interesting to deeply analyse a product I was using on a weekly basis.

 

02 Problem


Usability Issues

The purpose of this usability test performed on Three website was to assess the clarity of the information provided by the Three website, the website’s look and feel, as well as the efficiency and effectiveness of the My3 interface, which enables Three customers registered online to perform a number of tasks otherwise not accessible. In this project, the ‘website’ refers to the webpages accessible by all online visitors and the ‘interface’ refers to the My3 registered users interface. 

 
CustomerAccount_4.png
 

03 Approach


User Testing

The method used for this usability test is based on the  CIF Standard method with some adaptations done for improving the accuracy of the test and for generating more insightful comments from the participants. A CIF (Common Industry Format) method is a scientific type of methodology that helps to control the different variables and laboratory environment in order to conduct the test with as low potential bias as possible. I defined several metrics are defined to be able to objectively compare the results and to highlight the findings in an accurate way. The metrics included the time spent by users on different tasks, the number of errors they made or tasks they could not complete, the number of times they asked for external assistance (an option given to them at the star but to use moderately).

 
CustomerAccount_2.png
 

04 Overall Findings


Usability Test Results

Overall, the test participants found themselves « a bit indifferent » or  « not very satisfied » about their experience on this website. The brand identity did not attract them particularly and the services did not convince them because of the very significant amount of text on the website which made the experience not straightforward. The lack of images was flagged by users as an obstacle to understand the information. More importantly, the overall site map and hierarchy of information were seen as very confusing which undermined the company’s image in the participants’ mind. One of them even thought that the mobile credit top-up process was deliberately made difficult as a task because the company wanted its customers to buy their mobile phone plans instead. Overall, the participants rated their impression of the company’s market positioning as “midrange” and felt that they were not treated as “important” customers when navigating on Three’s website.

 
CustomerAccount_3.png
 

05 Design Problems


Improving the Top-Up and Payment Processes

Based on the different tasks set in the test, I listed the range of usability issues and related recommendations suggested by participants to the test. The issues converged to highlight some specific moments in the user journey, in particular:

- Assessing the account balance on the My3 interface

- Finding the list of Add-on and buying one

- Finding the Pay As You Go tariffs

- Buying a credit voucher

 
CustomerAccount_5.png
 
 

Apart from the usability issues, the test revealed a number of presentational issues around the My3 interface, mostly concerned with the site map and the hierarchy of the information. A number of specific issues were flagged in relation to the My3 interface. For example, once logged in, several links on the My3 interface redirect the users to the main website and leave the My3 interface.  Test participants had a lot of trouble finding their way back into the interface, which they felt was frustrating and confusing. 

Furthermore, the interface currently includes many different sections at the same reading level and some sub-sections that are not placed in a consistent way. For instance, the link to the Add-on page is under “Account Balance”. This also greatly confused the test participants.

Another example of issue is that the color codes are used inconsistently compared to the rest of the interface. With this in mind, and taking into account the redesign suggestions made by participants, I improved the interface site map and the hierarchy of the information. 

 

06 Redesign Phase


Optimizing the Hierarchy of Information

Based on the test results, I developed the following  proposed version of the interface.  It includes several back-linking within the different pages to ease the navigation. The proposed version allows users to stay within the interface and to have access to all crucial information related to daily tasks. However, if the users want to access the website, they can do so by clicking on the website top menu bar, which they have access to at all times.

The first menu sections have been reduced to essential tasks users may need to perform and sub-sections have been renamed and reorganised. I made the menu “sticky” which means it follows the users while they are scrolling up or dorwn within a page and they have access to the different options. This solution is also intended to help users know where they are on the interface at all times. The subsections have been clearly separated from the rest of the menu. The divider bars have been deleted to avoid visual noise and I designed a visual separation using different colors for the icons.

CustomerAccount_6.png
 
 

The rest of the redesign I proposed involved data vizualisation techniques. The purpose was to help the users to quickly understand how much mobile credit they have left, their overall consumption and which type of plan could be the most advantageous for them.

CustomerAccount_7.png
CustomerAccount_8.png
CustomerAccount_9.png
 

07 What’s Next


Testing and Retesting

A logical follow up from this work would have been to test my design recommendations on the same and a different users samples, to understand which changes worked in improving the experience and which did not. This website redesign could have also led to a review and potential redesign of the Three mobile app  to ensure the web interface and the app were in line and consistent in particular with respect to data visualisation.

 
CustomerAccount_10.png