漫画を描く（構造専用SVG）

ゴール

AIに渡す前段階として、OSが自力で生成できる「骨格・輪郭だけのSVG」の仕様を決める。
ここでは「意味は持つが、質感は持たない」構造専用SVGに絞る。

1. 全体ルール

  • 座標系:

    • viewBox="0 0 1024 1024" を標準とする
    • 原点は左上、右方向が +x、下方向が +y

  • スタイル:

    • 線のみ（fill="none"）
    • 色は仮で stroke="#000"
    • 線幅は意味を持たせない（後でAIが上書き）

2. レイヤー構造

<svg ... viewBox="0 0 1024 1024">
  <g id="layer-body"  data-role="body">...</g>
  <g id="layer-face"  data-role="face">...</g>
  <g id="layer-cloth" data-role="cloth">...</g>
</svg>
  • data-role は固定語彙：body, face, cloth, hair, background など
  • OSはここを「意味レイヤー」として扱う

3. ボディ（骨格）レイヤー

<g id="layer-body" data-role="body">
  <path id="skeleton"
        data-kind="skeleton"
        d="M512 150 L512 300 L480 450 L540 450 ..."
        stroke="#000" stroke-width="1" fill="none" />
</g>
  • 役割: ポーズの骨格線のみ
  • 生成元: PoseSpace → 2D骨格 → パス化
  • AIの使い方: この線をガイドにして身体の線画を描く

4. 顔レイヤー（最低限）

<g id="layer-face" data-role="face">
  <circle id="face-outline"
          data-part="face"
          cx="512" cy="260" r="80"
          stroke="#000" stroke-width="1" fill="none" />

  <path id="eye-left"
        data-part="eye" data-side="left"
        d="M480 250 L495 252 L480 254"
        stroke="#000" stroke-width="1" fill="none" />

  <path id="eye-right"
        data-part="eye" data-side="right"
        d="M529 250 L544 252 L529 254"
        stroke="#000" stroke-width="1" fill="none" />

  <path id="mouth"
        data-part="mouth"
        d="M490 285 L534 287"
        stroke="#000" stroke-width="1" fill="none" />
</g>
  • ここでは「位置と大まかな形」だけ
  • つり目度などは 座標に反映済み（OSが計算）

5. 服レイヤー（輪郭のみ）

<g id="layer-cloth" data-role="cloth">
  <path id="upper-cloth"
        data-part="top"
        d="M460 300 L564 300 L580 420 L444 420 Z"
        stroke="#000" stroke-width="1" fill="none" />

  <path id="skirt"
        data-part="skirt"
        d="M460 420 L564 420 L600 550 L424 550 Z"
        stroke="#000" stroke-width="1" fill="none" />
</g>
  • 布の重さ・揺れは まだ入れない
  • まずは「服の構造と位置」だけ

6. メタデータ（意味との橋渡し）

<metadata id="os-semantic">
{
  "pose_space":   [ ... ],
  "eye_space":    { "tsurime": 0.6 },
  "cloth_space":  { "weight": 0.2 },
  "character_id": "A123"
}
</metadata>
  • OSが生成時に埋め込む
  • 後で「この構造SVGはどの意味状態から来たか」を辿れる

7. 要するに

構造SVG =

  • 固定の viewBox
  • 意味レイヤーごとの <g>
  • 骨格線（body）
  • 顔の基本形（face）
  • 服の輪郭（cloth）
  • すべて線のみ・質感なし
  • 生成時の意味ベクトルを <metadata> に保持

AIはここに「線の質感・しわ・陰影」を重ねるだけ、という前提。

次に詰めるなら：

  • 顔・体・服の 標準 data-part 語彙リスト
  • PoseSpace → skeleton の具体的な変換式
    どちらから触りたい？