この資料は、受講者の方が読みながら進めやすいように作ったシンプル版です。まずは難しく考えず、「デザインツールに触れて楽しむ」ことを目指しましょう！
この講座でできるようになりたいこと
- Figmaの基本的な画面の見方がわかる
- 図形を描いて、好きな色に変えられる
- 文字を入力して、大きさや色を調整できる
- 画像と文字を組み合わせて簡単なバナーを作れる
大事なこと 最初から上手に作れなくて大丈夫です！「ちょっと間違えたかな？」と思ってもすぐにやり直せるので、安心して操作してみてください。
使うときの基本ルール
- 自動で保存されるので「保存ボタン」を押さなくてOK！
- 間違えたら 「戻る（Ctrl + Z）」 ですぐに直せます。
- 画面が迷子になったら、落ち着いて先生やスタッフを呼びましょう。
- わからない操作は、遠慮せずにすぐに質問してください。
今日やること（合計：180分）
1. Figmaって何？画面の見方（20分）
Figmaで何ができるのか、どんな画面になっているかを確認します。
↑このように、パソコンの画面上で簡単にデザインを作っていくことができます
ポイント：インターネット上で動くデザインツールです。みんなで同時に作業することもできます。
2. 基本の図形を描いて、色を変えよう（30分）
まずはツールに慣れるために、四角や丸を描いて色を塗ってみましょう。
手順
- 画面上の「□（四角）」アイコンをクリック
- 画面の中でマウスをドラッグして四角を描く
- 右側のパネルの「塗り（Fill）」から好きな色に変える
3. 文字を入力してみよう（30分）
お知らせやポスターに欠かせない「文字」を入力します。
手順
- 画面上の「T（テキスト）」アイコンをクリック
- 画面の好きな場所をクリックして「こんにちは」と入力
- 右側のパネルで「文字の大きさ」や「フォント」を変える
4. 画像を入れてみよう（30分）
パソコンの中にある写真を、Figmaの画面に配置します。
手順
- 自分のパソコンにある画像を、Figmaの画面にドラッグ＆ドロップ
- 画像の角（かど）を引っ張って、大きさを調整する
5. 実践！簡単なバナーを作ってみよう（50分）
今まで練習した「図形」「文字」「画像」を組み合わせて、具体的なお知らせ画像（バナー）を完成させます。
お題：春のリフォームフェアのInstagramバナー
- 大きさ：Instagram投稿サイズ（横1080 × 縦1080）
入れる情報
- 会社名：RENOVATION HOUSE
- キャンペーン名：春のリフォームフェア
- 期間：2025年4月1日〜5月31日
- 特典：工事費用10％OFF
- CTA（ボタン）：無料見積もりはこちら
💡 仕上がりのポイント
- 高級感・信頼感が出る色を選ぶ（紺・グレー・白など）
- 特典の「10％OFF」を一番大きく目立たせる
- 文字を詰め込みすぎず、余白（空きスペース）を意識する
6. 覚えておくと便利な機能（20分）
作業を少し楽にする便利な機能を紹介します。
グループ化（まとめる）
複数の図形や文字を一緒に動かしたいときは、全部選んで「右クリック → グループ化」
整列（きれいに並べる）
バラバラの文字や図形を揃えたいときは、右上の「揃える」ボタンを使います。
すぐ使える！魔法のショートカットキー
キーボードを使った便利な操作です。少しずつ覚えていきましょう。
| 操作 | キー |
|---|---|
| 1つ前に戻る | Ctrl + Z |
| コピーする | Ctrl + C |
| 貼り付ける | Ctrl + V |
| 画面を移動する | スペースキーを押しっぱなしにしながらマウスを動かす |
最後に
Figmaは使えば使うほど、「こんなこともできるんだ！」と発見がある楽しいツールです。最初から完璧なデザインを作ろうとしなくても大丈夫です。自分のペースで、少しずつツールの操作に慣れていきましょう！