Information architecture
The structure of the XSERIES website. This page brings together the decisions in Digital product, so every page in the sitemap has a reason, a phase, and references.
Where this structure comes from
The information architecture is the conclusion of the Digital product section. Fan stages decide which pages are needed, features decide when they are built, and references show what they look like. The result is used to fill the content and design the screens.
- Six stages, from aware to waiting for the next editionUser journey, Personas
- Must, Should, Could per phase, and the patterns we takeFeatures & priorities, Product references, Predict & Back
- Sitemap, navigation, and Home orderThis page
- CMS entities and the design of each pageContent model & CMS, UI direction
Sitemap
The label on the right shows when the page is built (Features & priorities): Phase 1 before the event, Phase 2 during the event, Phase 3 after the event.
/Phase 1Home: current edition, countdown, ticket CTA, highlights/xs3Phase 1XS-3 edition hub "The Unorthodox"/xs3/fixturesPhase 1Schedule and bracket/xs3/ticketsPhase 1Ticket types, prices, seat map, then on to GOERS/xs3/livePhase 2Live match companion + Predict & Back, during the event
/how-to-playPhase 1XBall: rules, 24 seconds, X Cards, President Cards/cards/[slug]Phase 1One shareable page per card
/teamsPhase 14 teams/teams/[slug]Phase 1Team profile, creator owner, roster, colors, history
/playersPhase 1All players, filter by rank, team, category/players/[slug]Phase 1Player card, bio, editions, moments
/archivePhase 1All editions/archive/xs1, /xs2Phase 1Rosters, results, MVP, highlights
/newsPhase 1News and announcements/faqPhase 1FAQ on tickets, venue, broadcast/partnersPhase 1Sponsors and media kit/pressPhase 1Releases, official assets, media contact
/joinPhase 1–3Waitlist (Phase 1), then fan account, points, and levels (Phase 3)
Phase 1 = before the event (hub website), Phase 2 = during the event (live match companion), Phase 3 = after the event (archive and fan accounts). Pages behind the left line are children of the page above them.
Why each page exists
Every page in the sitemap can be traced to a fan stage, a feature, a goal, and an HMW challenge. A page with no reason in this table should not be built.
Main navigation
The menu is built for the main personas. The Tickets button is always in the header, as on Baller League.
| Item | Purpose | Persona |
|---|---|---|
| XS-3 | Current edition: schedule, tickets, live | All |
| How to Play | Understanding the cards | Nadia, Raka |
| Teams | Picking a side | Nadia, Raka |
| Players | Following the stars | Dimas, Raka |
| Archive | History and results | Dimas, Bayu |
| Tickets (button) | Conversion | All |
Footer: FAQ, Partners, Press, Instagram, YouTube, TikTok, Games of Society.
Home contents (in order)
The order follows the fan stages: aware, understand, decide, then stay connected.
| # | Block | Why it is here |
|---|---|---|
| 1 | Current edition hero: name, date, venue, countdown, Tickets button | Measurable tickets · next match + countdown |
| 2 | "What is XSERIES" in one sentence + teaser video | Get XSERIES in 10 seconds · viewers from a reel understand in 10 seconds |
| 3 | Cards: a carousel of X Cards with their effects | Understand the rules · icon + one-line effect |
| 4 | Featured players (rank A) | Connected outside the season · the stars people look for |
| 5 | The four teams | Care about teams · the creator owner is the face of the team |
| 6 | Short schedule and prices | Buy tickets · one line that ends the confusion |
| 7 | Latest news | Position in SEA · an official source for the media |
| 8 | Waitlist | Own audience · waitlist on the first screen |
| 9 | Partners | Digital sponsors · room for sponsors without hurting conversion |
Tip
Validate the navigation with a simple tree test (5–8 tasks, for example "Find the Lower Tribune price for the final") before high-fidelity design.
Next
- Content model & CMS: the entities and fields that fill every page above.
- UI direction: the design of Home, the live match companion, and the card component.
- KPIs & measurement: how to measure whether each page works.
How this page connects
Pages this one builds on, and other pages that use it.