CASE STUDY - MOBILE TV APP

UI CENTRIC | London

02 - 04 / 2019

PROJECT OVERVIEW

In Spring 2019, UI Centric was in the early stages of designing the My5 Next Generation Mobile Application. The aim was to provide great user experience for users. After interviews and meetings with Channel 5, we decided to conduct usability research to validate usability performance of the key screens.

The usability research in this project had four goals:

Exploration: Better understanding user habits, satisfaction and expectations from TV apps and identifying potential design problems.

Optimisation: Optimising UI icons for faster recognition using a semiotic approach.

Validation: Validating usability performance of key screens (Home, Show Page, Browse, LiveTV, Playback)

Delivery of requirements: Designing the most preferable screens and features

TEAM

Head of Design

Senior UX Designer

UX Research Consultant

Archesoft: UX Research Consultant

Exploring on-trend video recording technologies

Preparing a Usability Test Plan

Building a Usability Lab

Designing survey and user tasks

Conducting Usability Testing sessions

Analysing the sessions and sharing insights with the team

METHODOLOGY

In this usability research, Multivariate testing technique was used to get quantitative data by designing different versions of the key screens of the mobile app. These creative variations which were designed helped help us to see which combination of these versions was the most preferable.

The semiotic approach also was used to optimize UI icons for faster recognition and interviewed the participants and asked them which versions they found more intuitive.

Phase-1: 2-week research for exploring new video recording technologies, setting up the Usability Lab, and performing test sessions

Phase-2: Qualitative Survey design and User Task design

Phase-3: 40-min individual interviews with 5 users, analysis of the results, and drawing insights

RECRUITING

The participants had a variety of experience watching TV on their own smartphones and who were 20+ years old. The demographics are outlined below:

Participant

Gender

Age

Ocupation

Frequency

Female

Male

Social Worker

Moderately

Teacher

Infrequently

Female

Social Worker

Infrequently

Male

Sales Manager

Very Often

Female

Flight Attendance

Moderately

QUALITATIVE SURVEY

Qualitative Survey was designed to find out participants' thoughts and opinions to help us design better apps by gaining more insights.

How do you feel about notifications?

What do you think about biometric sign in?

How do you feel about advertising?

FEEDBACK

"I tend to click out of it (notification) if anything pops out "

"I love the thumb recognition of my phone; it is simple and pretty secure. I think it is genius, you might not remember the password."

"It is annoying. If I’m paying for it, it should be ad-free."

EXPLORING ON TREND SOFTWARES

One of the challenges of running usability testing on mobile devices is how to record a video of the session. Recording sessions on desktops is easier than recording on mobile. They simply use the mouse pointer and webcams to capture a full picture of what the user is doing. On mobile devices, it’s just as important to see what the users' hand/fingers are doing as the targets they are tapping on.

According to the result of my research, I listed 4 options to capture a session on a mobile device:

1. Attaching a camera to the device itself

2. Mounting a fixed camera above the space where the participant will sit (selected)

3. Recording the screen capture of the device

4. Using wearable camera equipment

OPTION

PROS

CONS

Attaching a camera

1. Stable view of the screen

2. You can see the participant's hands and finger movements clearly.

1. User has to overcome the weird feeling of unusual camera mount attached the device.

2. The physical mount can get in the way participants would naturally hold a device.

Mounting a fixed camera

1. You can see the participant’s hands and finger movements clearly.

2. The device can be quickly and easily swapped.

3. User freely can pick up the device in a natural way.

1. Unstable view of the screen depending on how much the user moves the device.

2. User has to keep the device in a certain area bounded by the camera.

Recording the screen capture

1. User can freely pick up and hold the device in a natural way

2. High quality screen capture

1. No visibility of the participant's hands and finger movements

2. Requires screen capture software to be run on the device

3. Screen capture may overload some devices

Wearable equipment

1. You can see the participant’s hands and finger movements clearly

2. User can freely pick up and hold the device in a natural way

1. User has to overcome the feeling of wearing a head cam.

2. Unstable view of the screen depending on how much the user moves their head.

USABILITY LAB SET UP

The study took place in the Usability test room of the London office. In the test room, the participants used an iPhone X device with a high-speed connection to the Internet. The iPhone that the participant uses had prototypes on it and it was fixed to a mobile stander which is also attached to a web camera to capture the participant’s finger movements via the video session. Another web camera across the participant captured participant’s facial expressions in the same video session.

When I was testing the size and duration of a video session

USABILITY TESTING

My colleague Judit, the senior UX Designer and I, conducted the test sessions. They consist of:

5 x one-to-one, face-to-face sessions at UI Centric’s London office.
Each session was 40 min per participant.
Participants were given a few interactive prototypes of the key screens to test against and assess.

Moderators: Judit, Senior UX Designer and I, UX Researcher

Interview: We sit in the room with the participants while conducting the session and introduced the session. After they signed the consent forms, we started conducting a short background interview about their mobile TV experience, and then introduced tasks as appropriate. I also took notes about the participants' feedback and observed their physical and phycological responses.

Icon Optimisation: We showed them a few UI icons and asked what they think of the meaning of icons. In this way, we aimed to find out which icon was recognised faster.

Validation: During the sessions, they were asked to perform user tasks for different versions of screens.

HOME PAGE

Question: Which version of Home Page is more intuitive to you?

Prototype 1: Featured rail with arrows

Prototype 2: Featured rail with dots

BROWSE

Question: Which version of Browse Page is more intuitive to you?

Prototype 1: Browse A to Z list

Prototype 2: Browse with an additional navbar

SHOW PAGE

In another user task, they were asked to click on the prototypes of the Show Page.

Question: Which displaying option would you prefer?

Prototype 1: Auto-play when the user is redirected from the Show page

Prototype 2: Play when the user clicks on the hero

Exploration: They were also asked to share their expectations from TV apps such as personalisation which allows them to shortlist favourites or download content.

KEY INSIGHTS

Rather than arrows, all users preferred dots, as they showed how many items on hero rail, and this avoided aimlessly scrolling experience.

Biometric authorization was the most preferable sign-in option.

They found it easy and secure.

They were happy with browsing shows in alphabetical order,

so that they could see items

easily and clearly.

They were happy with shortlisting favourite contents.

They also preferred to be able to download them.

The auto-play feature was found annoying. They wanted to make their own choices before started watching the content.

They preferred to see show details hidden by clicking on the 'i' button. With this way, Show Page was clearer and

easy to scroll for them.