毎日20分でUIデザイン力がみるみる伸びる！
Figmaを始めたばかりの初心者にとって、
「何を練習すればいいかわからない…」
という悩みはよくあるもの。
ツールの操作を覚えるだけでは上達せず、
“手を動かしながら学ぶ” 練習法が最短ルート です。
そこでこの記事では、
初心者でもサクッと作れて、デザイン基礎とFigma操作が一緒に身につく
“最強の練習課題12選” を厳選して紹介します。
すべて 短時間でできる＆一人で完結する ものばかりなので、
「毎日1つだけ練習する」でも効果抜群です！
１｜SNSバナー（正方形）
習得できるスキル
- 文字サイズ・余白のバランス
- 画像・背景とのコントラスト調整
- 中央揃え・左揃えの基礎
バナーはデザイン練習の定番。
構図を考える力が鍛えられます。
２｜カードUI（縦型）
習得スキル
- Auto Layout
- 画像・タイトル・本文の配置
- 余白の一貫性
カードはUI設計の“基礎中の基礎”。
これを作りこむだけでレイアウトの理解が深まる。
３｜ヘッダー（PCサイト幅）
習得スキル
- 水平整列
- ナビゲーションの配置
- 余白の統一
- 配色バランス
Webデザインの顔になるパーツ。
シンプルでも整ったデザインが作れればレベルアップ。
４｜ログイン画面のUI
習得スキル
- フォームUI
- ボタンデザイン
- 文字間・行間の調整
実務でもよく使われる構成で、練習効果が高い。
５｜スマホLPのヒーローヘッダー
習得スキル
- 余白の広いレイアウト
- キャッチコピーのデザイン
- 配色の世界観作り
LPの最上部は“デザイン表現”を学ぶのに最適。
６｜チェックリストUI
習得スキル
- アイコンの扱い
- 行間・要素間のバランス
- Text Styleの使い方
整った情報リストが作れると実務で役立つ。
７｜ボタン（3種類）
習得スキル
- コンポーネント化
- ホバー状態のデザイン
- 影・角丸の調整
たったボタンでも学べることは多い。
UIの最重要パーツ。
８｜アプリ風のタブバー
習得スキル
- アイコン＋テキストの整列
- 間隔（Gap）の調整
- コンポーネントのバリエーション管理
アプリUIに必ず登場する基本パーツ。
９｜ブログカード（横型）
習得スキル
- 画像の扱い
- 情報の優先度整理
- 横並びレイアウト
- トランケーション（3点リーダー）
Web制作で頻出するパーツなので絶対に練習しておきたい。
10｜CTA（行動導線ボックス）
習得スキル
- コンバージョン導線の理解
- 目立つ配色
- レスポンシブ想定の配置
「資料請求はこちら」などLPでよく見る要素。
デザイナーとしての実務感が鍛えられる。
11｜アプリのプロフィール画面
習得スキル
- アイコン画像のマスク
- 情報の整理
- モジュール化したレイアウト
プロフィール画面は余白の感覚が鍛えられる最高の練習テーマ。
12｜ミニポスター（A4風）
習得スキル
- 階層構造（タイトル→本文→補足）
- 強弱（メリハリ）の作り方
- 余白と行間のコントロール
情報の整理力が一気に伸びる。
【重要】上達スピードを倍にする練習のやり方
① 同じ課題を「3回」繰り返す
1回目：慣れる
2回目：整える
3回目：クオリティにこだわる
3回やると“手が覚える”ので成長が早い。
② 必ず数値を使う（なんとなく配置しない）
- 余白 → 16 / 24 / 32
- フォント → H1 / H2 / Body を固定
- 角丸 → 4 / 8 に統一
これだけでプロっぽく見える。
③ Auto Layout を必ず使う
Auto LayoutはUIデザインの革命機能。
- 余白
- 整列
- 並び順
- レスポンシブ対応
これらが “自動で整う”。
初心者ほど Auto Layout縛り をしたほうが成長が早い。
④ 作った作品はSNSに投稿する
X（旧Twitter）に投稿すると、
- モチベが上がる
- 他のデザインを見て学べる
- 実績としてポートフォリオに使える
- フォロワーが増える
メリットしかない。
まとめ：練習テーマが明確なほど、成長スピードは速い
今回紹介した12の課題は、
Figma初心者が最短で実務レベルに近づくための黄金パターン。
練習課題12選まとめ
- SNSバナー
- カードUI
- Webヘッダー
- ログイン画面
- スマホLPヒーロー
- リストUI
- ボタン3種
- アプリのタブバー
- ブログカード
- CTA
- プロフィール画面
- ミニポスター
毎日1つでOK。
1ヶ月後には「別人レベル」で上達しているはずです。
#Figma #Figma初心者 #Webデザイン #UIデザイン #デザイン初心者 #Figma学習 #デザイン練習 #UIUX #AutoLayout #デザイン原則 #UIデザイナー #デザイン独学