English Ladies’ League 

My Role

UI/UX Designer 

Duration

3 months

Apple iMac.png
iPhone 13 Pro Max Graphite_4x.png

Content

Project Overview

1. Understanding the user

  • User Research 

  • Empathy Map

  • Personas

  • Problem Statement 

  • User Journey Map

  • Competitive Audit

women footy homepage.png

2. Design

  • Paper Wireframes

  • Digital Wireframes

  • Low - Fidelity Prototype

  • Usability Studies

3. Refining a Design

  • ​Mock Up 

  • High-Fidelity Prototype

  • Accessibility

4. Going Forward

  • Information Architecture

  • Responsive Design

  • Takeaways

  • Next Steps

5-design-thinking-steps.jpg

The Product

English Ladies League is a one-stop shop for womens’ football, designed to improve access to the game for players, help clubs to grow, and to connect local communities.

The Problem

Womens’ football lacks tools to connect players and clubs at grassroots level.

Responsibilities

Conducting interviews, paper and digital wire framing, low- and high-fidelity prototyping, conducting usability studies, accounting for accessibility, and iterating designs. Translating the design to a website.

The Goal

Design an app that connects women with the local football community.

1. Understanding the User 

4th pic intro mobile app.png
  • User Research

  • Empathy Map

  • Personas

  • Problem Statement

  • User Journey Map

  • Competitive Audit

User Research: Summary

Chart Web.jpg

I created a survey, which I shared in Facebook groups, requesting participants. Users who completed the survey were invited to interview; allowing me to create empathy maps to understand the users in greater detail.


The research survey identified two primary age groups (13-18 and 19-30), and that all users have smartphones that could access the app designed.

User Research: Headline Findings

Screenshot 2022-09-02 at 17.19.38.png
Screenshot 2022-09-02 at 17.19.03.png
The research shows that 52% of respondents have a club or group of players to play with, but have challenges in finding a venue to play, joining training events, and getting support online.
 

Persona - Holly

Holly.jpg

User Journey Map

Journey-Map.jpg

Competitive Audit

An audit of competing products provided insight into gaps to address with app. 

Screenshot 2022-09-05 at 14.35.23.png
Screenshot 2022-09-05 at 14.35.50.png

2. Starting the Design

3rd pic intro.png
3rd pic homepage.png
  • Paper Wireframes

  • Digital wireframes 

  • Low-fidelity prototype

  • Usability studies

Paper Wireframe

Taking the time to draft iterations of each screen of the app on paper ensured that the elements that made it to digital wireframes would be well-suited to address user pain points. 

Paper-Wireframe.jpg

Digital Wireframes

Following initial ideation, and paper wireframe drafts, I created digital wireframes as initial app designs.

I focussed on making key features accessible, such as the ‘Find a game’ section (example shown).

Filtering option to match users need.
Providing map to show where users can find games in their local area.
ELL 1.jpg
Easy access to app features from global navigation

Low-fidelity prototype

Building from the digital wireframes, I created a low-fidelity prototype. This laid out high-level user flows (through the Learn, Play, and Grow categories), and formed the basis of a usability study.

Low-Fi-ELL.jpg

Usability Study: Parameters

Study type: Moderated usability study

Location: London, remote
Participants: 5 participants

Length: 30 minutes

_Group_1.png
User-Journey-Map.jpg

Affinity Diagram

Affinity-Diagram.jpg

Usability Study : Findings 

These were the main findings uncovered by the usability study: 

Adding / Creating a game :  Users would like to find an easy way to find and create games.

Geolocation search options: 

Users want to be able to search by town / postcode - not just their immediate locale.

Course purchasing options: 

Users identified a 'buy-now' style option would make buying courses easier.

3. Refining a Design

_Group_ball.png
_Group_.png
  • Mock Up

  • High - Fidelity Prototype

  • Accessibility

Mockups

Based on the insights from the usability studies, I added a search bar at the top of the screen for users to search specific areas to find games on a single page. 

Screenshot 2022-09-05 at 15.24.29.png

Before Usability Study

Screenshot 2022-09-05 at 15.25.18.png

After Usability Study

Mockups

Screenshot 2022-09-05 at 15.25.18.png

Before Usability Study

A plus button was added to create games, moving users through a simple flow which captures key details when adding matches (location, time, cost).

After Usability Study

Screenshot 2022-09-05 at 15.34.28.png

High-Fidelity Prototype

The high-fidelity prototype followed the same user flow as the low-fidelity prototype, incorporating design changes from the usability study.

Screenshot 2022-09-05 at 15.46.37.png
Screenshot 2022-09-05 at 15.38.58.png

Accessibility Considerations

Clear labels for interactive elements that can be read by screen readers.

Consistent Navigation

ensure that repeated components occur in the same order on each page of a site.

Used icons to
help navigation

easier.

4. Responsive Design

4th pic intro mobile app.png

  • Information Architecture

  • Responsive Design

Site Map

With app designs completed, I designed a responsive website. I used the sitemap to guide the organisational structure of each screen, ensuring a consistent experience across devices.

Screenshot 2022-09-05 at 15.52.05.png

Responsive Designs

The designs for screen variation included mobile and desktop devices. I optimised the designs to fit each device and screen size.

Apple iMac.png
iPhone 13 Pro Max Graphite_4x.png

Take aways

Impact:

 

Users shared that the app would practically help finding and creating matches. 

One quote from feedback was “the app couldn't make getting involved in football simpler.”

What I learned:

This design taught me that taking a consistent approach, being empathetic to user needs and adapting the design accordingly allowed me to create a relevant and useful solution for users.

 

Next Steps

Add more educational courses for users to learn more about the game.

Conduct research on how successful the app is in improving access to the game.

Adding functionality for users to purchase matchday tickets.