Designs

Photos

Films

About Me

Designs

Photos

Films

About Me

Ludimos · 2025/26

Making AI Cricket Analytics Clear Enough to Coach With

Making AI Cricket Analytics Clear Enough to Coach With

Making AI Cricket Analytics Clear Enough to Coach With

Ludimos analyses every delivery and shot from a single phone camera — speed, line, length, footwork, connection. I redesigned the end-to-end product across mobile, iPad, and web, from the recording flow to the coach's dashboard.

Ludimos analyses every delivery and shot from a single phone camera — speed, line, length, footwork, connection. I redesigned the end-to-end product across mobile, iPad, and web, from the recording flow to the coach's dashboard.

Role

Role

Lead UI Designer

Lead UI Designer

Timeline

Timeline

2025-2026 (Ongoing)

2025-2026 (Ongoing)

Team

Team

1 Designer, 2 Engineers, 1 PM

1 Designer, 2 Engineers, 1 PM

Platform

Platform

iOS · Android · iPad · Web

iOS · Android · iPad · Web

Download the live product from their website ->

Download the live product from their website ->

Problem

A powerful tracking engine buried in dense data

A powerful tracking engine buried in dense data

The product already captured a rich stream of data per ball — speed, length, line, deviation, release point, shot type, footwork, connection — plus a coach-side business layer (assessments, reports, notes, payments, bookings). The challenge wasn't capturing the data; it was making it legible in seconds, courtside on a phone, and equally usable at a desk on a web dashboard.

The product already captured a rich stream of data per ball — speed, length, line, deviation, release point, shot type, footwork, connection — plus a coach-side business layer (assessments, reports, notes, payments, bookings). The challenge wasn't capturing the data; it was making it legible in seconds, courtside on a phone, and equally usable at a desk on a web dashboard.

01

Dense analytics.

Pitchmap, beehive, wagon wheel, release and length metrics competing for attention.

Pitchmap, beehive, wagon wheel, release and length metrics competing for attention.


02

Fragile recording.

Calibration and detection can fail; users need clear, recoverable feedback in the moment.

Calibration and detection can fail; users need clear, recoverable feedback in the moment.


03

Two roles, three platforms.

Players and coaches need different views, but it must feel like one product on phone, tablet, and web.

Research / Discovery

Understanding the data before designing the screen

Understanding the data before designing the screen

The UX part was mainly provided by the engineers and the product owners. However I made my own design research before I came to any design direction. I have done few competitive analysis and studied the designs of similar products.

The UX part was mainly provided by the engineers and the product owners. However I made my own design research before I came to any design direction. I have done few competitive analysis and studied the designs of similar products.

What I extracted

Source

Ball-tracking outputs

Finding

Bowling (speed, length, line, deviation) and batting (shot, footwork, connection) data per clip.

Design decision

Every metric is paired with a visual — pitchmap, beehive, release plot, wagon wheel — so patterns are read, not calculated.

Source

Coach workflows

Finding

Notes (voice, drawn, text), assessments, performance reports, payments, products, bookings.

Design decision

Everything hangs off the player profile as tabs, so a coach never leaves the context of the player.

Source

Recording constraints

Finding

The phone is propped at the net; calibration depends on both sets of stumps being visible.

Design decision

Calibration states use colour AND text — white = ready, green = calibrated, red = failed — with a specific message per failure.

Ideation

One core loop, two roles, three platforms

One core loop, two roles, three platforms

Everything in the product flows through one loop — set up a session → calibrate → record → AI detects clips → review analytics → annotate → generate reports. Players and coaches enter that loop differently, but it is the same loop. Once it was solid, the platform adaptations (app, iPad, web) became a question of layout and density, not new interaction patterns.

Everything in the product flows through one loop — set up a session → calibrate → record → AI detects clips → review analytics → annotate → generate reports. Players and coaches enter that loop differently, but it is the same loop. Once it was solid, the platform adaptations (app, iPad, web) became a question of layout and density, not new interaction patterns.

The shared core loop

Setup

Calibrate

Record

AI detects clips

Review analytics

Annotate

Generate report

Player entry point

Home · Videos · Record · Notes · Drills

Home · Videos · Record · Notes · Drills





Coach entry point

Home · Video Analysis · Drills · Dashboard · Groups · Schedule · Assessments

Whether it's a player's first net session or a coach reviewing their 50th, the screen has to answer one question first: what should I look at?

Whether it's a player's first net session or a coach reviewing their 50th, the screen has to answer one question first: what should I look at?

Design principle

A single Record Setup screen (coaching account, group, mode, pitch length, players, conditions, goals) feeds a guided calibration → live → detected-clips sequence.

A single Record Setup screen (coaching account, group, mode, pitch length, players, conditions, goals) feeds a guided calibration → live → detected-clips sequence.

Early explorations and wireframes.

Designs

The experience, screen by screen

The experience, screen by screen

5.1

Recording & Calibration

Recording & Calibration

A guided setup and a calibration flow with seven clear states, so users always know whether the camera is ready, live, or needs to be recalibrated — and why.

A guided setup and a calibration flow with seven clear states, so users always know whether the camera is ready, live, or needs to be recalibrated — and why.

Seven calibration states, each with a unique colour and text message. No dead-ends.

5.2

Clip Playback & Review

Ball trajectory overlaid on the video, bowling metrics on one side and batting metrics on the other, with a note bar for voice or text feedback — the whole review in one frame.

Ball trajectory overlaid on the video, bowling metrics on one side and batting metrics on the other, with a note bar for voice or text feedback — the whole review in one frame.

Every delivery reviewed in context: trajectory, stats, and annotation in one screen.

5.3

Session Analytics

A bottom-sheet analytics layer with Pitchmap, Beehive, Batting wagon wheel, and List view, filterable by batter and bowler.

A bottom-sheet analytics layer with Pitchmap, Beehive, Batting wagon wheel, and List view, filterable by batter and bowler.

Four visualisation modes on a single bottom sheet. Consistent across app and web.

5.4

Player Dashboard & Profile

Sessions, balls played, balls bowled, weekly activity, goals, teams, and events at a glance, with Activities, Assessments, and Reports one tap away.

Sessions, balls played, balls bowled, weekly activity, goals, teams, and events at a glance, with Activities, Assessments, and Reports one tap away.

The player’s full history on one profile. Tabbed to keep context, never to hide information.

5.5

The Coaching Layer

Where the product becomes a coach’s operating tool: voice, drawn, and text notes on clips, plus payments, products, and bookings — each with clear status states (Paid, Partial, Unpaid, Void; Confirmed, Pending).

Where the product becomes a coach’s operating tool: voice, drawn, and text notes on clips, plus payments, products, and bookings — each with clear status states (Paid, Partial, Unpaid, Void; Confirmed, Pending).

Status colours used only for meaning. Every state has a label as well as a colour.

5.6

Web & iPad

The same system at desk scale: a persistent sidebar, a card-grid dashboard, and a coach mode with a player switcher, search, and group filters. Session analytics gets a side-by-side video panel and a slide-over Filters panel with removable applied-filter chips.

The same system at desk scale: a persistent sidebar, a card-grid dashboard, and a coach mode with a player switcher, search, and group filters. Session analytics gets a side-by-side video panel and a slide-over Filters panel with removable applied-filter chips.

Web layout at full width. The sidebar persists; density increases without a new mental model.

Design System

A system built for legibility under pressure

A system built for legibility under pressure

Because the product is used at the net and at a desk, the UI needed to stay legible outdoors, one-handed, and on a wide dashboard. Dark surfaces reduce glare, a single violet accent marks actionable and active states, and status colours are used only for meaning.

Because the product is used at the net and at a desk, the UI needed to stay legible outdoors, one-handed, and on a wide dashboard. Dark surfaces reduce glare, a single violet accent marks actionable and active states, and status colours are used only for meaning.

Colour — approximate tokens, replace with real values

Near-black surface

#0D0B14

Primary background

Violet accent

#7C3AED

Active states & CTAs

Lilac mid

#8B5CF6

Gradients & highlights

Teal / Paid

#0D9488

Success & paid status

Amber / Pending

#D97706

Pending & partial

Red / Failed

#DC2626

Failed & unpaid

Components

Bottom tab bar

Stat tiles

Segmented toggles

Filter chips

Note cards (voice · text · drawn)

Status cards

Calibration frame states

Pitchmap

Beehive

Wagon wheel

Style tile from the Figma component library.

Lessons

What this project taught me about designing analytics for sport

What this project taught me about designing analytics for sport

When a product measures everything, the interface’s main job is deciding what to show first. Hierarchy matters more than volume of data — the most useful screen is rarely the most complete one.

When a product measures everything, the interface’s main job is deciding what to show first. Hierarchy matters more than volume of data — the most useful screen is rarely the most complete one.

Reusing the same visualisations — pitchmap, beehive, wagon wheel — across app and web meant users learn to read them once and trust them everywhere. Consistency isn’t just a design principle here; it’s what makes the coaching feedback stick.

Reusing the same visualisations — pitchmap, beehive, wagon wheel — across app and web meant users learn to read them once and trust them everywhere. Consistency isn’t just a design principle here; it’s what makes the coaching feedback stick.

Designing for two roles across three platforms works best when the underlying loop stays the same and only density and layout change. A shared mental model across player and coach, phone and desktop, is what makes the product feel like one thing.

Designing for two roles across three platforms works best when the underlying loop stays the same and only density and layout change. A shared mental model across player and coach, phone and desktop, is what makes the product feel like one thing.