デザイン上達のために。バナートレースをやってみてよかったこととやり方を紹介します

 

こんにちは。カトヒサ（@hisayosky）です。

 

 

デザインやっている人に聞くと口を揃えて「トレースした」と言います。

そこでぼくもバナートレースをやってみることにしました。基本毎日やっています。

 

やってみて「これは上達するな」という手応えがありましたので、今回は「デザインの上達のためにバナートレースをやってみてよかったこと」を解説します。

バナートレース の前にやっておくと作業がラクになる教材もありますので最後に紹介しますね。

ではいってみましょう。

 

バナートレースをやってみてよかった３つのこと

バナートレース をやってみてよかったことは３つあります。

順番に見ていきましょう。

 

デザインをよく見る「目」ができる

まねようとすると自然に「デザインを分解して見る目」が養われます。

「ここグラデーション入ってるな」と気づくことができるようになります。

シンプルに見えるものでも意外と細かいことをしていたりするので「作るために見る」のは目を鍛えるのに効果的です。

 

ソフトの操作が上達する

作業では

を繰り返すので必然的にできることが増えていきます。

一度使えるようになったスキルは、その後にもたびたび出てきますのでスキルの定着も図れます。

 

デザインの引き出しが増える

真似とはいえ自分でデザインを作りますから、制作をするときに使える表現の選択肢が増えます。

作ったバナーから使える部分をそのまま取って使うこともできます。

デザインするときに使える選択肢は多い方がいいですよね。バナートレースをすることでデザインの幅が広げられます。

 

バナートレースのやり方

 

トレースのやり方について触れておきます。

「Webデザイナーが教えるおすすめバナー模写のやり方」を参考にさせていただいてます。

 

①お手本のバナーを探す

バナーが集められたサイトがあるのでそこから選びます。

ぼくは

 

をよく使います。

「ここどうやって作るの？？」という箇所がひとつかふたつあるものを選ぶのがコツです。

それでスキルの幅が広がっていきます。

 

②ロゴと画像を探す

バナーで使う画像は無料サイトからダウンロードできます。

よく使うのは「ぱくたそ」「PIXTA」ですね。日本人の写真はこちらからいただいてます。

PIXTAは有料ですが、カンプなら無料でダウンロードできます。練習にはこれで十分。

外国の写真なら「PIXABAY」。バナーよりブログでよく使っています。

 

画像によっては背景透過にしておかなくてはいけません。そういった処理もここで行ってしまいます。

 

③Photoshop・Illustratorで作る

お手本を左か上に並べて見ながら作っていきます。

ガイドを引きつつ同じように作ります。お手本の上に重ねてなぞるのではありませんのでご注意を。

 

ぼくはIllustratorを使って作っていますが、ツールに慣れるならPhotoshopでもやってみた方がいいでしょうね。。。

 

④お手本と見比べる

できたバナーはお手本に重ねて見比べます。ずれているところがあれば修正します。

 

⑤人に見てもらう

これはおまけですが、できたものは人に見てもらうのがいいかと思います。

チェックしてくれる上司や先輩がいれば最高。

いなくてもSNSで「バナートレース 100本やります！」と宣言して発表していくと、モチベーションが継続しやすいかもしれません。

ぼくは作るたびTwitterで公開しています。

 

Web デザインやるにしてもバナートレースはおすすめ

バナートレースのいいところは

 

というところです。

デザイン上達のハードルとしてちょうどいい高さなんですよね。

 

ぼくは最初Webページのトレースに取り組んでいましたが、トレースする量が多すぎて挫折しました。

なかなか完成しないのでモチベーションを維持するのが難しいですし、作業量が多いので調べながらスキルを増やすのには不向きと思いました。

 

Webデザインができるようになりたいとしてもバナーからで全然いいと思います。

Webページトレースの前にデザイン技術のかさ上げをしておく感じですね。

 

バナートレース で使うスキルをまとめて学べる教材

最後にバナートレース の前にやっておくといい教材を紹介します。

サンペー先生の「思わずクリックさせる魔法のバナー講座　超簡単！売れるデザインは、ただなぞるだけ」

世界最大のオンライン学習プラットフォーム「Udemy」の動画講座です。

サンペー先生の講座ではPhotoshopでバナーをトレースしていきます。

 

バナートレース で時間がかかるのは「やり方を調べること」です。

知っていたら簡単な基本操作って結構あるんですよね。

調べることはスキルアップに必要ですが、必要以上に調べるのは時間がもったいない。

ソフトの扱いやトレースの手順はある程度はじめに押さえておいたほうが効率的です。

 

Udemyには「30日間返金保証」がありますので、いまひとつだったら返品できます。

動画講座なので送り返す手間もありません。ほぼリスクなしで試すことでができます。

Photoshopの操作に自信のない方はぜひ試してみてください。

「こうすればできるのか！」と感動するくらいPhotoshopの操作がわかりますよ。

サンペー先生の「思わずクリックさせる魔法のバナー講座　超簡単！売れるデザインは、ただなぞるだけ」

 

まとめ：デザイン上達のためにバナートレースは有効。デザイン初心者にはハードルの高さがちょうどいい

バナートレース をすると、

• デザインをよく見る「目」ができる
• ソフトの操作が上達する
• デザインの引き出しが増える
• コツコツスキルアップしたい人にオススメのトレーニング

 

▼最後まで読んでくれたあなたにおすすめの記事
誰でもできるデザインアイデアの作り方。考えすぎて作れない人にコツ教えます