The website

Consolidated on 2026-10-13 from the design work of 2026-10-11 and 2026-10-12.

The site shows a place to spend time, then the companions who live there, and only then installation, AI choices and developer information. It speaks the same four languages as the app. This record holds the site's structure and the reasons for it; editing and checking the site is in Edit and check the website, and the decision to publish one VitePress site on GitHub Pages is its own record.

Four languages and their parity

SITE_LANGS in scripts/site-content.mjs is the one list: English at the site root, Korean (/ko/), Japanese (/ja/) and Simplified Chinese (/zh-hans/). Each has the landing page, the same eleven guide pages (including the creator studio), the release index and the release pages. Every interaction and message on the landing and in the components exists in all four (landing-<language>.ts, words.ts). A change to a page in one language has its counterparts in the other three.

Developer documentation stays in English. It is copied from docs/ into the generated website/dev/ at build time, and switching language there leads to the English page with its query and fragment kept.

Localized pages have reciprocal hreflang alternates and a self canonical (website/.vitepress/locale-head.mjs); a page that does not exist in a language gets no invented alternate. Korean keeps whole words on a line (keep-all), while Japanese and Chinese use normal CJK line breaking with their own system fonts.

A world-first landing

An earlier page gave technical setup too much room and showed mostly autumn. The landing (Landing.vue) now runs in this order:

1. A short promise, a download action, a link to the companions and the three platforms.
2. A large real app capture with a manual six-scene picker: Spring, Summer, Autumn, Winter, City day and City night (WorldPreview.vue). There is no automatic carousel and no simulated terminal competing with it.
3. The companion gallery (PetGallery.vue).
4. The mini window and desktop friends.
5. AI choices with their cost and privacy in plain language; setup details sit behind a disclosure.
6. The creator studio and community discovery.
7. Privacy, with developer information behind a disclosure.
8. Downloads, the current release page and GitHub.

The scenery-first hierarchy took cues from the official sites of cozy online games; PlayPets uses only its own artwork and real captures. The landing uses mist white, deep green text and a pale lilac companion stage (landing.css); the site keeps paper #fbfcf5, forest ink #244d43, moss, sky and thin green lines, with Gowun Dodum for display, Pretendard for body text and JetBrains Mono for code (style.css). Shared guide and download styles stay in style.css. No fabricated popularity numbers appear.

The companion gallery

All ten companions are individually selectable, in the order of LANDING_PETS in scripts/site-content.mjs, Daisy first. The shelf stays still; only the selected preview animates. Preview rows, frame counts and loop lengths come from the app's own animationSpec (src/core/animation.js), so there is no second timing table. The gallery loads the sheets only when it comes into view, stops the preview offscreen, and honours the page's pause control and the reduced-motion preference. Each companion links to its creator kit, keeping the visitor's choice.

The creator studio

The studio is a destination with its own main navigation entry in every language, at the existing guide address (/guide/creator-kit and its translations). A visual shelf selects one of the ten pets; the selected pet leads straight to task prompts, usable references and downloads, in that order, because the prompts are the most useful action and large images used to bury them. On narrow screens selection comes first, with no horizontal page scroll. The working character reference sits beside its next prompt.

• The ?kit= query keeps the choice bookmarkable. Older kit ids stay as aliases (aria-realistic is the full-size Aria, aria is Aria Mini, and the same for Noah); an unknown id opens Aria Mini (kitFromQuery in scripts/creator-specs.mjs).
• Aria, Aria Mini, Noah, Noah Mini and Clover have detailed turnaround and face references. Daisy, Pip, Tabby, Smoky and Mochi start from their accepted animation cells. The page shows which materials exist and never labels a runtime collage a full turnaround or promises a seasonal file a pet does not have.
• Each kit offers five prompt stages (identity, face detail, wardrobe, one motion or gaze row, export and validation), a design kit ZIP and an importable pet ZIP. ExtensionPrompts.vue builds the same five stages for any owned or permitted pet; its entered metadata is quoted as data, never instructions.
• Prompts do not guarantee identity or animation quality; preview and validation stay part of the flow. The contract a kit has to meet is in the companions record.

Release pages and downloads

Release pages live at website/releases/<version>.md and the same path in each language. A release note keeps the scope it had when written and points to the current guides. A page without a date in its front matter is a draft: its links lead to the GitHub releases index rather than to a tag or installer files that do not exist yet (ReleaseLinks.vue, Downloads.vue).

Downloads.vue asks the GitHub API for the latest release in the browser and offers only files that release actually has, picking the visitor's platform and architecture. If the lookup fails, the button leads to the releases page: a 404 means nothing is released yet, and any other failure only says where the files are. No file URL is invented.

Captures and shared artwork

Site screenshots are real app captures in every site language, under website/public/shots/<version>/<language>/, with sixteen named scenes per language. npm run shots (macOS) makes them with isolated app data and a scripted local AI; captures never replace a developer's own yard. It targets only the isolated app's window, matched by process and bounds, composes a controlled backdrop behind transparent corners, parks the pointer and clears transient focus first, and stops if the window is missing or ambiguous. Screenshots are not retouched to hide app behaviour. The English pass also records assets/demo.gif.

npm run og makes the four share cards (og.png, og-ko.png, og-ja.png, og-zh-hans.png) and the README banner; npm run art makes the Linux listing images from the English captures. The favicon URLs carry a hash of assets/icon.svg (website/.vitepress/config.mts), so a changed icon is not hidden by a cached tab icon.

One publishing inventory

scripts/site-content.mjs supplies the languages, locale paths, release page paths and the ten public pet sources. Site preparation, captures and release validation all read it, so adding a language or a pet changes one list (Add a language). website/public/pets/, website/public/creator-kit/, website/public/yard/ and website/.vitepress/generated.json are generated and never edited by hand.

Checks

tests/website.test.mjs, tests/website-ja.test.mjs, tests/landing.test.mjs, tests/site-content.test.mjs, tests/words.test.mjs, tests/creator-interface.test.mjs, tests/favicon.test.mjs and tests/shots.test.mjs cover parity, the landing, the studio, favicons and captures. npm run site:build fails on a dead link.

Follow-up: current catalog (2026-10-15)

The public companion gallery and creator studio now offer Daisy, Clover and Pip. The older ten-character catalog above is a historical record, not the current export list. Accepted source art and saved-friend compatibility remain; see Companion artwork.