跳到正文
cccskills
免费在 GitHub 公开

react-slide-deck-ja

原典React/ViteとFramer Motionで、日本語の図解・操作を含むWebスライドを制作する。

中文简介正在准备中。当前显示原文说明。

查看安装方法

包含的文件(200)

  • SKILL.md3.2 KB
  • references/CURRENT-EXAMPLE.md2.4 KB
  • references/example-source/build_reactdeck_repository_example.py26.3 KB
  • references/recipe.json15.7 KB
  • references/WORKFLOW.md2.4 KB
  • SOURCE.json37.8 KB
  • upstream/ACQUISITION.json538 B
  • upstream/examples/en-claude-code-skills/eslint.config.js616 B
  • upstream/examples/en-claude-code-skills/index.html373 B
  • upstream/examples/en-claude-code-skills/package-lock.json137.3 KB
  • upstream/examples/en-claude-code-skills/package.json877 B
  • upstream/examples/en-claude-code-skills/README.md2.4 KB
  • upstream/examples/en-claude-code-skills/src/App.tsx3.8 KB
  • upstream/examples/en-claude-code-skills/src/assets/react.svg4.0 KB
  • upstream/examples/en-claude-code-skills/src/assets/vite.svg8.5 KB
  • upstream/examples/en-claude-code-skills/src/components/SlideLayout.tsx640 B
  • upstream/examples/en-claude-code-skills/src/index.css1.7 KB
  • upstream/examples/en-claude-code-skills/src/lib/animations.ts1.6 KB
  • upstream/examples/en-claude-code-skills/src/lib/theme.ts567 B
  • upstream/examples/en-claude-code-skills/src/lib/useSlideScale.ts666 B
  • upstream/examples/en-claude-code-skills/src/main.tsx230 B
  • upstream/examples/en-claude-code-skills/src/slides/01-title.tsx2.4 KB
  • upstream/examples/en-claude-code-skills/src/slides/02-problem.tsx2.2 KB
  • upstream/examples/en-claude-code-skills/src/slides/03-what-if.tsx2.2 KB
  • upstream/examples/en-claude-code-skills/src/slides/04-what-is-skill.tsx3.1 KB
  • upstream/examples/en-claude-code-skills/src/slides/05-how-skills-work.tsx3.1 KB
  • upstream/examples/en-claude-code-skills/src/slides/06-anatomy.tsx3.8 KB
  • upstream/examples/en-claude-code-skills/src/slides/07-trigger-system.tsx3.7 KB
  • upstream/examples/en-claude-code-skills/src/slides/08-builtin-vs-custom.tsx4.1 KB
  • upstream/examples/en-claude-code-skills/src/slides/09-creating-first.tsx2.9 KB
  • upstream/examples/en-claude-code-skills/src/slides/10-example-slides.tsx3.6 KB
  • upstream/examples/en-claude-code-skills/src/slides/11-example-screenshots.tsx3.5 KB
  • upstream/examples/en-claude-code-skills/src/slides/12-sharing.tsx3.0 KB
  • upstream/examples/en-claude-code-skills/src/slides/13-best-practices.tsx2.7 KB
  • upstream/examples/en-claude-code-skills/src/slides/14-takeaway.tsx2.8 KB
  • upstream/examples/en-claude-code-skills/src/slides/15-getting-started.tsx3.5 KB
  • upstream/examples/en-claude-code-skills/src/slides/index.ts788 B
  • upstream/examples/en-claude-code-skills/tsconfig.app.json732 B
  • upstream/examples/en-claude-code-skills/tsconfig.json119 B
  • upstream/examples/en-claude-code-skills/tsconfig.node.json653 B
  • upstream/examples/en-claude-code-skills/vite.config.ts192 B
  • upstream/examples/en-context-engineering/eslint.config.js616 B
  • upstream/examples/en-context-engineering/index.html374 B
  • upstream/examples/en-context-engineering/package-lock.json137.6 KB
  • upstream/examples/en-context-engineering/package.json905 B
  • upstream/examples/en-context-engineering/README.md2.4 KB
  • upstream/examples/en-context-engineering/src/App.css2.8 KB
  • upstream/examples/en-context-engineering/src/App.tsx1.9 KB
  • upstream/examples/en-context-engineering/src/assets/react.svg4.0 KB
  • upstream/examples/en-context-engineering/src/assets/vite.svg8.5 KB
  • upstream/examples/en-context-engineering/src/components/SlideLayout.tsx1.1 KB
  • upstream/examples/en-context-engineering/src/index.css649 B
  • upstream/examples/en-context-engineering/src/lib/animations.ts1015 B
  • upstream/examples/en-context-engineering/src/lib/theme.ts359 B
  • upstream/examples/en-context-engineering/src/lib/useSlideScale.ts612 B
  • upstream/examples/en-context-engineering/src/main.tsx230 B
  • upstream/examples/en-context-engineering/src/slides/01-title.tsx2.1 KB
  • upstream/examples/en-context-engineering/src/slides/02-problem.tsx2.7 KB
  • upstream/examples/en-context-engineering/src/slides/03-discussion.tsx2.8 KB
  • upstream/examples/en-context-engineering/src/slides/04-concept.tsx2.7 KB
  • upstream/examples/en-context-engineering/src/slides/05-context-window.tsx3.8 KB
  • upstream/examples/en-context-engineering/src/slides/06-seven-components.tsx2.9 KB
  • upstream/examples/en-context-engineering/src/slides/07-system-vs-user.tsx4.0 KB
  • upstream/examples/en-context-engineering/src/slides/08-few-shot.tsx4.1 KB
  • upstream/examples/en-context-engineering/src/slides/09-rag.tsx4.3 KB
  • upstream/examples/en-context-engineering/src/slides/10-tool-use.tsx4.1 KB
  • upstream/examples/en-context-engineering/src/slides/11-quality-equation.tsx3.3 KB
  • upstream/examples/en-context-engineering/src/slides/12-bad-vs-good.tsx4.4 KB
  • upstream/examples/en-context-engineering/src/slides/13-coding-assistant.tsx3.4 KB
  • upstream/examples/en-context-engineering/src/slides/14-takeaway.tsx2.5 KB
  • upstream/examples/en-context-engineering/src/slides/15-resources.tsx5.1 KB
  • upstream/examples/en-context-engineering/src/slides/index.ts780 B
  • upstream/examples/en-context-engineering/tsconfig.app.json732 B
  • upstream/examples/en-context-engineering/tsconfig.json119 B
  • upstream/examples/en-context-engineering/tsconfig.node.json653 B
  • upstream/examples/en-context-engineering/vite.config.ts192 B
  • upstream/examples/en-how-llm-works/eslint.config.js616 B
  • upstream/examples/en-how-llm-works/index.html368 B
  • upstream/examples/en-how-llm-works/package-lock.json137.6 KB
  • upstream/examples/en-how-llm-works/package.json899 B
  • upstream/examples/en-how-llm-works/README.md2.4 KB
  • upstream/examples/en-how-llm-works/src/App.tsx2.4 KB
  • upstream/examples/en-how-llm-works/src/assets/react.svg4.0 KB
  • upstream/examples/en-how-llm-works/src/assets/vite.svg8.5 KB
  • upstream/examples/en-how-llm-works/src/components/SlideLayout.tsx704 B
  • upstream/examples/en-how-llm-works/src/index.css1.6 KB
  • upstream/examples/en-how-llm-works/src/lib/animations.ts830 B
  • upstream/examples/en-how-llm-works/src/lib/theme.ts309 B
  • upstream/examples/en-how-llm-works/src/lib/useSlideScale.ts559 B
  • upstream/examples/en-how-llm-works/src/main.tsx230 B
  • upstream/examples/en-how-llm-works/src/slides/01-title.tsx1.8 KB
  • upstream/examples/en-how-llm-works/src/slides/02-problem.tsx2.1 KB
  • upstream/examples/en-how-llm-works/src/slides/03-discussion.tsx2.6 KB
  • upstream/examples/en-how-llm-works/src/slides/04-next-token.tsx2.8 KB
  • upstream/examples/en-how-llm-works/src/slides/05-tokenization.tsx3.2 KB
  • upstream/examples/en-how-llm-works/src/slides/06-transformer.tsx3.0 KB
  • upstream/examples/en-how-llm-works/src/slides/07-attention.tsx3.5 KB
  • upstream/examples/en-how-llm-works/src/slides/08-training.tsx2.9 KB
  • upstream/examples/en-how-llm-works/src/slides/09-scale.tsx3.6 KB
  • upstream/examples/en-how-llm-works/src/slides/10-finetuning.tsx3.0 KB
  • upstream/examples/en-how-llm-works/src/slides/11-inference.tsx3.2 KB
  • upstream/examples/en-how-llm-works/src/slides/12-limitations.tsx2.5 KB
  • upstream/examples/en-how-llm-works/src/slides/13-example.tsx2.8 KB
  • upstream/examples/en-how-llm-works/src/slides/14-takeaway.tsx1.9 KB
  • upstream/examples/en-how-llm-works/src/slides/15-resources.tsx2.8 KB
  • upstream/examples/en-how-llm-works/src/slides/index.ts743 B
  • upstream/examples/en-how-llm-works/tsconfig.app.json732 B
  • upstream/examples/en-how-llm-works/tsconfig.json119 B
  • upstream/examples/en-how-llm-works/tsconfig.node.json653 B
  • upstream/examples/en-how-llm-works/vite.config.ts192 B
  • upstream/examples/vi-claude-code-skills/eslint.config.js616 B
  • upstream/examples/vi-claude-code-skills/index.html373 B
  • upstream/examples/vi-claude-code-skills/package-lock.json137.3 KB
  • upstream/examples/vi-claude-code-skills/package.json877 B
  • upstream/examples/vi-claude-code-skills/README.md2.4 KB
  • upstream/examples/vi-claude-code-skills/src/App.tsx1.9 KB
  • upstream/examples/vi-claude-code-skills/src/assets/react.svg4.0 KB
  • upstream/examples/vi-claude-code-skills/src/assets/vite.svg8.5 KB
  • upstream/examples/vi-claude-code-skills/src/components/SlideLayout.tsx2.3 KB
  • upstream/examples/vi-claude-code-skills/src/index.css512 B
  • upstream/examples/vi-claude-code-skills/src/lib/animations.ts1.1 KB
  • upstream/examples/vi-claude-code-skills/src/lib/theme.ts277 B
  • upstream/examples/vi-claude-code-skills/src/lib/useSlideScale.ts676 B
  • upstream/examples/vi-claude-code-skills/src/main.tsx230 B
  • upstream/examples/vi-claude-code-skills/src/slides/index.ts720 B
  • upstream/examples/vi-claude-code-skills/src/slides/Slide01.tsx1.6 KB
  • upstream/examples/vi-claude-code-skills/src/slides/Slide02.tsx2.0 KB
  • upstream/examples/vi-claude-code-skills/src/slides/Slide03.tsx2.0 KB
  • upstream/examples/vi-claude-code-skills/src/slides/Slide04.tsx2.0 KB
  • upstream/examples/vi-claude-code-skills/src/slides/Slide05.tsx2.6 KB
  • upstream/examples/vi-claude-code-skills/src/slides/Slide06.tsx2.6 KB
  • upstream/examples/vi-claude-code-skills/src/slides/Slide07.tsx2.7 KB
  • upstream/examples/vi-claude-code-skills/src/slides/Slide08.tsx2.7 KB
  • upstream/examples/vi-claude-code-skills/src/slides/Slide09.tsx2.9 KB
  • upstream/examples/vi-claude-code-skills/src/slides/Slide10.tsx2.3 KB
  • upstream/examples/vi-claude-code-skills/src/slides/Slide11.tsx2.4 KB
  • upstream/examples/vi-claude-code-skills/src/slides/Slide12.tsx2.7 KB
  • upstream/examples/vi-claude-code-skills/src/slides/Slide13.tsx2.2 KB
  • upstream/examples/vi-claude-code-skills/src/slides/Slide14.tsx2.1 KB
  • upstream/examples/vi-claude-code-skills/src/slides/Slide15.tsx2.8 KB
  • upstream/examples/vi-claude-code-skills/tsconfig.app.json732 B
  • upstream/examples/vi-claude-code-skills/tsconfig.json119 B
  • upstream/examples/vi-claude-code-skills/tsconfig.node.json653 B
  • upstream/examples/vi-claude-code-skills/vite.config.ts220 B
  • upstream/examples/vi-context-engineering/eslint.config.js616 B
  • upstream/examples/vi-context-engineering/index.html374 B
  • upstream/examples/vi-context-engineering/package-lock.json137.3 KB
  • upstream/examples/vi-context-engineering/package.json878 B
  • upstream/examples/vi-context-engineering/README.md2.4 KB
  • upstream/examples/vi-context-engineering/src/App.tsx1.5 KB
  • upstream/examples/vi-context-engineering/src/assets/react.svg4.0 KB
  • upstream/examples/vi-context-engineering/src/assets/vite.svg8.5 KB
  • upstream/examples/vi-context-engineering/src/components/SlideLayout.tsx3.0 KB
  • upstream/examples/vi-context-engineering/src/index.css994 B
  • upstream/examples/vi-context-engineering/src/lib/animations.ts1.7 KB
  • upstream/examples/vi-context-engineering/src/lib/theme.ts817 B
  • upstream/examples/vi-context-engineering/src/lib/useSlideScale.ts654 B
  • upstream/examples/vi-context-engineering/src/main.tsx230 B
  • upstream/examples/vi-context-engineering/src/slides/01-title.tsx3.7 KB
  • upstream/examples/vi-context-engineering/src/slides/02-problem.tsx3.4 KB
  • upstream/examples/vi-context-engineering/src/slides/03-discussion.tsx3.7 KB
  • upstream/examples/vi-context-engineering/src/slides/04-concept.tsx3.6 KB
  • upstream/examples/vi-context-engineering/src/slides/05-context-window.tsx4.4 KB
  • upstream/examples/vi-context-engineering/src/slides/06-components.tsx3.5 KB
  • upstream/examples/vi-context-engineering/src/slides/07-system-vs-user.tsx5.0 KB
  • upstream/examples/vi-context-engineering/src/slides/08-few-shot.tsx4.1 KB
  • upstream/examples/vi-context-engineering/src/slides/09-rag.tsx4.7 KB
  • upstream/examples/vi-context-engineering/src/slides/10-tool-use.tsx5.1 KB
  • upstream/examples/vi-context-engineering/src/slides/11-formula.tsx4.6 KB
  • upstream/examples/vi-context-engineering/src/slides/12-comparison.tsx6.0 KB
  • upstream/examples/vi-context-engineering/src/slides/13-coding-assistant.tsx3.9 KB
  • upstream/examples/vi-context-engineering/src/slides/14-takeaway.tsx3.5 KB
  • upstream/examples/vi-context-engineering/src/slides/15-resources.tsx5.1 KB
  • upstream/examples/vi-context-engineering/src/slides/index.ts796 B
  • upstream/examples/vi-context-engineering/tsconfig.app.json732 B
  • upstream/examples/vi-context-engineering/tsconfig.json119 B
  • upstream/examples/vi-context-engineering/tsconfig.node.json653 B
  • upstream/examples/vi-context-engineering/vite.config.ts192 B
  • upstream/examples/vi-how-llm-works/eslint.config.js616 B
  • upstream/examples/vi-how-llm-works/index.html386 B
  • upstream/examples/vi-how-llm-works/package-lock.json137.3 KB
  • upstream/examples/vi-how-llm-works/package.json872 B
  • upstream/examples/vi-how-llm-works/README.md2.4 KB
  • upstream/examples/vi-how-llm-works/src/App.tsx3.2 KB
  • upstream/examples/vi-how-llm-works/src/assets/react.svg4.0 KB
  • upstream/examples/vi-how-llm-works/src/assets/vite.svg8.5 KB
  • upstream/examples/vi-how-llm-works/src/components/SlideLayout.tsx2.7 KB
  • upstream/examples/vi-how-llm-works/src/index.css609 B
  • upstream/examples/vi-how-llm-works/src/lib/animations.ts1.0 KB
  • upstream/examples/vi-how-llm-works/src/lib/theme.ts686 B
  • upstream/examples/vi-how-llm-works/src/lib/useSlideScale.ts559 B
  • upstream/examples/vi-how-llm-works/src/main.tsx230 B
  • upstream/examples/vi-how-llm-works/src/slides/01-title.tsx2.6 KB
  • upstream/examples/vi-how-llm-works/src/slides/02-problem.tsx3.1 KB
  • upstream/examples/vi-how-llm-works/src/slides/03-autocomplete.tsx4.0 KB
  • upstream/examples/vi-how-llm-works/src/slides/04-core-idea.tsx3.6 KB
  • upstream/examples/vi-how-llm-works/src/slides/05-tokenization.tsx4.3 KB
  • upstream/examples/vi-how-llm-works/src/slides/06-transformer.tsx4.4 KB
  • upstream/examples/vi-how-llm-works/src/slides/07-attention.tsx4.3 KB
  • upstream/examples/vi-how-llm-works/src/slides/08-training.tsx4.8 KB

SKILL.md(原文)

安装前可以查看交给 AI 代理的指令内容。

日本語で動くWebスライドを作る

原典は code-on-sunday/slide-deck-generator。upstream/skills/slide-deck/SKILL.md と slide-guidelines.md、references/WORKFLOW.mdを読む。原典en-context-engineeringのApp、SlideLayout、useSlideScale、animation variantsを使い、別の共通rendererへ置き換えない。

日本語で渡す入力

読み手、説明したいこと、実際の資料・数値、話す時間、雰囲気をまとめる。見出しは短く、問題→問い→概念→例→持ち帰りをひとつの流れにする。実例の4週間・10問は架空の企画目標で、実績として流用しない。

制作

  1. 原典presetを一つ選び、色と動きの理由を原稿へ記録する。日本語は公式配布のNoto Sans JP等を使い、OFLと参照元を保持する。
  2. Reactのページと図解を組む。単純な図はSVGとnative要素、週別タブ等の独自拡張は独立stateで作り、操作中にページが飛ばないようにする。新しい本文の字形をfont subsetへ含める。
  3. 元のVite8/Tailwind4.2.1にはpeer衝突がある。この固定版の再現にはTailwind4.2.2と記録したlockを使う。npmの検査を--forceで無効化しない。
  4. npm ci、TypeScript、Vite buildを実行。動くページ状態・クリック・キー・reduced-motionを確認し、全ページをブラウザーで見る。
  5. index.htmlとassetsとfontsをひと組でHTTP配信する。Windowsの再現キットは短い展開先を使う。

確認と条件

原典sourceと日本語diff、入力、実行ログ、全頁の描画を保存する。外側プレイヤーと接続する場合はparentのsourceとoriginを両方確認する。PPTXは生成しない。内蔵・外部AI APIを必須にする工程ではない。制作QA、人による正式採用、外部公開を分ける。原典MIT、依存のLICENSE、書体OFLを保持する。

当作例では原典のBold Signal、問題→問い→概念→例→持ち帰り、画面内への縮尺、文字の段階表示を使う。週別タブは作例固有の拡張で、原典の内蔵部品ではない。全5頁とW1〜W4の切替を再確認した記録はsource/repair-browser-review.json。

現在の作例の実施範囲(Round4)

原典の研修の流れとBold Signalを使用。表紙は色付きカードを中心にし、本文は図の段階表示、作例の週別タブで操作して読める。

  • 原典のInteractive slideを参考にした週別タブは局所拡張。Recharts、他preset、外部API、量的効果測定は未実施。
  • 4週間・10問は架空の目標。FAQ改善や問い合わせ削減の実績はない。
  • 元Vite8/Tailwind4.2.1のpeer不一致はTailwind4.2.2の固定lockへ局所修正。60fpsの定量計測・全端末の検査は未実施。

全5頁の実描画と個別の動作証拠は制作側の確認。独立Kimi K3/Opus5.5の新しい版の評価は別に行う。過去の採点を新しい画像へ引き継がない。

评价

还没有评价。欢迎分享你的使用感受。

评论

无需登录即可发表。欢迎分享使用感受、提问,或说明在哪些环境下无法运行。

还没有评论。来写第一条吧。

提交后会立即公开。请勿填写邮箱、电话等个人信息。URL 最多 2 个。

0 / 1000 字

此表单受 reCAPTCHA 保护,适用 Google 的隐私权政策和服务条款。

同一仓库的技能

原稿の主張と図の役割を頁ごとに整理し、選んだ書式を全頁へ引き継ぐ画像スライドと話者ノートを作る。

中文简介正在准备中。当前显示原文说明。

studio-yebisu/yaoyorozu-ai-toolbox-slides102026年10月22日 更新

Convert literature reviews, paper folders, thesis drafts, journal-style reports, or research outlines into rigorous academic slide decks and review artifacts. Use when Codex must create, rebuild, or polish PPTX presentations from scholarly sources while preserving academic logic, citation-aware image/formula handling, editable layouts, figure explanations, template fidelity, and export-based visual QA.

中文简介正在准备中。当前显示原文说明。

studio-yebisu/yaoyorozu-ai-toolbox-slides102026年10月22日 更新

既存PPTXの書式・配置を抽出し、planとnative編集操作からPowerPointを生成・検査する。

中文简介正在准备中。当前显示原文说明。

studio-yebisu/yaoyorozu-ai-toolbox-slides102026年10月22日 更新

aham-ja

免费

読者と目的から構成・版式を決め、確認を挟みながら、編集できる図形と文字のPPTXにする。

中文简介正在准备中。当前显示原文说明。

studio-yebisu/yaoyorozu-ai-toolbox-slides102026年10月22日 更新

aham-ppt

免费

全流程AI制作PPT演示文稿技能,克制专业、风格可选 A/B/C 三档(Aham UI v6.1 · Office 轨 · PPT)。 当用户说"帮我做PPT""做演示文稿""做一个汇报""根据这份资料做PPT" "做客户方案PPT""制作幻灯片"时立即触发。即使只有一句话需求也触发。 八阶段模块化流程:规范加载→材料解析→论点提炼→叙事骨架→大纲版式→样稿确认→逐页设计→质检交付。 内置能力自适应教练机制,无论用户专业水平高低,均引导至及格以上输出。 注意:本技能用于 PowerPoint / pptx 输出;SVG/HTML 版本见 ppt-svg 技能。

中文简介正在准备中。当前显示原文说明。

studio-yebisu/yaoyorozu-ai-toolbox-slides102026年10月22日 更新

原典のReact scene kitを実scaffoldし、安定layoutIdの共通canvasでentityが移動・morphする日本語ブラウザ資料を作る。

中文简介正在准备中。当前显示原文说明。

studio-yebisu/yaoyorozu-ai-toolbox-slides102026年10月22日 更新

查看 studio-yebisu 的全部技能

报告此技能的问题