oc-coloring-book-cover

Community@sumino/oc-coloring-book-cover
Community skill — not reviewed. It was shared by Jagulus and has not been checked by Neta. Read SKILL.md below before letting an agent use it.
Use it in Cohub

Paste this into your agent's chat — it fetches the skill and follows it.

Use the skill: oc-coloring-book-cover. Run `npx -y @neta-art/neta-search-cli@latest skills use @sumino/oc-coloring-book-cover --via site` and follow what it prints. Read its complete output, redirecting it to a temporary file first if necessary, and resolve relative paths from the skill directory it prints.
Install from a terminal
npx -y @neta-art/neta-search-cli@latest skills use @sumino/oc-coloring-book-cover
Summary

Turn your character into a vintage Halloween coloring-book cover with a title that speaks 12 languages.

  • A tall antique book cover: gold scrollwork frame, dry vines, cobwebs and thorns around a dark fairy-tale scene
  • One full illustrated scene with your character in costume, a carved pumpkin, a black cat, a pale moon and a fitting castle backdrop
  • A blank oval panel up top holds the title, which switches live between 12 languages including Arabic
  • Delivered as a page that looks like a real book, with a leather spine and page edges, not a flat picture
  • Works best with a character who has a clear, distinctive look already established on your canvas
SKILL.md
# OC Coloring Book Cover

A vertical 2 : 3 book cover that looks like an antique Halloween coloring book: an ornate gold baroque frame wrapped in dry vines, cobwebs and thorns; a full, textless dark fairy-tale scene with the OC at its centre; a blank oval parchment cartouche at the top; and live HTML type dropped into that cartouche. Because the title is HTML, the same cover speaks twelve languages.

**Live demo:** https://neta.art/w/sumino/sweet-nightmare-park/blissful-halloween-coloring-book
**Starter:** `templates/` holds the working page (HTML/CSS/JS + fonts); `assets/demo-cover.webp` is the gallery preview.

## What the user gets

- A 2:3 vintage coloring-book cover: baroque gold frame, dry vines, cobwebs, autumn leaves, thorns, and a large empty oval cartouche at the top.
- One generated scene holding the OC's full signature design in a Halloween costume, beside a giant carved pumpkin, an old broom, a black cat with a vintage collar, a pale full moon, bats, a dead tree and a castle suited to the OC's world.
- A live title in the cartouche: localized title, a small kicker line and the OC's name + cycle.
- A single-page web Work that presents the cover as a physical book with a leather spine and page edges.
- Twelve complete locales, system-language detection, English default and fallback, a manual selector, Arabic RTL.
- A published Work and a Board card.

## When to use

Use when the user wants a book-cover-shaped, vintage or coloring-book illustration for one OC, especially:

- "coloring book cover", "涂色书封面", "涂色绘本封面";
- "vintage Halloween cover", "baroque gold frame cover";
- a vertical cover with a title cartouche and a multi-language live title.

Do not use for:

- a horizontal ticket or stub — use `halloween-ticket-keepsake`;
- a long multi-panel narrative storyboard — build a dedicated storyboard work;
- a plain illustration with no web presentation — generate an image only.

## Hard rules

0. **Use the sandbox CLI path.** Every `neta` command is `node /mods/neta/neta …` (`neta` may not be on PATH).
1. **Read the OC before drawing.** Use the world's real atom, cover and `## 形象参考`. Never reuse the demo OC's scene, props or content for another character.
2. **No text in the generated image.** No letters, numbers, title, signature, logo or watermark. The cartouche must be blank. All type is HTML.
3. **The face stays human.** Many OC references carry a skull ornament or skull accessory. Say explicitly: the skull is a small hair clip, not a mask, not a half-skull, not a replacement for cheek, jaw or nose. Regenerate if the face turns skeletal.
4. **One empty oval cartouche, top centre.** Ask for it inside the prompt; do not draw the title area in CSS over a busy scene.
5. **The title is live.** The plate is HTML, positioned inside the oval, and every locale fits without spilling onto the gold.
6. **Twelve complete locales.** English is default and fallback. Every locale has all 8 keys. No half-translated locale, no `undefined`.
7. **Book, not a flat image.** Keep the leather spine, page edges, inner shadow and the slight physical presence.
8. **Publish and place.** A source page without a published Work and a Board card is not shipped. Place the **web Work** card, never the raw artwork.

## Pipeline

### 0. Read the OC and the world

```bash
node /mods/neta/neta atom list --type character
node /mods/neta/neta atom get "world/characters/<Name>.md"
node /mods/neta/neta find images "<Name>"
```

Record:

- the OC's full signature features from the cover and `## 形象参考` — hair, eyes, skin, horns/ears/wings, hands, garment, props;
- 3–5 scene props that belong to the OC's zone (a gallery, a hospital, a carousel, a candy house…);
- the OC's palette: one dominant deep colour, one warm accent, one metal;
- the world name and its existing translations.

### 1. Create the page work

```bash
SLUG="<name>-halloween-coloring-book"     # kebab-case, unique
WORK="works/web/$SLUG"
node /mods/neta/neta work init web "$WORK" --title "<Name> · Halloween Coloring Book"
# The CLI may normalize works/web -> works/webs; use the printed workDir.
```

Copy the starter:

```bash
cp templates/index.html templates/style.css templates/app.js "$WORK"/
cp templates/content.example.js "$WORK/content.js"
cp -r templates/fonts "$WORK/fonts"
mkdir -p "$WORK/assets"
```

`content.js` is the only per-OC data file. Replace every demo value.

### 2. Generate the cover artwork

Read `references/art-direction.md` for the full prompt and pitfalls.

```bash
NETA_DEFAULT_IMAGE_MODEL=gpt-image-2 node /mods/neta/neta generate image \
  --work-title "<Name> · Halloween Coloring Book · cover" \
  --work-description "<one sentence about the cover>" \
  --param size=1536x2304 --param quality=high --param output_format=png \
  --image "world/media/studio/characters/<Name>.png" \
  --prompt "$(cat /tmp/<slug>-cover.txt)"
```

Save and compress:

```bash
curl -sL "<mediaUrl>" -o /tmp/cover.png
magick /tmp/cover.png -strip -quality 84 "$WORK/assets/cover.webp"
```

The artwork is an **ingredient**. Do not place it on the Board.

If the face turns into a half-skull, regenerate with the face sentence repeated last. If the cartouche fills with text, regenerate with "the cartouche is completely empty, no letters". If the frame is thin, ask for "a thick, elaborate baroque gold frame filling the outer eighth of the canvas".

### 3. Fill `content.js`

```js
window.BOOK = {
  name: "BLISSFUL",
  edition: "NO. 01",
  accent: "#b99054",
  langs: { en: { label: "English", short: "EN", dir: "ltr" }, /* … 12 total */ },
  i18n: {
    en: {
      world: "Sweet Nightmare Park",
      kicker: "A dark fairy-tale coloring book",
      title: "Halloween Coloring Book",
      cycle: "897th cycle",
      note: "Color the nightmare.",
      edition: "Coloring Book No. 01",
      language: "Language",
      close: "Close"
    }
    // … 11 more locales, all keys present
  }
};
```

Rules:

- `name` is the OC's proper noun; it stays identical in every locale except where the world already translates it.
- `title` is the cover line. Keep it short to 2–3 lines in a 35 %-wide oval: ≤ 24 Latin characters, ≤ 9 CJK characters.
- `kicker` is a 3–6 word line above the title.
- `cycle` is the OC's canon number/age/cycle, e.g. "897th cycle".
- `edition` is the small top-right line; `note` is the bottom-left line.
- `accent` is the gold or the OC's accent, used for the dot and selected language.
- The page supports `?lang=<code>` for QA/share; a manual choice is saved in `localStorage`.

### 4. Validate and tune the cartouche

```bash
node scripts/validate-i18n.mjs "$WORK"
```

Then open `?debug=1` and check that the red plate rectangle sits inside the parchment oval. If it crosses the gold, adjust in `style.css`:

```css
.plate{left:32.25%; top:4.15%; width:35.5%; height:12.1%}
```

Measure the oval from the generated image with a region grow around the centre-top pixel (the parchment is a warm low-contrast cream), then inset the plate by about 1–2 % on every side. Do not move the plate so low that it lands on the character's hair.

### 5. QA

Follow `references/qa.md`. At minimum:

- 1440×900 and 390×844;
- every locale, including Arabic; the title stays 1–3 lines and inside the oval;
- no `plateOverflowY`, `plateOverflowX`, `out_kicker`, `out_cycle`;
- the cover title is readable at a glance, not a whisper;
- the book keeps its spine and page edges at both sizes;
- no page scrollbars, no missing key, no `undefined`.

### 6. Publish and place

```bash
node /mods/neta/neta work publish web "$WORK"

node /mods/neta/.agents/skills/board-ops/scripts/place.mjs \
  --title "<Name> · Halloween Coloring Book" \
  --work "works/webs/<slug>"
```

The publish returns the share link `https://neta.art/w/<user>/<world>/<slug>`. Verify it with `curl -sI` (200) before calling it live. The thumbnail is scheduled asynchronously.

### 7. Package the skill (optional)

If the user asks for a reusable skill, copy this folder to `.agents/skills-drafts/<skill-name>/`, keep the demo as the worked example, write `SKILL.md` in English even when the world is Chinese, then follow `references/publishing.md` to submit it.

## Content model

```
$WORK/
  index.html
  style.css
  app.js
  content.js            # per-OC data; the only file that changes per character
  fonts/                # Cormorant Garamond, self-hosted
  assets/cover.webp     # generated 2:3 textless cover
```

`index.html` and `style.css` are generic. The cover is `.cover` (container query source) with `.plate` absolutely positioned in the cartouche. The book is `.book` (2:3) plus `.book-spine` and `.book-pages`.

`app.js` handles detection, fallback, the menu, `dir="rtl"` and the QA report. Do not bake a language into the HTML.

## Pitfalls

- Text in the artwork kills the locale switch. Keep the cartouche empty and the title HTML.
- The reference may show a skull hair ornament; the model will happily turn the whole face into a skull. Say "intact human face" twice and regenerate if needed.
- A plate sized to the full oval width will cross the curved gold rim. Inset it.
- A plate too low overlaps the OC's hair or the moon; keep it in the top 4–17 % band.
- A title too large looks strong but spills in German or Russian. Tune per `:lang()` instead of shrinking the whole plate.
- Arabic with letter-spacing breaks the joins. Reset `letter-spacing` under `html[dir="rtl"]` and `:lang(ar)`.
- A flat image on a dark background is not a book. Keep the spine, page edges and shadow.
- A hand-written `preview` block or a `/public` copy is not a publish.

## Demo

The shipped example is blissful from *Sweet Nightmare Park*: a white-haired, cyan-tipped vampire countess with pink spiral eyes, a skull hair clip, one white wing and one black skeletal wing, beside a giant glowing pumpkin, a black cat and an old broom. Title `Halloween Coloring Book`, twelve locales. It is a demo, not a constraint.