2.デザイントレースのこつ

  • Home
  • 2.デザイントレースのこつ
コース内容
マインドセット編
0/1
5. デザイン添削
0/1
6. デザイン添削
0/1
8. コーディング振り返り・質問
0/2
9. コーディング1回目
0/1
10. コーディング2回目
0/1
14. 営業・提案・見積もり作成
15. 保守・運用
保護中: WEB制作【1期生】

Figmaを使ってデザイントレースを行っていただきます。
ツールに慣れていただくことがメインですが、せっかくなのでデザインについてもあわせて学んでいきましょう。

①導入

トレースは「そっくり作れるようになる」ためではなく「観察できるようになる」ための目の練習です。ただ写すのではなく、意図を考えながら行いましょう。

 

②トレースの基本的な進め方

トレースはデザイン制作と同じ流れで進めることがおすすめです。

  1. 要素を全部配置する
  2. 何を伝えたいか、情報の優先度を考えながらレイアウトを組む
  3. 色を入れる
  4. 装飾を加える

スポイトツールで色をひろったり、数値を見るのではなく、まずは自分の目や感覚で行いましょう。その後で数値を見て、どう違うかを確認していくと、目が育っていきます。

 

まとめ

  • トレースで鍛えるのは「観察力」と「言語化力」

  • “なんとなく違う”を言語化しよう