STEP 1
この章を読む
超基礎：まずは触ってみよう
「ツールが多くて怖い」を解消します。実はWebデザインに使う機能は全体の2割だけ。 フレーム（画用紙）の置き方から、図形や文字の配置まで、最初の一歩を解説します。
Topics
- フレームとグループの違いって？
- 長方形・円・画像の配置方法
- 絶対に覚えておきたいショートカット3選
STEP 2
この章を読む
応用：修正に強いデータを作る
ここがFigmaの真骨頂。「文字数が増えても崩れないレイアウト」や「ボタンの一括変更」など、 手作業を減らしてラクをするための「魔法の機能」を学びます。
Topics
- 最重要機能「オートレイアウト」完全理解
- 使い回しの達人になる「コンポーネント」
- スマホ・PCのデザインを一気に管理するコツ
STEP 3
この章を読む
実践：チーム開発と納品
実際の仕事の流れを想定します。画面遷移の動き（プロトタイプ）を作ったり、 コーダー（エンジニア）へ正確にデザインを伝えるための「開発モード」の使い方をマスターします。
Topics
- クリックで画面が変わる「プロトタイプ」設定
- コーダーに喜ばれる「Dev Mode（開発モード）」
- 便利なプラグインを入れて機能を拡張しよう