Plus mobile web app

Mobile web app design – driving omnichannel for one of the world’s leading betting and gaming company.

Client

William Hill Retail

Scope

User experience design, user interface design, wireframing, prototyping, responsive web design, design patterns

Take a look

Mobile prototype

Background

As a part of William Hill’s strategy to provide an omnichannel user experience (UX), the Plus web app is a digital product designed for retail customers. In terms of key offering, this product enables users to:

  • Track retail bets placed on self-service betting terminals (SSBTs)
  • Check live stats
  • ‘Cash out’ potential winnings before a bet is settled

Challenges

Taking a lead on UX and user interface (UI) design, I worked closely with stakeholders to deliver the following main objectives:

  • Define key audiences and end-to-end UX
  • Create seamless processes between SSBT and the app
  • Use SSBTs to drive sign-ups to the app
  • Design a mobile-first UI with consideration for larger devices
  • Consider future phases and features, including integration with online business and a unified customer ‘wallet’

Approach

Ideation

Research found that many retail customers prefer to bet ‘anonymously’ and are reluctant to disclose personal details. This presented a major pain point because the Plus app required a mobile number for verification.

With that in mind, I worked collaboratively with stakeholders to define customer personas which would help underpin user needs, obstacles and general behaviour. From that process, we established several use cases to cater for and the journeys that would accommodate user needs.

In typical fashion, a series of lo-fi sketches were produced to optimise user journeys, and later evolving them into more detailed wireframes, flows and prototypes.

User testing

To validate journeys and general direction of the prototypes, limited trials were carried out with customers and colleagues in five William Hill shops. Feedback allowed us to quantify any assumptions made around journeys and features. In turn, this informed priorities for Agile design and development sprints.

UI design

Although Plus isn’t a ‘native’ app, it needed to offer a similar experience with clear signposting and be aligned with the William Hill visual identity for recognition. In addition to that, the design also need to work across breakpoints for larger devices, so visual guidance was delivered to accommodate alongside the mobile-first UI.

Using various tools to collaborate with developers, journeys and designs were refined using Sketch, shared via Slack, InVision and MarvelApp, and ultimately deployed to Zeplin for front-end development.