HOME PLAY BIO


Role: UX Designer

Time to read: 5-7 mins

Duration: 1 month

Finding sports-games nearby using the Sportby application

sportby cover image
Sportby: Cover image (Photo from unsplash)

Problem overview

Millions of people worldwide, play sports regularly. They make their plans or have specific routines on how and when they will play their desired sports.

According to my experience, the players who try to make regular plans of their sports or players who are trying to find games of any sports to play nearby, face unpleasant situations and unsuccessful scenarios on a regular basis.

All the users are using Social Media or calling to create their desired plans and are facing the same issues. Creating a product to create a similar space of networking between nearby players and helping them to create their own games successfully is a challenge in itself.


Discovery: Research & Analysis

Research on this study began with interviewing our key users : players who play regularly and create regular plans.

The Research was done in 2 stages :

  1. Semi-structured interview
  2. Surveys

Participants were recruited on the basis of a screening:

  • should play at least 1 time a week

Semi-Structured Interview

4 Participants were recruited in this process.The Participants were interviewed on the basis of sporting plans, on their needs, pain points, and how they create their regular plans near their locations .

Affinity diagram
Affinity Diagram after the iterviews

Key findings through interviews

Key findins - 1
Key findings - 1
Key findins - 2
Key findings - 2

Survey

To confirm our findings from the semi-structured interviews and to get a broader, more insightful view, survey was conducted. 50 participants were recruited for the same.

Key findings through survey

Key findins - 3
Key findings - 3
Key findings - 4
Key findings - 4

Design: Concepts and Sketching

The Design, according to our research was supposed to be simple and mainly, should get the work done successfully.

Flows and wireframes

Hand-Drawn Ultra Low Fidelity wireframes
Hand-Drawn Ultra Low Fidelity wireframes
Hand-Drawn Design Flow + Explanation - 1
Hand-Drawn Design Flow + Explanation - 1
Hand-Drawn Design Flow + Explanation - 2
Hand-Drawn Design Flow + Explanation -
Hand-Drawn Design Flow + Explanation - 3
Hand-Drawn Design Flow + Explanation -
low fidelity wireframes
Low fidelity wireframes

Prototype

The Main High Fidelity Screen Mockups are attached below. These mockups were created in Figma. These include the following design flows, creating a game flow and finding a game flow

The project’s high fidelity prototype can be accessed here.


Testing

I did some Usability Testing through a tool known as LookBack and got some insightful feedback.

Test insights

The Following are the insights relating to the specific tasks that were instructed to the users :

  • Creating a game Creating a game insights. P.S.: P5 is Participant 5
    Creating a game insights. P.S.: P5 is Participant 5
  • Finding a game Finding a game insights. P.S.: P10 is Participant 10
    Finding a game insights. P.S.: P10 is Participant 10

  • Iterations

    We got a few insights through the testing and we tried to go through minor changes that apply.

    iteration 1
    Accessibility issue changed | The text sizes in this screen were very small and hard to read.

    We found out that our welcome page was not that accessible and we made a few changes in that regard.

    The Welcome Screen was checked through the contrast checker of the website, source

    The results were positive with respect to the color combinations.

    Accessibility (Visibility) issue chang
    Accessibility (Visibility) issue changed

    After going through the design flows again, we tried to work around the changes in the ‘ Find a Game’ flow. We thought of a more simple way to make it work for the users.

    Through our insights, we found that there were a few minor errors in this screen.

    According to the WCAG web principles, the product should be perceivable and understandable. Also, The placement and the sizes of both the buttons was changed.


    Solution and Impact Overview

    Our final solution allowed the users to have a space and way to connect with nearby people. It provided them with a solution to their current frustrations of inability to find people to play with. The product, will further, help them to gain exposure and simplicity for their tasks. The product will launch soon.


    That’s all, folks!

    If you’re reading this, then thank you so much for sticking to the end. I really enjoyed working on this project.