Documentation

Quickstart

From the zip to a site on the internet, in about ten minutes.

Ten minutes from the zip to a site on the internet with your company's name on it. No build tools, no accounts, nothing to install.

If you would rather understand the shape of the thing first, read the four formats. This page just gets you moving.

1. Open it

Unzip the download. You get one folder per format plus source/:

html/      the site, already built
hugo/      a Hugo theme
jekyll/    a Jekyll site
jbake/     a JBake project
source/    the generator behind all four
docs/      these guides, offline

Double-click html/index.html. It opens in your browser and works: navigation, dark mode, the product catalogue with its search and filters, the 3D globe. No server, no network. That is the whole product, running.

2. Put your name on it

Open source/content/site.json in any text editor. The first few lines:

{
  "brand": { "name": "Adjuvant", "suffix": "Bio" },
  "tagline": "Medicine security, engineered end to end.",
  "description": "Adjuvant Bio is a fictional demonstration brand ..."
}

Change those three values to yours.

3. Rebuild

cd source
python3 build-core.py     # design tokens and assets
python3 build-site.py     # content model into the HTML site

Python 3 is already on macOS and Linux. On Windows it is a free download from python.org. Nothing else is needed: no npm, no package.json, no Sass.

Reopen html/index.html. Your name is on every page, in the navigation, the footer, the page titles, the Open Graph tags and the schema.org block. One edit, 36 pages.

4. Put it online

Drag the contents of html/ onto any host that serves files. Netlify and Cloudflare Pages both take a folder by drag and drop and give you a URL in under a minute. Shared hosting, S3, GitHub Pages and a Raspberry Pi all work the same way, because there is nothing to run.

That is a live site. Everything below is optional.

5. Make it yours

Three edits cover most of what people want on day one.

The colour. source/tokens/tokens.json, change color.brand.primary, run build-core.py. Buttons, links, focus rings, badges, charts, the globe and the molecule all follow, in light and dark mode, because they all read the same variable. Full table in theming.

The words on the home page. source/content/home.json. Each top-level key is one band of the home page: hero, ribbon, mandate, network, pipeline, science, news, contact, partnering. Change a string, rebuild, and it appears everywhere that string is used.

The products. source/content/products.json. Add an object and you get a catalogue row, a full detail page, a schema.org Drug block and a sitemap entry, and the category filters pick up any new category on their own.

You want toRead
Understand how the pieces fitArchitecture
Know what every field doesContent model
Build a page out of sectionsSection catalogue
Change colours, type or spacingTheming
Use Hugo, Jekyll or JBake insteadThe four formats
Turn off an animationBehaviour
Deploy somewhere specificDeploying
Work out why something brokeTroubleshooting

A caution worth reading now

Every company, person, product, NDC number and figure in the demo is invented, and the leadership photographs are illustrations rather than people. That is deliberate: a pharmaceutical template shipping real-looking regulatory data is a liability for whoever publishes it. Replace the content before you launch, not after.