Designing an immersive match-watching companion

For some, watching football and in-game gambling are passionate hobbies, involving in-depth analysis, lively debate and jokey banter. With a mobile app that offered basic level live-betting, my client wanted to tap into this passion and create an immersive digital experience, a 'match-watching companion'. This is how I, along with my team, worked to create a fully interactive prototype that challenged the status-quo of sports betting.

 

MY ROLE

"A lean, collaborative project."

Collaborating with another designer and a front end developer, I worked on all aspects of this lean project. As a team, we carried out user research, conceptualised functionality, visualised ideas and developed an interactive prototype that demonstrated our core thinking. 


THE CHALLENGE

"Watching the match is an interactive experience in itself - it can be social, a chance to voice your inner football manager, it’s about joy and despair, loyalty and pride."

Watching the match is an interactive experience in itself - it can be social, a chance to voice your inner football manager, it’s about joy and despair, loyalty and pride. Betting on live games should enhance this and give the user the chance to prove their knowledge, foresight and gut instincts. But our client’s app wasn’t tapping into any of this. It was a standardised betting experience with little in the way of interaction that complemented the live match experience. The goal was to develop a visual prototype that could become a ‘match-watching companion’, for presentation to internal business decision makers, demonstrating pioneering ideas and concepts for how to engage users during the game.


THE DISCOVERY PHASE

"Immersing ourselves in the world of sports-betting."

As someone new to online gambling and a stranger to football, the early stages of the project were focussed on immersing myself in the world of sports betting. With an England friendly upcoming, I settled down to watch the game with the app in hand, a healthy test balance with which to place my first bets and my team at the other end of the phone so we could text about betting tactics!

Notes made while watching the game


Notes made while watching the game

As a team, we spent our days pre-sprint collecting as much knowledge as we could. This involved interviews with stakeholders, as well as with sports fans and frequent bettors to really get a feel for how people experience live matches, and to get an idea of the joys and frustrations of in-game betting. These interviews threw up a number of insights, which helped inform our initial thoughts.

Quotes from user interviews


Quotes from user interviews


PERSONA DEVELOPMENT

"Meet Dave, Tom & Andrew."

This quantitative information, plus competitor research and drawing on the wealth of client knowledge meant that we could develop distinct personas and associated scenarios which we would use to develop targeted concepts. We discovered that user behaviours broadly covered three main types; the gamification bettor who lacks brand loyalty but plays for fun; the enhancement bettor for whom betting is a hobby; and the intelligent bettor who places thoughtful, researched bets. 

Personas were used throughout the project cycle to ensure we had the users at the forefront of our minds, and we constantly checked the concepts we were developing against our user types referring to Dave, Tom and Andrew by name. 

Persona 1


Persona 1

Persona 2


Persona 2

Persona 3


Persona 3


THE SPRINT

The first day of the sprint was spent reviewing the research and sharing insights with the team, and developing user stories from this research. This was a process of rapid brainstorming, sitting around a table with whiteboard pen in hand, getting down as many user wants as we could think of. Using our personas and scenarios, we could assign our stories to user types as we went, ensuring that our empathy was with our bettors and that the user stories we were developing hit the mark.

Developing user stories and functionality concepts


Developing user stories and functionality concepts

With a host of user stories - some straightforward, some aspirational, some completely avant-garde - we undertook a sorting exercise where we grouped the ideas into separate categories so that we could go forward and develop into interaction concepts. Through this process, we ruthlessly discarded any ideas that weren’t relevant or that didn’t fit our personas. We were lucky in that our remit was to develop purely conceptual ideas - we didn't have to worry about the intricacies of what was allowed within sports betting - we just had to prove the limits of what could be done!

Card sorting ideas


Card sorting ideas

This enabled us to come up with our vision for the app, which was formed of three main aims: 

Our three overriding visions for the project

Our three overriding visions for the project

With our overarching vision defined, user stories set in place and personas at hand, the conceptual work began. Each member of the team took one of the specific aims and set to developing sketches that detailed ideas for new functionality and interaction. Having spent a certain amount of time on our area, we’d then discuss what we’d drawn up with the team as a whole, circulate the drawings and swap things around so that everyone got to input to each section.


Once we felt we’d exhausted the conceptual stage, we set about making our sketches a reality. The first step was for each of us to collate the drawings for our given section, then we’d cut and paste the best ideas in order to create final low-fidelity wireframes that flowed and that could be taken forward to develop the prototype visuals. 

    Low fidelity conceptual wireframes

 

Low fidelity conceptual wireframes


THE PROTOTYPE

With a host of ideas fully fleshed out on paper, it was time to start realising them in actuality. Working to existing brand guidelines, we were able to quickly visualise and build an interactive prototype for presentation to the client. 

"Quick decisions need a quick summary."

As a match watching companion, the user doesn’t really want too much distracting them from the game. The app needs to complement not interfere, and so we developed a swipe-able ’summary’ area. Our scenario of someone who’s missed the first half and wants to catch up with the game and the bets came in useful here, as we imagined them wanting to get a quick overview of what had happened, some key statistics, some of the most popular bets that they might want to partake in, as well as their own in-game bets.  

Summary area

Summary area

"Making it visual."

Traditionally, the way bets are featured within apps is in list-form. A long scroll of text and numbers, difficult to navigate and difficult to enjoy. From our chats with users and with our ’betting and banter' persona in mind, we knew that for some this was an area that could be improved. So we came up with the idea of ‘interactive betting’, where bets are shown visually using football graphics like badges, shirts and images of players. To increase the gamification, we did some copywriting and rewrote bets offered as challenges using a jokey tone of voice. We upped the ante by pushing users further by comparing them with other users and the bettor’s mates, increasing the sense of friendly social rivalry that is predominant in football. 

Visual interactive betting

Visual interactive betting

"All the info, at my fingertips." 

Most of the sports bettors we spoke to had a wealth of sources where they would get all of their knowledge and information. This meant that during matches and in-game betting they were constantly flipping between apps to get the latest on form, particularly the sort of bettor summarised by our ‘intelligent user’ persona who wanted all the data at his fingertips. Therefore, it seemed to make sense to include all relevant information on the match within the app. So, we added a ‘stats’ section where users could see line-ups, match info and player credentials. 

This could be customised by the user to dismiss information they're not interested in and to set up alerts on game events that he could bet directly from. He could also 'clip' the period of time he was viewing statistics from, breaking the game and the relevant information into time-determined chunks.

Form & statistics

Form & statistics

"All the updates, all the time."

It wasn’t just statistics apps that bettors were using while watching the game, but also twitter and other live-update apps to get all the latest punditry and opinion. This is where the ‘game-feed’ section came into play. We developed this to give the user all the news and updates in one place - a customisable area where he/she can get messages from mates, trending bets and offers, expert opinion, video replays and audio commentary. The user has the ability to add their favourite twitter feeds, to choose between top pundits and to chat directly with friends.

Game feed

Game feed

"Challenge me!"

One of the insights that came out during the contextual research, was that the app didn’t really reflect what was going on in the live game, and that particularly during dull moments there could be an opportunity to engage users. We developed the idea of challenges, where the app would prompt users with ideas for bets they could place on the game action, or with challenges from friends. These notifications could be ramped up during lulls in the match to keep the user engaged, and are just another way that we managed to increase the gamification of the app.

Alert challenges

Alert challenges

"Making it personal."

Although it wasn’t absolutely a part of the in-match betting experience, we felt that the addition of a ‘profile’ area to the app would be really useful to users, allowing them full management of their account. Most of our bettors were also fans of statistics and data, so we made this section feature all of a user’s form in a visually exciting way. Customising the section to a user’s team colours and the alert noises to football chants is a bit of fun we thought would appeal to many of our users. 

An additional playful element we added was the achievements section, where a user could gain different badges by placing different types of bets. 

Profile & achievements

Profile & achievements

"Fancy your chances...?"

Most of our users liked to watch the match with mates, but they all had times when this wasn’t possible so they’d watch alone from the sofa. But it was certainly a theme that most of our users liked to be in contact with friends throughout important games, texting insights and poking gentle fun. Some would even screen-grab bets and text them to their mates, prompting them to place money on a wager. To do this they’d be switching between the betting app and messaging apps, so it was a no-brainer that a chat feature was required. What elevated it from the usual though, was the ability to directly send bets and offering the ability to go in on ‘linked bets’ where odds and offers would increase the more friends a user got to go in on a bet with them. 

Chat

Chat

THE FINAL UPDATE

Having reached the end of our week-long sprint, there were a couple of days where the team ran it past a couple of our users that we spoke to in the early phases, and developed a presentation to show to our client. The users were unanimously intrigued and impressed, although some of the more frivolous content such as achievements was felt to be a distraction. So, although we left this in our presentation, we noted that it perhaps pushed things too far into game territory.


We took our client through our work by walking them through the personas and scenarios, detailing a real match to take them through each part of the game and what a user could do at different points. They was thrilled, and were eager to take the prototype to show to decision makers and stakeholders within the company.

Client feedback

Client feedback

The prototype is currently with the client, awaiting the next stages. Looking back, it would have been great to have been able to talk to even more users - our handful of participants were immensely useful, but each had perceptive insights that sparked interesting ideas. It feels like the more we could have spoken to, the more of these ideas we could have generated. And of course, it would be great to be able to take things further - to develop the app in the real world and to test it fully. Hopefully, this will still happen!