Regarding Play

Reinventing the way people interact with sports venues and sessions in their local area

September 2019

Image of finished product

This case study isn't quite finished – full version coming soon.

This project is sensitive, and hence only a high-level summary is provided here. To learn more, please get in touch.

Regarding Play is a sports experience booking platform, born from the idea that it is often not a simple task trying to book a sports court in your local area. The idea of physically ringing a venue, organising a time and bringing down cold-hard cash in person might have worked 20 years ago, but doesn't feel so silky-smooth in the 21st century.

Coming soon!
Product no longer available

Services

Competitive Analysis
Product Management
UI Design
UX Design
Usability Testing (Maze)

Deliverables

Design System
User Interfaces
Clickable Prototypes
Wireframes

TOOLS

Coming soon!
Figma
Maze
Whimsical

Opening

The team at Regarding Play had a goal to build a marketplace that delivered a seamless experience for both players, and sports venues.

For players, that meant being the first thing people thought about when they wanted to play a court-based sport. For venues, that meant delivering a no-brainer value proposition – a new, solid channel for acquiring players and, ultimately, providing a new revenue stream.

Like any new project, the team had grand visions and limited resources. I spent time with Aryan and the team to understand their vision & strategy, to ensure we focused on the areas that delivered the greatest impact for the company's MVP.

My Work

Research

I attended meetings with Ary to visit potential Tennis venues and potential players in the marketplace. Some findings were:

Sports Venues

  • Many venues had different revenue streams – for example, court hire versus lessons/camps.
  • Some venues had one business offering court hire & sessions, others had many at the same venue.
  • Many providers were small businesses, and didn't have large budgets for digital projects

Sports Players

  • Not all venues had a website, and those that did didn't always have court availability or session catalogues online
  • Many bookings had to be handled over-the-phone. Those that had online bookings – the experience wasn't always exactly slick.
  • People identified you often had to go venue-by-venue to find what you were after.

With this in mind, we identified both sides of the marketplace were looking for both general Court Hire and the ability to book sport Sessions – i.e. lessons, camps, social group play, etc. The business would operate on a percentage cut on their bookings, helping incentivise us to deliver real value to the businesses.

Information Architecture

I wanted to ensure the product had a sensible IA frame that would support future growth as SEO became more of a clear focus. To achieve this, I broke the product up into three areas.

  1. Listings and Business Profiles: Business Profile pages and individual Session Listing pages.
  2. Venue pages: Venue pages for booking court hire.
  3. Logged-in user areas: Where users manage their account.
  4. Logged-in Business areas: Where Businesses manage their offerings and venue.

We tested different groupings of information inside the Host and Player areas through a clickable Maze prototype, and found some confusion on how to find different things. After that, we landed on a structure similar to the below one.

An example of Regarding Play's sitemap.

Wireframing

With a sitemap in mind, I began to wireframe the application to get a sense of what components would be required to build a small Design System for the product.

Snippets of the Home and Listing page wireframes.

Branding

Before building a design system for the product, I wanted to define a strong, extensible color palette that would align with the company's brand and principles. I workshopped with the team to understand their brand principles, and delivered a core color palette based on the principles of trustworthiness, quality and reliability.

I decided to use a rich blue, with a complementary color of Gold as an accent.

Regarding Play's core color palette.

Using the primary blue, I then used a square color scheme to obtain color values – which I manually tweaked and lined up to a HSL Lightness value of 50, for other system functions.

From there, I generated 10 shades of each color to provide enough variants for different component types and states. When used as a background, you can see below which text color should be used to meet at least WCAG's AA contrast ratios.

Regarding Play's UI colours.

To tie things up, I decided to use the Lexend font family – as it was designed to reduce visual stress and so improve reading performance.

Design System

With a clear color system, wireframing and strong underlying product structure completed, I began working on a design system that would ensure component consistency across the product.

Examples of Button and Dropdown component.
Examples of Select component.
Examples of Input and Form Item components
Example of initial-state page mockups.

Outcome

I wireframed and designed over 70 screens for the team and delivered them in a InVision prototype that they used for their main customer demos and pitches.

While the app drummed up a lot of interest in potential clients, it unfortunately never made it to market – but it was a great learning experience.

Responsive version of "Manage Listing" area inside the Hosting section of the website.
Example of Host Inbox area.
Example of the final designs for the Listing page

Example of a mockup for a proposed Regarding Play mobile app - listing page.

Nathan can visualise the most arbitrary system requirement and bring it to life. He's super easy to work with. He’s always down for humouring new ideas as well as bringing some of his own to the table. An all-around fantastic creative collaborator.

Regarding Play

Ary Marfavi

CEO & Founder

Home
Blog
About