Auto-invokedSkill
od-contribute
One-click contribution flow for OpenDesign (nexu-io/open-design) — even for non-coders. Pick one of four cards (ship a Skill or Design System you made with OD;…
@nexu-ioView Skill/swiss-user-research-video-template
Swiss-style user-research narrative template in warm-paper editorial aesthetics. Use when users ask for a premium research deck or story-first live artifact with minimalist typography, high-clarity layout, subtle motion, donut breakdowns, and keyboard/click navigation across
Install
$ npx -y skills add nexu-io/open-design --skill swiss-user-research-video-template --agent claude-codeHow it fires
How this skill gets triggered: by you, by Claude, or both.
- Fires itselfAuto-invocation. Claude auto-loads it when your prompt matches the work.Auto-invocation is when the right skill fires by itself at the right moment, driven by a FLOW.md router and a hook, instead of you invoking it by name. It is the difference between a skill being installed and a skill actually getting used.Read the full definition →
- You can call itInvoke it directly when you want it.
- Slash command
/swiss-user-research-video-template
Context preview
The summary Claude sees to decide when to auto-load this skill.
Swiss-style user-research narrative template in warm-paper editorial aesthetics. Use when users ask for a premium research deck or story-first live artifact with minimalist typography, high-clarity layout, subtle motion, donut breakdowns, and keyboard/click navigation across
SKILL.md
swiss-user-research-video-template.SKILL.mdname: swiss-user-research-video-template
description: |
Swiss-style user-research narrative template in warm-paper editorial aesthetics.
Use when users ask for a premium research deck or story-first live artifact with
minimalist typography, high-clarity layout, subtle motion, donut breakdowns,
and keyboard/click navigation across slides in a single HTML file.
triggers:
- "swiss user research template"
- "editorial research deck template"
- "minimal user research slides"
- "warm paper swiss style"
- "research synthesis template"
- "瑞士风用户研究模板"
- "高级调性研究汇报"
od:
mode: template
surface: video
type: hyperframes
platform: desktop
preview:
type: html
entry: index.html
reload: debounce-100
design_system:
requires: true
sections: [color, typography, layout, components]
outputs:
primary: index.html
secondary:
- template.html
- example.html
example_prompt: "Create a Swiss-style user research synthesis deck with premium minimalist typography, warm paper tone, a participant donut breakdown, and subtle editorial interactions."
capabilities_required:
- file_writeSwiss User Research Video Template
A premium Swiss-editorial user research template for narrative-heavy live artifacts. The visual language is warm paper, strict spacing rhythm, thin rules, and restrained micro-interactions that keep attention on the story.
Resource map
swiss-user-research-video-template/
├── SKILL.md
├── assets/
│ └── template.html
├── references/
│ └── checklist.md
└── example.html
Workflow
1. Read `DESIGN.md`, then map tokens to the template CSS variables (`--paper`, `--ink`, `--muted`, rule colors, segment colors) without changing layout semantics. 2. Start from `assets/template.html`; keep the three-slide structure:
- title / framing
- participant breakdown donut
- behavioral pattern + evidence panel
3. Preserve interactions:
- click/keyboard slide navigation (`ArrowLeft`/`ArrowRight`)
- bottom pagination dots with active state
- donut legend hover highlight
- subtle line-draw and panel-lift transitions
4. Keep all data realistic and internally consistent between copy, donut labels, and percentages. 5. Keep HTML self-contained (inline CSS/JS), with no external framework dependencies. 6. Validate using `references/checklist.md` before output.
Output contract
Emit one concise orientation sentence and then a single HTML artifact:
<artifact identifier="swiss-user-research-deck" type="text/html" title="Swiss User Research Synthesis">
<!doctype html>
<html>...</html>
</artifact>
Read more
name: swiss-user-research-video-template
description: |
Swiss-style user-research narrative template in warm-paper editorial aesthetics.
Use when users ask for a premium research deck or story-first live artifact with
minimalist typography, high-clarity layout, subtle motion, donut breakdowns,
and keyboard/click navigation across slides in a single HTML file.
triggers:
- "swiss user research template"
- "editorial research deck template"
- "minimal user research slides"
- "warm paper swiss style"
- "research synthesis template"
- "瑞士风用户研究模板"
- "高级调性研究汇报"
od:
mode: template
surface: video
type: hyperframes
platform: desktop
preview:
type: html
entry: index.html
reload: debounce-100
design_system:
requires: true
sections: [color, typography, layout, components]
outputs:
primary: index.html
secondary:
- template.html
- example.html
example_prompt: "Create a Swiss-style user research synthesis deck with premium minimalist typography, warm paper tone, a participant donut breakdown, and subtle editorial interactions."
capabilities_required:
- file_writeSwiss User Research Video Template
A premium Swiss-editorial user research template for narrative-heavy live artifacts. The visual language is warm paper, strict spacing rhythm, thin rules, and restrained micro-interactions that keep attention on the story.
Resource map
swiss-user-research-video-template/ ├── SKILL.md ├── assets/ │ └── template.html ├── references/ │ └── checklist.md └── example.html
Workflow
1. Read `DESIGN.md`, then map tokens to the template CSS variables (`--paper`, `--ink`, `--muted`, rule colors, segment colors) without changing layout semantics. 2. Start from `assets/template.html`; keep the three-slide structure:
- title / framing
- participant breakdown donut
- behavioral pattern + evidence panel
3. Preserve interactions:
- click/keyboard slide navigation (`ArrowLeft`/`ArrowRight`)
- bottom pagination dots with active state
- donut legend hover highlight
- subtle line-draw and panel-lift transitions
4. Keep all data realistic and internally consistent between copy, donut labels, and percentages. 5. Keep HTML self-contained (inline CSS/JS), with no external framework dependencies. 6. Validate using `references/checklist.md` before output.
Output contract
Emit one concise orientation sentence and then a single HTML artifact:
<artifact identifier="swiss-user-research-deck" type="text/html" title="Swiss User Research Synthesis"> <!doctype html> <html>...</html> </artifact>
Ships withopen-design
🎨 Best DeepSeek Harness Design Plugin. 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 / DeepSeek Harness / OpenCode & 20+ CLIs via BYOK.
Get the whole plugin, auto-invoked
Stats
95,466
Stars
11,063
Forks
Active
Maintenance
TypeScript
Language
Apache-2.0
License
4d ago
Last commit
4mo ago
Created
Repo: nexu-io/open-design
Other skills on open-design.
@nexu-ioView SkillAuto-invokedSkill
8-bit-orbit-video-temp…
Hyperframes-based video template for retro pixel deck motion design. Use when users want a high-fidelity, multi-scene HTML-to-video composition with advanced…
@nexu-ioView SkillAuto-invokedSkill
ad-creative
Generate and iterate ad creative including headlines, descriptions, and primary text. Useful for paid social and search ad iteration.
@nexu-ioView SkillAuto-invokedSkill
after-hours-editorial-…
Luxury dark-editorial HyperFrames template for three-page cinematic storyboards, inspired by haute couture title cards and magazine chapter spreads. Use when…
@nexu-ioView SkillAuto-invokedSkill
agent-browser
Browser automation CLI for AI agents. Use when the user needs to inspect, test, or automate browser behavior: navigating pages, filling forms, clicking…
@nexu-ioView SkillAuto-invokedSkill
ai-music-album
Full-lifecycle AI music album production — concept, lyric drafting, track sequencing, and export. Useful for indie album experiments and brand soundtracks.
@nexu-ioView Skill