메뉴
Markdown やテキスト仕様書を、要約・構造再編・図表・チャート・ソーストレーサビリティ付きの読みやすい HTML ドキュメントに変換します。仕様書、要件定義、API 仕様、プロダクト仕様、設計ドキュメント、技術文書を可読性の高い HTML に変換したい場合や、要約・再構成・ダイアグラム・グラフ・画像・ビジュアル補助が必要な場合に使用してください。
기본적으로 소스를 먼저 확인하는 Prompt가 선택됩니다. 직접 명령으로 전환하거나 로컬 사본을 다운로드할 수도 있습니다.
설치 여부를 결정하기 전에 SKILL.md와 SkillsMP에 표시된 보조 파일을 읽어 보세요.
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
직접 명령은 검토 Prompt를 거치지 않습니다. 실행하기 전에 소스를 확인하세요.
npx skills add https://github.com/ynitto/sandbox --skill spec-to-readable-html명령은 한 줄로 유지됩니다. 복사하기 전에 가로로 스크롤해 전체 내용을 확인하세요.
로컬 사본을 원하시나요? SkillsMP에서 현재 제공할 수 있는 파일을 다운로드하세요.
会話中の話題を、最小の視覚表現（擬似コード・呼び出しツリー・コンポーネントツリー・ファイルツリー・Mermaid・diff・HTML）で見せて理解を助けるスキル。「図で説明して」「見せて」「視覚的に説明して」「イメージで教えて」「構造を見せて」「どう変わるのか見せて」「show me」などで発動する。説明が長文になりそうなときに、文章の代わりに図で示す。
agent-flow の orchestrator 向け高精度タスク分解・戦略選択スキル。要求を分析し、7パターン（map-reduce 含む）＋複合パターンから最適な戦略を選定し、実行可能なタスクグラフを生成する。decomposition スキルの分解能力を内包し、agent-flow の `--planner flow-planner` で利用する。
セッションをまたいで知識・決定事項を継続させたいときのスキル。「覚えておいて」でsave、「思い出して」でrecall、「記憶一覧」でlist、「忘れて」でarchive、「共有して」でshare、「整理して」でcleanup、「役立った／間違ってた」でrate、「固定化して」でconsolidate。重要な知見を発見したら自律的にsaveを実行すること。
SKILL.md 표시 중
SOC 직업 분류 기준
| name | spec-to-readable-html |
| description | Markdown やテキスト仕様書を、要約・構造再編・図表・チャート・ソーストレーサビリティ付きの読みやすい HTML ドキュメントに変換します。仕様書、要件定義、API 仕様、プロダクト仕様、設計ドキュメント、技術文書を可読性の高い HTML に変換したい場合や、要約・再構成・ダイアグラム・グラフ・画像・ビジュアル補助が必要な場合に使用してください。 |
| argument-hint | [lang] |
| arguments | lang |
| metadata | {"version":"1.0.0","tier":"stable","category":"document","tags":["html","spec","markdown","documentation","diagram"]} |
仕様書を洗練されたHTMLレポートに変換するスキル。単純なMarkdown→HTMLへの変換ではなく、ソースを分析・要約・再構成し、視覚補助を追加して理解しやすいドキュメントを生成する。
$lang で出力言語を指定する（デフォルト: ja）。省略した場合は日本語で出力する。
このスキルは Windows / macOS / Linux のいずれでも動作する。 出力する HTML は完全にスタンドアロン（CDN 依存なしオプションあり）のため、オフライン環境でも閲覧可能。
以下のような依頼でこのスキルを使用する:
注意: ユーザーが明示的に「忠実な変換」を求めた場合のみ、単純なMarkdown→HTML変換として扱う。
理解しやすさを優先する（書式だけでなく）
トレーサビリティを保持する
Inferred（推論）または Assumption（前提）とマークする視覚補助は必要な場合のみ使用する
出力をポータブルにする
以下のいずれの入力も受け付ける:
HTML を生成する前に以下を特定する:
対象読者や求める詳細レベルが不明な場合は以下をデフォルトとする:
ソースを読み込みマッピングする
読者に優しい構造を作る
選択的に要約する
視覚補助を選択する
洗練された HTML を生成する
section・article・nav・table・figure・figcaption出力を検証する
コンテンツに基づいて視覚補助を選択する:
| ソースコンテンツ | 最適な視覚補助 |
|---|---|
| ステップバイステップのビジネス・ユーザープロセス | フローチャート |
| システム間の API コール | シーケンス図 |
| システムコンポーネントと依存関係 | アーキテクチャ図 |
| ステータスのライフサイクル | 状態図 |
| エンティティと関係のテーブル | ER図 / 関係マップ |
| マイルストーンやフェーズドロールアウト | タイムライン |
| 優先度・ステータス・カテゴリのカウント | 棒グラフ / スタックグラフ |
| 決定の代替案 | 比較マトリクス |
| 画面遷移 | ユーザージャーニー / サイトマップ |
| 長いセクション構造 | サマリーカード |
優先フォーマット:
Mermaid を使用する場合は、後で編集できるように Mermaid ソースを HTML または付録に含める。
完全な HTML ファイルを生成する際は references/template.html をベース HTML テンプレートとして、references/html-output-template.md をコンポーネントガイドとして使用する。テンプレートから完全な <style> ブロックとセクション構造をコピーし、{{PLACEHOLDER}} トークンをソースから導出したコンテンツに置き換える。
HTML には通常以下を含める:
密度の高い技術仕様には以下のバッジを含める:
Must・Should・CouldConfirmed・Inferred・Assumption・Open QuestionHigh Risk・Medium Risk・Low Risk生成した HTML ファイルの保存先:
[元のファイル名]-readable.html（例: spec.md → spec-readable.html）Open Questions セクションを作成するデフォルトの出力言語は日本語（<html lang="ja">）。ユーザーが別の言語を要求した場合はすべての見出し・バッジ・ラベル・本文テキストにその言語を使用する。技術用語（API名・フィールド名・パス・コード識別子）は言語に関わらず元の言語で保持する。
最終化する前に確認する: