【バナートレース(模写)のすゝめ】未経験からWebデザイナーになった私の勉強法 ‧₊˚✧

【バナートレース(模写)のすゝめ】未経験からWebデザイナーになった私の勉強法 デザイン

 

cocoです🦔

私は未経験からコンサルロケッツのWebデザイナーになりました。
(なぜなれたのかはこちらのブログから〜)

カフェ店員だった私がロケッツのWebデザイナーになるまで‧₊˚✧
私は未経験からロケッツのWebデザイナーになりました。なんでWebデザイナーになろうと思ったか、どうやってなったのか、ロケッツの面接はどんな感じだったかを話していこうと思います。

今回はその際に行っていたWebデザインの勉強法を紹介します。

未経験からWebデザイナーを目指している方の参考になればと思います。

独学を断念〜オンラインスクールへ

Webデザイナーになるにあたり、まずは独学で勉強しようと思っていました(当時ニートでお金がなかったため…)。しかし少し取り組んだものの「これは無理だ」と諦めました。なのでオンラインスクールに通いながらデザインの基本を学ぶことにしました。

オンラインスクールは、よくInstagramなどの広告で見かけるところで、Photoshopの使い方やデザインの基本、考え方などを動画で教えてくれる内容でした。

自分のペースで進められるのが良い点ですが、逆に自分で取り組まないと進まない点はデメリットでした。

オンラインスクールに通ってみて

私は手帳が趣味で、もともとスケジュールを立てるのは得意なほうです。自分で決めたスケジュール通りに動けた日の達成感がとても好きなので、まず毎朝その日の目標を立てて、スケジュール通りに進めるようにしました。

私が通っていたオンラインスクールでは、先生に直接教えてもらったり、デザインについてフィードバックをもらえる環境が整っていました。いつでも質問ができる状況が勉強を進めやすくしてくれたと思います。
「いつでもアドバイスをもらえる環境」は、学習を進める上で非常に大切だと感じました。

職業訓練校とオンラインスクール

実際にWebデザイナーとして働き始め、採用側の立場になったとき気づいたのは、職業訓練校出身の方が多いことです。職業訓練校は費用がかからず決まった時間で学べるため、独学とは異なり「やらざるを得ない」環境がある点が魅力です。しかし逆に費用負担がないことで、本気度が下がる方もいるのではないかと思います。

自分でお金を払っていたら元取らなきゃと必死になるので、その点では私はオンラインスクールに通ってよかったと思います。ただ私の場合、オンラインスクールに入る前までは職業訓練校があるのを知らなかったので、知っていたらそっち(職業訓練校)に行っていたのに、、とはいまだに思ってます。

どちらがいいとかは私は職業訓練校に通っていないので、わからないですが、

 

とにかく気持ちが大事です。わら

まずはスクールの講義を受けて、基本を知って、そこから実践をしていきました。

cocoのデザイン勉強法

①バナートレース(バナトレ)

まず取り組んだのはバナトレ(バナーのトレース)です。

バナー作成やLP作成を進める前段階として、トレースを重点的に行いました。当時、オンラインスクールの受講生の間で流行していた『トレース&模写で学ぶ デザインのドリル』という本を参考にしました。
『トレース&模写で学ぶ デザインのドリル』

バナトレはPhotoshopの操作の基本が身につくので、最初はバナトレからするのがおすすめです。

 

初心者でイチからバナーを作るのはとても難しいので、お勧めしません。

バナトレの手順ですが、まずはがっつり元となるバナーをトレースします。アートボードに画像を入れて、なぞるように作成していく。元画像の透明度を下げて模写していきます。未経験のうちはPhotoshopの使い方もわからないので、ただ模写しているだけなのにめちゃめちゃ時間がかかりました。けれどツールの使い方や効果の付け方など、挙げればキリがないほどこのバナトレでPhotoshopの使い方を学びました。

バナトレの次のステップとしては「横にトレース元のバナーをおき、真っ白なアートボードに横に置いたバナーと同じバナーを作る」です。ようは書き写し?ですかね。これはこれで未経験からすると難しくて、模写(なぞるように作成)していた時は、無理くりにでもその形になれば作成できたのですが、真っ白な状態から作成となるとどうやったらいいのか、、

図形の作り方などでも、たとえば円や四角は簡単に作れるものの「雲の形」や「バッチの形」を作るにはどうしたらいいのか、、色々な作り方があるかと思いますが私は「Photoshop 雲 作り方」などで検索したら作り方を教えてくれている方がいっぱいいたので、そこで探しました。ただテキストだけだと、どこにそのツールがあるかわからないこともあるのでYouTubeなどの動画もめちゃめちゃいいです。YouTubeだと動きまでもが確認できるので、どのツールがどこにあるのかまでわかりやすく理解できます。

 

今でもよくYouTubeで調べます。

これをめちゃめちゃやるうちに最初は1つのバナーに何時間もかけていましたが、徐々にかかる時間も減ってきて「この時点でこのくらいのバナーなら何時間で完成させよう」など目標を立てながら練習していました。この一連の練習が「簡単だな」と思ったとき、バナトレは卒業してもいいかもしれません。

今でも参考のバナーを探して、同じような効果の付け方などをしてみたりしています。ただし、がっつりバナーをトレースしてしまっては著作権などに触れてしまうので、そのバナーの参考にしたい要素を取り入れたりしています(他のデザイナーさんも同じような考え方で制作しているようです)。このトレースの経験はWebデザインを学ぶ上でとても役に立ちました。

②バナーの分析

バナトレと並行して行ったのが「バナーの分析」です。

バナーには、文字や画像の配置、効果の付け方など、さまざまな工夫が凝らされています。これを分析することで、デザインの基礎を深く理解できました。記憶が曖昧ですが、私のバナーの分析はコンサルロケッツの面接時にも評価されましたので、やっていて良かったと思います。

おわりに

ひたすらバナトレを繰り返した結果、バナー制作のスキルが向上しました。ロケッツではLPよりもバナー制作の方が多いので、この経験がとても役に立っています。今でも時間があればバナーやLPの分析を続けています。

「分析」といってもどこの何をを分析するの?ってなると思うので、次回はバナーの分析方法について詳しく説明します!👋

ECの運営でお悩みの方!ロケッツに「ほぼ丸投げ」してみませんか?

ECサイトのコンサル・制作・運用業務に10年以上携わっているチームが、最短の成功法則を多角的に提案・実行・検証まで一貫して行います。
今後さらに拡大し、兆規模になっていくEC市場。
現在その中心にある大手ECモールの最新ノウハウと実行方法を熟知しており、常に最善のEC運営を実現していきます!

デザイン
シェアする
コンサルロケッツステーション
タイトルとURLをコピーしました