In this article

About these docs

Who these docs are for, how to read them, the evidence rules, and how to add new pages.


Purpose

These docs are the working base for building the XSERIES website and digital product. The content is split into three parts, matching the options in the Select section dropdown in the header:

SectionContentQuestion answered
ResearchFacts, data, audits, competitors, sourcesWhat do we know?
StrategyPositioning, SWOT, opportunities, personas, product, KPIsWhere are we going and why?
Visual DirectionBrand audit, palette, typography, UI, motionWhat should it feel like?

Evidence rules

Every page follows the same rules:

  1. Every claim has a source. A link to an article, account, or official page, or a screenshot in assets/evidence/.
  2. Separate facts from assumptions. Facts are written plainly. Assumptions are labeled "likely" or put in a Note callout. Recommendations belong in Strategy and Visual Direction, not in Research.
  3. Dates are always written. Social media numbers change, so every number has the date it was collected.
  4. Page status is shown under the title: Terverifikasi (Verified: facts with sources), Draft (may still change), Hipotesis (Hypothesis: recommendations that need validation).

Evidence

A callout like this marks visual evidence or a direct quote from a source.

How to add a page

This site is built from markdown files. The folder structure:

site/
├── nav.json                  # order of sections, groups, and pages in the sidebar
├── content/
│   ├── research/*.md
│   ├── strategy/*.md
│   └── visual-direction/*.md
├── assets/evidence/          # screenshots and evidence media
├── build.mjs                 # turns markdown into static HTML
└── dist/                     # build output (do not edit by hand)

Steps:

  1. Create a new file, for example content/research/sponsor-xs3.md, with frontmatter:

    ---
    title: Sponsor XSERIES-3
    intro: Daftar sponsor yang diumumkan untuk XS-3.
    updated: 15 Des 2026
    status: Draft
    ---
    
    ## Bagian pertama
    Isi...
    
  2. Add the entry { "slug": "sponsor-xs3", "title": "Sponsor XSERIES-3" } to the matching group in nav.json.

  3. Save evidence images in assets/evidence/ and reference them with ![alt](/assets/evidence/nama.jpg "Caption dan sumber"). Several images in one paragraph automatically become a gallery.

  4. Run npm run build (or npm run serve to build and open at http://127.0.0.1:4417).

Writing features

  • Callout: > [!NOTE], > [!TIP], > [!IMPORTANT], > [!WARNING], > [!CAUTION], and > [!EVIDENCE].
  • Color swatch: write a hex code inside backticks, for example #22d3e6, and its color chip appears automatically.
  • Evidence gallery: place several images in a row with no blank lines between them. Click an image to enlarge it.
  • Copy markdown: the button under the title copies the page content as markdown, useful for pasting into a brief or an AI prompt.
  • Search: press / anywhere.