Field notes editorial template
Skill nexu-io/open-design/skills/field-notes-editorial-template
π¨ The open-source Claude Design alternative. π₯οΈ Local-first desktop app. πΌοΈ Your coding agent becomes the design engine: prototypes, landing pages, dashboards, slides, images & video β real files, HTML/PDF/PPTX/MP4 export. π€ Claude Code / Codex / Cursor / Gemini / OpenCode / Qwen & 20+ CLIs via BYOK.
npx -y skills add nexu-io/open-design --skill field-notes-editorial-templateAssembled from the repository path, not quoted from the project. Check it against their README if it does not work.
What its author says it does
Copied from the file, not written here
Editorial "Field Notes" report template with soft paper background, serif hero typography, rounded pastel insight cards, and a retention chart panel. Use when users ask for a premium magazine-style business report, board memo one-pager, or elegant data storytelling layout.
SKILL.md
2.3 KB, as published. Nobody here has run it
Field Notes Editorial Template
Produce a premium editorial data report in a single self-contained HTML file.
Resource map
field-notes-editorial-template/
βββ SKILL.md
βββ assets/
β βββ template.html
βββ references/
β βββ checklist.md
βββ example.html
Workflow
- Read active
DESIGN.mdand map palette/typography to root CSS variables. - Copy
assets/template.htmltoindex.htmlas the working artifact. - Keep the editorial frame language:
- paper-like background and subtle vignette
- serif display headlines plus clean sans-serif body copy
- rounded pastel metric / insight cards
- chart panel with legend and axis labels
- Keep interactions lightweight and presentation-safe:
- page view switcher (metrics / insights / retention)
- number count-up animation for key metrics
- chart line reveal animation
- Use honest placeholders (
βor neutral labels) where data is unknown. - Validate against
references/checklist.mdbefore emitting.
Output contract
One short orientation sentence, then:
<artifact identifier="field-notes-editorial" type="text/html" title="Field Notes Editorial Report">
<!doctype html>
<html>...</html>
</artifact>