見出し画像

2ヶ月間バナーレビュー&トレースをやってみた!まとめ

こんにちは、nattsu(@nattsu330074)です。


9月中旬から11月中旬の2ヶ月間、バナーのレビュー&たまにトレースをやってみたので、やり始めた経緯から方法、感想までをまとめてみたいと思います。
とりあえず、バナーレビュー&トレースってどんなことをしたのか??

スクリーンショット 2021-12-27 16.50.21

こんな感じでfigmaを使って、気になったバナーを集めてその横にレビューを書く&トレースしていました。
次から詳しくまとめていきますので、良かったら読んでいってください!


1.バナーレビュー&トレースを始めた経緯

デザイナー歴2年目も終盤になってきて、デザインがいまいち上達していないことに危機感を感じていました。どうしたら良いかなあと思い、色んな方のブログやtwitterなどを見てみました。現状の私に最適な方法は、レビューで目を肥やす&トレースで手を動かすを地道にやっていくことだという結論にたどり着きました。

しかし、過去に1日1サイトレビューもトレースも挫折をした経験がある私。どうやったら継続できるか考えた時に、まずはバナーをしっかりレビューすることから始めてみようと思いました!
レビューのついでに気になるバナーはトレースして行こうという方針で、バナーレビュー&トレースを始めました。


2.バナーレビュー&トレースの目的

バナーレビュー&トレースを行うにあたって、私の立てた目的は以下です。

①デザインを詳しく見る、なぜを考える
→なぜこのレイアウト、配色、フォント…etcを考えてみる
②自分のデザインの引き出しを増やす
→このデザイン使えそう!と思ったものをメモする&トレースする
③figmaの操作に慣れる



3.バナーレビュー&トレースの方法

①バナーを探す
よくお世話になったサイトはコチラです。

Pinterestでも探しました。素敵なギャラリーサイトさん、いつもありがとうございます。

②見つけたバナーをfigmaへペーストし、左側にレビューを書く

スクリーンショット 2021-12-27 16.56.04

上記の目的の通り、なぜを意識してレビューしました。特に自分の引き出しとして覚えておきたいことは、赤文字にしました。

③バナーの右側にトレースする

スクリーンショット 2021-12-27 16.57.25

全部はトレースせず、業務で使う機会がありそうとか、真似したいと思ったバナーをトレースしていきました。
トレースの方法としては、隣に並べてみながらトレースする方法で行いました。
画像については、figmaのプラグイン「Unsplash」を使ってダミー画像を入れました。すごく便利なプラグイン!figmaすごい!!



4.バナーレビュー&トレースをやってみた感想

・デザインの引き出しが増えた!
自分ではやったことが無かった配色・レイアウトを知って、引き出しが増えました。色んなバリエーションのバナーを探して見ると面白いです。

・継続が出来た!
挫折経験の多い私でしたが、バナーレビューは継続して出来たと思います。1つのバナーに時間をかけて見ることが出来たので、細かいところに気づくことが出来たと思います。

・figmaに慣れてきた
figmaを使ってトレースする中で、これはどうやれば良いのだろう?という疑問が出てきて、それをクリアしていくことで、figmaの使い方を学んでいくことが出来ました。トレースは新しいデザインツールの練習にもとても有効だと思います。


5.今後について

バナーの次は、Webサイトのファーストビューのレビュー&トレースをしようかと考えています。最終的にはサイトレビューに取り組みたいと思っています。



今回の記事が誰かの参考になっていたら嬉しいです。
またファーストビュのレビュー&トレースのまとめも出来たら良いなと思います。

この記事が気に入ったらサポートをしてみませんか?