Archive

Archive

AIが理解しやすいfigmaデータってなに?

  • ホーム
  • Archive
  • AIが理解しやすいfigmaデータってなに?
2026.10.26備忘録

■前提 HTML・画像書き出しは人が行う。理解しやすいデータをAIに質問

・HTMLのセクションと同じ名前で、中をAuto layoutにしたフレームにする。FigmaのURLを開けば、余白・文字・色はそこから読める。

・ページは top / pc と top / sp のように、画面幅ごとに1フレームずつ分ける。非表示の修正用レイヤーは同じフレームに置かない。

・フレームの名前を、HTMLの区切りと揃える。mainVisual、homePopularityBox、homeReformBox のようにする。

・横並び・縦並びのブロックはAuto layoutにする。余白はレイヤーをずらすのではなく、paddingとgapで取る。

・記事カードやボタンはコンポーネント1つにする。コピーを10個置かない。

・文章はテキストレイヤーのままにする。アウトライン化したり、画像の中に焼き込んだりしない。

・色と文字はスタイルか変数にする。近い色を図形ごとに別の数値で塗らない。

・画像のレイヤー名を、HTMLで使うファイル名と揃える。illustFurniture01、imgMainPhoto01 のようにする。装飾として1枚で出す絵は、1フレームにまとめて書き出せるようにする。

最新の記事
The Interval Between
the Suffering and Seacow of Continuing
カテゴリー
Classification pizza mocks
for flapping
タグ
What flavor was the roasted
sweet potato you ate yesterday?
ページ上部に戻るスプーン