CASE STUDY 01 — SPORTS MEDIA · DIGITAL PLATFORM

WAVA: one region, a stronger game.

Reimagining West Asian volleyball as a contemporary digital destination for fans, teams, competitions and regional community — not a traditional federation site.

UX STRATEGYVISUAL SYSTEMRESPONSIVE UIWEB · SAAS PATTERNS
← Back to workOpen prototype →
WAVA opening screen design in FigmaWAVA website home page design in Figma

01 — PROBLEM STATEMENT

Volleyball had momentum, but no home.

Competitions, teams, players, fixtures and news lived in disconnected places. Fans could not follow a season, federations could not tell a regional story, and the product felt institutional instead of energetic and credible. The brief needed a single platform that balances federation authority with sports-media excitement, in English and Arabic.

02 — USER PERSONA

Built for fans, teams and editors.

FAN — FOLLOWERRashid, 24 · Doha

Wants live scores, upcoming matches, and player stories in 30 seconds on mobile. Frustrated by scattered updates.

EDITOR — PUBLISHERMaria, 32 · Federation media lead

Needs to publish news, fixtures and results fast without breaking layout, in EN + AR, with consistent imagery.

03 — SOLUTIONS

Structure first, then energy.

Match-centred IA

Home → Live / Match Centre → Competitions → Teams → News. Frequently accessed info first.

Editorial hierarchy

Hero story, live strip, up-next cards, competition hubs. One strong message per view.

Bilingual-ready system

RTL-aware grid, mirrored icons, scalable type and scores that survive Arabic switch.

04 — DESIGN SYSTEM

UI Design

Colors & Typography

D4FF3D
0E1112
14807A
FFFFFF
3B9B90
30AD61
E5202E
244E50
D9DCD8

Archivo

BoldExtraBold

Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp Qq Rr Ss Tt Uu Vv Ww Xx Yy Zz

1 2 3 4 5 6 7 8 9 0

Body & UI: Inter — Regular · Medium · Semi Bold

Design System

Buttons
StatusLIVEUpcoming
Filter chips
IndoorBeachSeniorU-20U-17
Match ticker
QAT 3–0 KUWSenior Men
Federation card
QatarDoha · Host HQ
View →
Data table
#PlayerPts
1Player One245
2Player Two231

05 — USER FLOW

From arrival to match night.

01 ARRIVEHero sets one message: One region. A stronger game.
02 CHECK LIVEMatch Centre strip shows set, time, score.
03 PLANUp-next cards: date, teams, venue, details.
04 EXPLORECompetitions, teams, rankings hubs.
05 RETURNNews + video keeps the loop alive.

06 — FINAL DESIGN OUTPUT

Desktop home that ships.

WEST ASIA VOLLEYBALLONE REGION.
A STRONGER GAME.

Hero + live match centre + fixtures + editorial band + news + footer. Full responsive system, componentized for handoff.

07 — ALL SCREENS

Every screen,
end to end.

Only the screens linked in the live prototype — from the opening sequence and live match strip to federations, players and media — built on one design system.

Open prototype →
WAVA homepage
WAVA federation detail
WAVA contact
WAVA opening screen
WAVA player detail
WAVA assistant, expanded
WAVA live and results
WAVA opening screen 3
  • ↗One region, one home.
  • ↗Live scores first.
  • ↗Federations and players.
  • ↗Built to scale.
WAVA media centre
WAVA loading screen
WAVA news
WAVA about