field-notes-editorial-template

Field Notes エディトリアルテンプレート

自己完結型の単一 HTML ファイルで、上質なエディトリアルデータレポートを作成します。

リソースマップ

field-notes-editorial-template/
├── SKILL.md
├── assets/
│   └── template.html
├── references/
│   └── checklist.md
└── example.html

ワークフロー

1. 有効な DESIGN.md を読み、配色とタイポグラフィをルート CSS 変数に割り当てます。
2. 作業用ファイルとして assets/template.html を index.html にコピーします。
3. エディトリアルのフレーム表現を維持します。
   • 紙のような背景と控えめなビネット
   • セリフ体のディスプレイ見出しと、すっきりしたサンセリフ体の本文
   • 角丸のパステル調の指標カード／インサイトカード
   • 凡例と軸ラベルを備えたチャートパネル
4. インタラクションは軽量で、プレゼンテーションに適したものにします。
   • ページ表示切り替え（指標／インサイト／継続率）
   • 主要指標の数値カウントアップアニメーション
   • チャート線の描画アニメーション
5. データが不明な場合は、誠実なプレースホルダー（— または中立的なラベル）を使用します。
6. 出力前に references/checklist.md を使って確認します。

出力仕様

短い導入文を1文、その後に以下を記載します。

<artifact identifier="field-notes-editorial" type="text/html" title="Field Notes Editorial Report">
<!doctype html>
<html>...</html>
</artifact>