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:
| Section | Content | Question answered |
|---|---|---|
| Research | Facts, data, audits, competitors, sources | What do we know? |
| Strategy | Positioning, SWOT, opportunities, personas, product, KPIs | Where are we going and why? |
| Visual Direction | Brand audit, palette, typography, UI, motion | What should it feel like? |
Evidence rules
Every page follows the same rules:
- Every claim has a source. A link to an article, account, or official page, or a screenshot in
assets/evidence/. - 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.
- Dates are always written. Social media numbers change, so every number has the date it was collected.
- 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:
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...Add the entry
{ "slug": "sponsor-xs3", "title": "Sponsor XSERIES-3" }to the matching group innav.json.Save evidence images in
assets/evidence/and reference them with. Several images in one paragraph automatically become a gallery.Run
npm run build(ornpm run serveto build and open athttp://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.