O2 Retail – Windows tablet application
Whilst working for the agency Tribal Worldwide I was asked to work on an application that was intended to be used in O2 retail stores to explain the then new Refresh concept. The concept of Refresh is that customers of O2 are able to change their phones before their contracts are up, effectively separating hardware from call time and data costs. The app was to be installed onto Windows Surface tablets that would be on display in UK O2 concept stores.
I worked on UX flows and detailed wireframes and, once the client was happy, I liased with Tribal’s visual design team to prepare final graphics. One of the toughest challenges was the calculator section of the app, which was really the crux of the Refresh idea and demonstrated to customers what the deal was to cost and the choices they could make that would alter the final figure.
Frustratingly, despite being implemented onto a Surface tablet, the launch of Refresh was delayed at the time and plans for the concept stores meant that it would end up being launched in a different way.
![O2_Retail_sketches O2 Retail - sketches for site](https://shannonigansdesign.com/wp-content/uploads/2015/03/O2_Retail_sketches.jpg)
Sketches for the app along with some early wireframes
![O2_Retail_sketches2 O2 retail - more site sketches](https://shannonigansdesign.com/wp-content/uploads/2015/03/O2_Retail_sketches2.jpg)
More sketches detailing app navigation.
![O2RetailUX_wireframe_phones O2 Retail - wireframes](https://shannonigansdesign.com/wp-content/uploads/2015/03/O2RetailUX_wireframe_phones1.png)
Wireframes of the phone selection and comparison screens with interaction notes and annotations.
![O2RetailUX_wireframe_calculator O2 Retail - wireframe of calculator page](https://shannonigansdesign.com/wp-content/uploads/2015/03/O2RetailUX_wireframe_calculator.png)
The calculator screen was one of the hardest UX challenges to get right, particularly because it’s the point at which the customer learns how much the chosen deal will cost them.
![O2RetailUX_wireframe_NavMenu O2 Retail - navigation menu wireframe](https://shannonigansdesign.com/wp-content/uploads/2015/03/O2RetailUX_wireframe_NavMenu.png)
Details of the navigation menu of the app showing the order of the screens and how the menu works.
![O2 Retail app O2 Retail app screenshot](https://shannonigansdesign.com/wp-content/uploads/2015/03/O2_RetailApp_Galaxy_06a.jpg)
This is the phone selection screen worked up in the O2 style and shown on a Samsung-branded Windows Surface tablet.
![O2_RetailApp_Galaxy_10 O2 Retail - Galaxy phone screenshot](https://shannonigansdesign.com/wp-content/uploads/2015/03/O2_RetailApp_Galaxy_10.jpg)
This is the calculator screen worked up in the O2 style. I worked with visual designers at Tribal for the final design of the app.