インスタグラムのDMで「未経験でデザインの勉強をするには何をすればいいですか？」とよく質問をいただきます。
その際にまずおすすめしているのが「バナートレース」です。
実際私も未経験からwebデザインを勉強する際にバナートレースをしていました。
今回はバナートレースのやり方、メリット、感想などをご紹介していきたいと思います！
バナートレース とは？
バナートレースのやり方
01.バナーを選ぶ
まずはピンタレストなどの参考サイトでトレースしたいバナーを選びます。
ピンタレストはピンを立てるだけでお気に入りのものだけまとめることができるので使いやすいと思います！
ピンタレスト以外にもバナーのまとめサイトはいくつかあります。
レトロバナー
レトロバナー
優良なバナーのまとめサイトです。
サイズ・カラー・業種・テイストごとに探せます。
バナーデザインアーカイブ
バナーデザインアーカイブ
サイズ・色・業種ごとに探せます。
バナーデザインギャラリー
バナーデザインギャラリー
サイズ・カラー・地域ごとに探せます。
02.Photoshopでバナーをトレースする
- 選んだバナーをコピーして、Photoshopのアートボードに2枚貼り付ける。（Illustratorでも大丈夫です！）
- 1枚は見えるところに置き、2枚目は不透明にする。
- 2枚目の上からなぞるようにバナーをトレースする。
右は不透明度50パーセントにしてみました。
作業中のポイント
どこが揃っているのか見つけながら作業する
大体のバナーは揃っている部分があるはずです。ガイドを弾いたり、直線ツールでどこが揃っているのか探しながらデザインのルールを学んでいきます。
このバナーでは青い直線部分が斜めに揃っていまいました
分からない部分はネットで調べる。
調べて欲しい情報を見つける力もwebデザイナーには必須であるとスクールで学びました。
調べて解決したサイトはブックマークしておくと良いですよ！
慣れてきたら、下記のやり方も挑戦して学びを深めていきましょう♪
- 見本を下に敷かずに、横においた見本を見ながらトレース
- 自分でこうしたほうがいいと思う部分を加えたり、修正してみる
バナートレースが終わったらSNSで発信しよう♪
まとめの画像を作る
一枚見ればどんなバナーだったのか、何を学んでいたのかがすぐに分かるような画像を作ってみましょう＾＾
カラーやフォント・デザインをトレースしたバナーのデザインに寄せて作ると、アウトプットにもなります。
どんなことをまとめるのか
- 作業時間
- デザインの考察…カラーやフォントについて
- 反省・課題・学んだこと・できるようになったこと
- 参考にしたサイト
- 工夫したポイント
- このバナーは見た人にどんな印象を与えるのか
- どこのデザインがどのように良いと思うのか
- どんなデザインが使われているのか
作ったまとめ画像をSNSで発信する
作った画像はぜひSNSに投稿してみましょう＾＾
- 人に見せるから頑張ろう！となる
- いいね♡やコメントやフォローが励みになる
- 「毎日トレースします！」と宣言することで嫌でもやるようになり続けられる
- コメントでアドバイスをくれることがある
一人でやっていてら、途中でやめていたかもしれない・・・。
バナートレースのメリット
バナートレースをして気付いたこと・学び
私がバナートレースをして、気づいたことは以下です。
- 縦横、揃っている部分が多い
- 文字デザインは設定が細かい
- フォントは多くてもだいたい３種類まで
- 全体的に統一感がある
- 良く使われているデザインが分かる
文字デザインは設定が細かい
バナーは文字のデザインにすごく力を入れています。
見やすいように大きさ・フォントの種類・背景との明度・文字間を細かく設定してあります。
なので、文字は良く考えられて作られています。
良く使われているデザインが分かる
数をこなしていくと、「あ！このデザイン前にもあったな！」という瞬間が何回も出てきます。
良く使われているデザインを身を持って実感することができます。
バナートレースのお勧めポイント
- インプットとアウトプットが同時にできる
- デザインの引き出しが増える
- ツールの使い方に慣れる
- 慣れていくことで作業時間短縮に繋がる
- 実力不足が分かる
インプットとアウトプットが同時にできる
プロのデザインを学びながら、今まで勉強したテクニックを使ってトレースするのでインプットもアウトプットもできて一石二鳥です！
慣れていくことで作業時間短縮に繋がる
作業時間に関しては、「このデザインはどうやって作られているのかな？」と迷う時間がなくなるし、ツールもスムーズに使えるようになっていき、時短になりました。
教訓
私は最初の頃は時間をかけて丁寧に作業していたのですが、途中から時間を意識してトレースが雑になっていってしまいました。もっと時間をかければより見本に近づくのに妥協して終わらせることもありました。
早く終わらせることも大事ですが、時間を削ることで学びが減るのはもったいないです。
分からない部分・再現できていない部分は時間がかかってしまっても、１つ１つ調べてできることを増やしていくべきでした。
▼もっとデザインを勉強したい方へ！おすすめの本をまとめました！
終わりに
バナートレースをして、私は実力不足をひしひしと感じて落ち込むこともありましたが、自分にはどの部分が足りないのかを知ることができました。
バナトレース時代を経て、今は自分でバナーやアイキャッチなどを作れるようになりました。あわせて読んでいただけると嬉しいです♡
では、また🐑🧡
導線迷子やデザインの魅せ方に
悩んでる女性起業家さんへ
集客導線・世界観をサポート
Webデザインを中心に制作してます＊
