Figma

デザイン・制作

【手順】WordPressへSVGを載せる前のサニタイズと軽量化【Figma書き出し後】

WordPress SVG アップロード前に、Figma書き出しSVGのサニタイズと軽量化で確認すべき項目を整理。メディアライブラリで止まる原因と、実装側が安全に使う手順をまとめました。
デザイン・制作

【手順】FigmaでOGP1200×630を案件ごとに量産する【納品】

Figma OGP 書き出しを1200×630で揃える手順を、フレーム命名からPNG一括書き出しまで整理。案件ごとに量産しやすいファイル構成と、納品前にクライアントへ渡すチェック項目もまとめました。
デザイン・制作

【手順】MX Masterのボタン割り当てをFigma制作に合わせて整える【Options+】

MX Master Figma 設定で迷う人向けに、Logicool Options+で親指ボタンとサイドスクロールをズーム・フレーム移動に割り当てる手順を整理。Mac制作のショートカットと干渉しない組み合わせ例も載せています。
デザイン・制作

【手順】Figmaのブランチでクライアント確認画面を分ける【制作】

Figmaのブランチでクライアント確認用の画面を本線から分け、差し戻しとマージの手順を整理します。Webディレクター向けに、共有URLの出し方と取りこぼし防止までまとめました。
デザイン・制作

【比較】秋雨のLP制作をFigmaとCursorとWPで進める【納品前】

LP制作 Figma Cursor WordPressで迷う人向けに、デザイン・AIコーディング・公開の3工程をFigma・Cursor・WordPressテーマで比較。秋雨の納期前に工程を分けて進める判断軸をまとめました。
デザイン・制作

【手順】Figmaコンポーネントを案件ごとに整理する手順【小規模制作】

Figma コンポーネント 整理で迷う小規模制作向けに、案件ごとのライブラリ分け、命名、バリアントの最小構成を手順でまとめました。大規模DSを作らずに再利用できる運用です。
デザイン・制作

【ガイド】LP制作でツールが散る日|Figma・Adobe・Cursor比較

デザインツール 比較 LP制作で迷う人向けに、Figma・Adobe Creative Cloud・Cursorを、共同編集・写真加工・実装スピードの軸で整理。1人制作とチーム案件の使い分けをまとめました。
デザイン・制作

【手順】Figma書き出しで実装が止まる日|PNGとSVGの手順

Figma 書き出し Web実装で止まりがちなPNG・SVGの倍率、命名、フォルダ構成を整理。デザインからコーディングへ渡す最小セットと、実装側が迷わないチェックリストをまとめました。
デザイン・制作

【ガイド】Figmaプラグインおすすめ|Web制作向け必須2026

FigmaプラグインおすすめをWeb制作向けに整理。アクセシビリティ、命名、画像、フロー図まで、私が案件で入れている定番と入れないものの線引きをまとめます。
デザイン・制作

【手順】Figmaデザインレビュー手順|クライアント確認を迷わず進める

Figmaデザインレビューでクライアント確認が長引く原因は、見せ方と段階の設計にあります。フリーランスの制作現場で使えるレビュー手順とチェックリストをまとめました。