EE mobile: re-thinking a user experience

1. Title bar: the MY EE button in the top right corner has no functionality and is only found on the home screen; the burger bars and whole area look mis-scaled due to resolution issues.
2. Yellow box: the user profile picture is unchangeable and the box displays information that the user almost definitely already knows, yet this is probably the most noticeable element of the home screen.
3. Data usage: this box also displays information that the user almost certainly knows and as also has a lot of blank space inside it.
4. Package information: displays information that the user almost definitely knows (minutes and texts allowance) and leaves a lot of blank space on the right hand side. Overall this box is pretty much unneccesary.
5. Add ons: this box is clearly important to EE and as a result contrasts with the rest of the app in order to stand out. However, in doing so it appears ugly and unfitting. The background image also doesn’t really have much relevance to ‘add-ons’
6. Billing: useful information but displayed badly. Billing is likely an element that the user is most interested in yet the full box can not be viewed without scrolling. Furthermore, the option to pay the bill is in a different box.

Tackling the problems

I started to confront the main issues facing the EE app by determining which elements of the app are theoretically most important to both EE and the user. The finished determination is represented below; the artboard on the right expands the categories listed on the left.

Wireframing

The next thing I aimed to solve was the spacing of the elements to try to create a clean and simple home page, displaying all of the elements clearly without the need to scroll. The relative importance of elements (as represented above) was used to determine the positioning and relative size of the buttons.

Finishing up

Using EE’s website as reference for colours, I created an entirely new palette and used a mixture of existing and new icons along with the wireframe above in an attempt to create a much simpler and cleaner-looking app.

UI breakdown

Taking a in-depth look at the new user interface.

• Unchangeable profile picture has been replaced with a simple personalised welcome message. Full account information is available one click away.

• First third of the screen features detailed data usage and billing information at a glance. More information is available by clicking on each button. Size is respective of relative importance.

• ‘Add ons’ is made clear by using contrasting colours that contrast the button with other elements whilst keeping with the theme.

• A rolling ad bar displays various adverts and is clear without appearing intrusive. The icons at the bottom of the screen represent those of the least relative importance.