Figma

デザイン・制作

【手順】Figmaのバリアント命名を実装向けに揃える【Web制作】

Figma バリアント 命名で実装前に迷いが出る制作向けに、プロパティ名・値・階層の揃え方と8個ルール、Dev Modeで確認する手順を整理しました。
横断

【手順】Figmaで10月15日新作の告知バナーを16:9と1:1に書き出す【ブログ】

Figma バナー 書き出しで、10月15日発売の新作ゲーム告知をブログ16:9とSNS正方形に揃える手順。フレーム命名、Export設定、著作権の線引きまで整理しました。
デザイン・制作

【手順】FigmaでSteamストア画像からブログサムネ16:9を切り出す【WordPress】

Figma Steam 画像 切り出しで、ストアのヘッダー素材からブログ用16:9サムネを安全に作る手順です。著作権とクレジットの線引き、1920×1080フレーム、書き出し設定まで整理しました。
デザイン・制作

【手順】FigmaのUIをUnity向け9スライスPNGで書き出す【@2x】

Figma Unity 9スライスで、ボタンやパネルをUnityのImageにそのまま載せる書き出し手順です。スライス線の置き方と@2x命名、インポート後の確認までまとめました。
デザイン・制作

【手順】Figmaでゲーム設定のタブ順を表にまとめる【アクセシビリティ】

ゲーム設定 UI Figmaで、タブとフォーカス順を実装前に表に起こす手順です。Dev Modeの数値と状態名を揃え、キーボード操作とコントローラー操作の両方で迷いを減らします。
横断

【手順】CursorでゲームUI仕様MarkdownをFigmaから起こす【納品前】

ゲームUI仕様 MarkdownをFigmaからCursorで起こす手順です。Dev Modeの数値、コンポーネント名、状態一覧を1本の仕様書にまとめ、実装とWordPress当て込みのぶれを減らします。
デザイン・制作

【手順】Figma Auto LayoutでゲームHUDを実装渡し準備する【新仕様】

Figma Auto Layout ゲームUI向けに、CSS寄り新仕様を前提としたHUDの実装渡し手順です。LegacyとLatestの切り分けと、プレイヤー情報バーの組み方が中心です。
デザイン・制作

【手順】ゲームUIのWebP書い出しからWordPressへ載せる流れ【Figma】

Figma WebP 書き出しでゲームUIのボタンやアイコンを軽くしたい人向けに、書き出し設定・2倍書き出し・WordPressへの載せ方と、PNG併用の切り分けを日本時間2026年9月27日時点で整理しました。
デザイン・制作

【手順】FigmaでゲームUIコンポーネント命名を案件ごとに揃える【納品前】

Figma コンポーネント 命名 ゲームUIで納品前に迷う人向け。Button/Icon/Modalの接頭辞とバリアント表記を案件テンプレに固定し、開発側が探しやすい階層に整える手順をまとめました。
横断

【手順】新作ゲームのUIスクショをFigmaで注釈して共有する【打合せ】

ゲーム UI スクショ Figma 共有で、新作のメニュー画面をクライアントや制作側に伝えたい人向けに、キャプチャの書き出し、フレーム化、注釈、リンク共有までの手順と失敗例を整理しました。