Design, review, and debug agent workflows, and decide when a request should use a prompt, instruction, skill, agent, or hook before escalating to multi-agent design. Use for .agent.md / .instructions.md / .prompt.md / AGENTS.md work, workflow architecture, orchestration planning, scheduled automation model allocation, or when agent workflows may be overkill. Triggers on 'agent workflow', 'create agent', 'automation models', 'ワークフロー設計', 'orchestrator'.
html-pdf-slides
Make good-looking slide-style PDFs fast with HTML + headless Chrome instead of PowerPoint: a ready 1280x720 template (Microsoft-style cover / content slide / ending), a render script that outputs PDF + per-page PNG and detects overflow, and design rules for dense one-page slides. Use when asked to quickly create a PDF slide deck, one-page explainers, customer handouts, or "PowerPoint-less" slides, or to bundle cards/info into a branded PDF. Not for editing existing .pptx files or template-based PPTX generation.
含まれるファイル(5)
- SKILL.md3.1 KB
- assets/deck-template.html3.7 KB
- LICENSE.txt269 B
- references/rendering-notes.md1.7 KB
- scripts/render-deck.mjs3.0 KB
SKILL.md(原文)
インストールする前に、エージェントに与えられる指示の中身を確認できます。
HTML → PDF Slides
Write each slide as HTML, render with Chrome. You get precise layout, selectable text, live links, and no PowerPoint automation. Pitfalls and merge/font details: Rendering Notes.
When to Use
- 「PDF でスライドをさっと作りたい」「1 枚で完結する解説ページ」「顧客向けに綺麗な PDF」
- 元データ(JSON など)から同じ見た目のページを大量に作りたい
- PPTX の編集は不要で、配布物は PDF(+任意で PNG)でよい
Quick Start
- Copy assets/deck-template.html; keep one
<section class="page">per page (1280×720 px). Page kinds: cover, content (page slide), ending. - Fill content. Content slides need
data-key(for reports), a.ftfooter, and use.cardblocks so overflow can be measured. - Render:
node scripts/render-deck.mjs deck.html out(needsplaywright-core+ a Chrome/Edge; setCHROME_PATHif not auto-found). Output:out/<name>.pdf,out/<name>-pN.png,out/<name>-report.json. Exit code 1 = a slide overflows. - Look at the PNGs (cover, a dense slide, ending) before reporting done.
Design Rules
- One slide = one question and one takeaway; title states the claim, a one-line subtitle supports it.
- Fixed 3-box info strip under the title for explainers: 誰に関係するか (bold the target) / 嬉しい点 / 対応の要否.
- Fill the page with useful content in cards (what changes, how it works, limits, glossary); avoid empty bands. Keep body ≥ 12.5 px, preferably 14–16 px; when it does not fit, cut wording or split to a continuation page rather than shrinking further.
- Palette: white field, brand blue accents, navy footer band; one accent colour per meaning (green good, red caution). Do not make every card equally loud.
- Visible text is final copy: no internal-memo wording (未確認 / 記載なし / 要確認 / 推定). Confirmed → write; unconfirmable → omit.
- Put IDs, categories and links in the footer; per-page creation dates and credits only on cover/ending.
- Every link
https://, escaped; cite official sources for facts.
Done Criteria
- Render exits 0 with zero overflow, PNGs inspected, links clickable in the PDF, Japanese glyphs visible (view an image; text extraction alone can hide missing glyphs).
レビュー
まだレビューはありません。使ってみた感想をお寄せください。
同じリポジトリのスキル
概要と使いどころ
Design, run, and review fair performance, token, and cost comparisons across GitHub Copilot CLI, Codex CLI, and direct model APIs. Use for AI CLI benchmark, Copilot vs Codex, prompt-cache diagnosis, cache read/write analysis, fresh-process latency measurement, token-cost comparison, or when a benchmark must separate provider caching from local CLI caches.
日本語の概要は準備中です。原文の説明を表示しています。
Analyze historical VS Code GitHub Copilot Chat sessions by model, reasoning effort, AIU, time, reliability, workflow behavior, and external quality evidence, or safely prune workspace-scoped local chat history by age. Use for session analysis, repeated-task retrospectives, model evaluation, cost/performance analysis, and old session cleanup.
日本語の概要は準備中です。原文の説明を表示しています。
Create reproducible animated infographic GIFs from structured data or measured results, with audience-language labels, explicit timing semantics, representative-frame QA, and a static fallback. Use when asked for GIF生成, animated infographic, 動的インフォグラフィック, 結果が流れる図, animated benchmark, or a blog/SNS animation whose displayed metrics must remain traceable to source data.
Create polished, validated architecture, workflow, sequence, data-flow, and lifecycle/state diagrams as explorable standalone HTML with inline SVG, dark/light themes, optional trace motion, and PNG/JPEG/WebP/SVG/WebM export. Accept plain-language requirements or pasted Mermaid flowchart, sequenceDiagram, and stateDiagram input; inspect repository evidence when the diagram must reflect real code. Use when the user asks to visualize system architecture, infrastructure, cloud/security/network topology, technical workflows, API call sequences, request lifecycles, data pipelines, ETL/ELT, data lineage, state machines, or to convert/beautify Mermaid. Also use for Archify, interactive or animated HTML diagrams, インタラクティブ図, 動く構成図. When an editable .drawio file is required, use the draw.io workflow instead and treat Archify HTML only as a supplement.
Generate ASCII-art text banners for terminals, READMEs, and CLI startup messages. Use when a user asks for an ASCII banner, text art, バナー, アスキーアート, or a decorative header for a script/README.