UX Portfolio of
Karl Salisbury

Transactional & Travel UX specialist

Sportsbet Android App

A redesign of the Sportsbet Android app for their re-platforming project

What is Sportsbet?

Sportsbet.com.au is Australia’s largest corporate bookmaker and part of the Irish Owned Paddy Power Betfair Group, one of the leading sports betting and gaming groups in the world. Sportsbet have a native iOS app, Desktop site, Mobile Website and a mobile web wrapper as their current android app offering.

What was the Android project and why were we doing it?

Due to the growth of mobile platforms, it was necessary to provide a native Android app to provide better speed, realibility, usability and security to sportsbet customers

What was my role in all of this?

At Sportsbet I worked on the Design, Research and User Experience team as a UX Specialist across a wide variety of new features and small step improvements.

As this was the largest project ever undertaken by Sportsbet, I was brought onto the project as a dedicated UX Specialist on the Bet Slip Feature team. I was paired with a UI Designer, co-located within an agile scrum team comprised of a product owner, testers, developers and a UX researcher.

So what is the Bet Slip?

The Bet Slip is essentially the shopping cart and checkout of the digital betting experience. Customers browse and add bets from different sections of the app, however staking and bet placement happens within the Bet Slip. Due to the time sensitive nature of betting and the large variety of sporting codes, odds types, bet types and combination of bets into multibets, there are many errors the user can encounter which can create a lot of friction points.

A first time bettor's user journey

Early wireframes defining the Multibet flow functionality in more detail

Responsive image

The user flow and steps the user will need to take to place a Multibet in the Bet Slip

Responsive image

The biggest challenges

My role was to improve the user experience of the Bet Slip. The biggest challenge was striking a balance of usability between mass market customers and those who are experts on gambling.

Terminology

Terminology in gambling is often archiac, parochial and means different things to different market segments. For example, how many people know what Trixie, Lucky 7 or a Roughie is? Does the word return or payout resonate more with customers? Is the terminology consistent or does it contradict itself in different sections of the user flow? In order to ensure we got it right, extensive user testing was done on the use of language to improve comprehension among customers. A language study with different types of users was conducted and I was responsible for developing a new glossary of terms to keep language across the app consistent and easy to understand by all market segments.

When things go wrong

Due to the time sensitive and complex nature of betting, bets in the bet slip can expire or become invalid very easily. Many small step improvements were made such as more user friendly error messaging and more user friendly ways to dismiss errors to remove barriers for the user to complete transactions. Error message pattern guidelines were established to bring more consistency to how error messages are presented to the user.

Error message pattern guidelines were established to bring more consistency to how error messages are presented to the user.

An example of an error messaging pattern

Responsive image

Customer Empathy

Working with stakeholders who were both highly technical and very savvy about betting, the biggest challenge was building empathy for how customers understand and interact with the product, particularly novice users. I evangelised the value of everyone in the team observing user testing sessions to understand the customer's point of view and brought journey maps and personas into discussions about user flows to ensure we were developing a product all types of users and not just for ourselves.

A customer journey map

Responsive image

Stakeholder communication

Fortnightly company updates and demos were made to provide transparency within the business. As we were showing fragmented parts of the customer experience, I used journey maps and personas to explain the full customer journey, why we were doing what we were doing and who it was for.

An offsite meeting with the Product (product owner) team where I am explaining the role of the Design, Research and User Experience Team

Responsive image

Build, test, learn

In collaboration with UX researchers, remote and in house user testing was conducted on all major design decisions to validate concepts with customers before release. Findings of one such study have been distilled here into a journey map to paint a more detailed picture of user behaviour.

Responsive image

Patterns & Consistency

A big challenge working in an agile environment is the divergence of design styles and use of interaction patterns within different teams which can create fragmented experiences for the user. I lead the creation and implementation of a pattern library to ensure patterns were applied consistently across the android experience.

An example of how the Atomic Design system was applied to Sportsbet.

Responsive image

An example of a pattern

Responsive image

Flight Centre Group Booking Engine

Localisation, rebranding, new features and small step improvements for the Flight Centre Booking Engine

So what is the Flight Centre Travel Group?

After starting with one shop in the early 1980s, FCTG is a $1.8 billion business consisting of more than 40 brands. One of the world’s largest travel agency groups, it has company-owned operations in 14 countries and a corporate travel management network that spans more than 90 countries. It employs more than 19,000 people globally and has a total of 2800 businesses.

What the heck is a Booking Engine?

The booking engine is a transactional platform that allows users to search for, book and pay for flights. As Flight Centre group encompasses many brands globally, the booking engine is also localised and customised for different brands such as Flight Centre, Student Flights, Escape Travel, Aunt Betty, Travel Associates for Australia, South Africa, United Kingom and New Zealand.

What was my role in all of this?

I was solely responsible for the localisation and customisation of the platform for additional brands and international markets as well as small step improvements and new features. Working with an agile scrum development team, I oversaw the implementation for Flight Centre South Africa, Student Flights New Zealand & Australia, Travel Associates, Escape Travel as well as the Jetstar luggage, meal and seating selection feature. I was also involved in user testing sessions and collation and distribution of findings within the business.

The biggest challenges

Style guide governance

Maintaining a platform that has also been customised for 4 different brands and 5 different markets is no small undertaking. Maintaining strong style guides and global style rules was critical to prevent problems with regression of styles, inconsistencies and fragmented experiences. I was primarily responsible for the style guide governance and educating development teams on the value of consistent pattern usage and implementation.

Style Guide example

Responsive image

Stakeholder collaboration

This project required communicating with other brand stakeholders and guiding them through the process of what was and wasn't possible with the platform and how it could best integrate with their existing systems. Educating them with existing customer research but also ensuring the platform was tailored to their needs.

Example of different booking engine designs

Responsive image

Travel Associates Responsive Site

A/B Testing, new features and improvement of customer journeys

What is Travel Associates?

Travel Associates is a boutique travel agency with a focus on person to person customer service offering premium travel products to discerning travellers. Their point of difference is their exceptional customer service, tailor-made itineraries, competitive first class and business class airfares, special interest tours, luxury cruises and luxury rail journeys.

What is the Travel Associates site and who is it for?

As a brick and mortar travel agent, the Travel Associates website serves as a point of contact where customers can browse travel products and get in contact with a Travel Associates store or their existing travel consultant

What was my role in all of this?

My role as a UX Designer was improving the customer journey and reducing friction on the digital touchpoint.

Consultant and Store finder

Through quantitative research, analysing customer enquiry data and talking to real customers, I uncovered that customers would frequently use the enquiry forms to email travel consultants they had already started a conversation with. Using this insight, I spearheaded the creation of a consultant and store finder system that increased customer enquiries and reduced friction on the digital touchpoint.

Heat maps, drop offs and bounce rates

Using heat maps and Google Analytics it was uncovered that the bounce rate was unusually high on the top level of the site's information architecture. After doing some benchmark user testing, the solution was to expose the information architecture at the parent page level to allow users to click through to pages that were previously obfuscated in a poor menu structure

Multivariate testing

Stuff here

Example of a Multivariate test plan

Responsive image

Example of Multivariate test results

Responsive image

Example of Multivariate test results

Responsive image

Prioritisation and MVP

As the Travel Associates team was very lean, it was necessary to prioritise work and do MVP releases to validate concepts before committing more development time. Multivariate testing was also used on release of new templates to benchmark the experience against the old pages and also optimise the experience for conversions.