plannotator/effective-html

これは何？

主な機能

• 01リクエストを専門スキルに振り分ける汎用のhtmlスキルを提供します。
• 02コンテンツの階層構造やナビゲーションを検証する、低忠実度のワイヤーフレームを生成します。
• 03インタラクション、キーボード操作、レスポンシブな挙動を備えた実用的なプロトタイプを作成します。
• 04元のコミットメントを維持した計画やロードマップを作成します。
• 05アーキテクチャ図、シーケンス図、状態図、タイムライン図をHTMLで生成します。

ユースケース

• UIの実装前に、レビュー担当者とレイアウト案を検討する。
• 機能リクエストを、ステークホルダーからフィードバックを得るためのクリック可能なプロトタイプにする。
• システムアーキテクチャやリクエストのフローを、共有しやすいHTML図として記録する。
• エージェントが実行できる実装展開計画を作成する。

トピック

よくある質問

effective-html とは？

コーディングエージェントが自己完結型のHTMLワイヤーフレーム、インタラクティブなプロトタイプ、計画、図を作るためのエージェントスキル。 Effective HTMLは、長文のテキストではなくHTML成果物を作成するための、任意で使えるエージェントスキル集です。レイアウト、階層構造、ナビゲーションを検証する低忠実度のワイヤーフレーム、現実的な状態やキーボード操作、レスポンシブな挙動を備えた実用的なプロトタイプ、元のコミットメントを維持する計画やロードマップ、アーキテクチャ図、シーケンス図、状態図、タイムライン図を扱います。

effective-html は無料で使えますか？ライセンスは？

effective-html は MIT ライセンスのオープンソースです。商用製品で使う前にライセンス条件を確認してください。

effective-html は今もメンテナンスされていますか？

活発にメンテナンス中。effective-html の最終コミットは 2026年10月15日 です。

effective-html は何に使えますか？

UIの実装前に、レビュー担当者とレイアウト案を検討する。 機能リクエストを、ステークホルダーからフィードバックを得るためのクリック可能なプロトタイプにする。 システムアーキテクチャやリクエストのフローを、共有しやすいHTML図として記録する。 エージェントが実行できる実装展開計画を作成する。

effective-html はどこで入手できますか？

ソースコードとインストール手順は GitHub にあります：https://github.com/plannotator/effective-html