Figmaを使ってデザイントレースを行っていただきます。
ツールに慣れていただくことがメインですが、せっかくなのでデザインについてもあわせて学んでいきましょう。
①導入
トレースは「そっくり作れるようになる」ためではなく「観察できるようになる」ための目の練習です。ただ写すのではなく、意図を考えながら行いましょう。
②トレースの基本的な進め方
トレースはデザイン制作と同じ流れで進めることがおすすめです。
- 要素を全部配置する
- 何を伝えたいか、情報の優先度を考えながらレイアウトを組む
- 色を入れる
- 装飾を加える
スポイトツールで色をひろったり、数値を見るのではなく、まずは自分の目や感覚で行いましょう。その後で数値を見て、どう違うかを確認していくと、目が育っていきます。
③クオリティアップ
小さな部分で、デザインの印象は大きく変わります。
- 行間
- 文字間
- 角丸
- シャドウ
④まとめ
-
トレースで鍛えるのは「観察力」と「言語化力」
-
“なんとなく違う”を言語化しよう
