ズボラなUIデザイナーがバナー模写を3ヶ月続けたらデザインの可能性が広がった！

こんにちは、ajikeでUI/UXデザイナーをしているすえです。
今回はタイトルにある通り、勤務後に自習として行っていたバナー模写のやり方や、それを3ヶ月やってみた結果についてまとめていきたいと思います。

なぜバナー模写をはじめたのか？

昨年11月、私は業務の中でバナーを作ることになりました。(アジケのUIデザイナーはUIの他にもバナーやアイコンなどを作る機会があります。)
久しぶりのバナー、いいものを作るぞ！と意気込んで作成してみたら…

なんとも収まりの悪い・見栄えの悪い・わかりにくいバナーが出来上がりました。

修正しているうちに納期に間に合わなくなりそうになり、最終的に上長に協力していただき納品まで終えました。
その時、非常に申し訳ない気持ちと情けない気持ちでいっぱいになりました。自分のスキルがないばかりに迷惑をかけてしまった。自分は努力が足りていない。

そして決意しました。もう2度とこのようなことを繰り返さないためにバナーデザインの腕を上げるぞ、と。

ズボラ人間が習慣化するための工夫

そうと決まれば行動です。
バナーデザインの腕を上げるために、退勤後の時間を使って地道に特訓することに決めました。

しかし、タイトルにも書いたのですが私はズボラな性格です。
続けるぞと思ってはじめたことも、大体１週間もすればやらなくなるような人間です。そんなズボラな自分が習慣を身につけるには、続けるための工夫をする必要がありました。
以下、実際に行った工夫２点です。
(習慣化が苦手だな、という方の参考になればいいなと思い書きます)

１.  毎日やらなくていい　しかし、3日以上連続して休まない
毎日する！と決めて行うと1日でもできない日があると自己嫌悪に陥り、
そのまま気が乗らずにフェードアウト…なんてことが今までありました。
そこで、以前読んだ本に書いてあったことを思い出しました。
「習慣化する時、3日以上休むと習慣化は難しくなる」
ということは2日までなら連続して休んでも大丈夫なんだ！と都合よく解釈し、「毎日やらなくていいが、3日以上連続して休まない」というルールを作りました。
このルールを設けることにより、無理せず自分のペースで続けていくことができました。

２. 楽しいと感じられる方法でやる
当たり前なのですが、楽しいと感じることは比較的積極的に行えます。
その当たり前を取り入れようと、自分が楽しいと感じるバナーデザインの特訓方法を考えました。
そこで思い至ったのが、既存バナーの模写でした。
既存バナーの模写は自分の中にない表現方法を体験できるので刺激が多く、行っていてワクワクしました。
また、模写はあまり頭を使わず短時間でできるのに対し、得るものが大きいのも魅力的に感じました。疲れた日の退勤後に取り組めることも、模写を選んだ理由の1つです。

以上の２点を実行することにより、
11月から現在までの3ヶ月間、バナー模写を習慣として行えました。

実際に行ったバナー模写のやり方

では実際にどのようにバナー模写を行ったのか、について書いていきます。まず初めに、具体的な特訓方法を考えるために私が今回のバナー模写で増やしたい/伸ばしたいと思うスキルを整理しました。以下の３点です。

- デザイン表現(レイアウト/フォント/配色/装飾)の引き出し
- デザインの言語化能力
- デザインの制作スピード

そしてその３点を伸ばすために、

- バナー模写(詳しくは後述)
- 模写するバナーの「第一印象」と「模写をして気づいたこと」を文章でまとめる
- 模写する際にかかった時間を計測

上記3点を行いました。

実際に行ったバナー模写の一部を載せます。
(作成日順。下にいくほど新しいものになります)

模写の元となるバナーはネット上からいいデザインだなと感じるバナー、その中でも今までに作成したことのない表現が1つでもあるまたは今まで作成したことのないトンマナのバナーを積極的に選ぶようにしました。
そうすることでデザイン表現の引き出しを着実に増やせると感じたためです。
また、今回はトレースではなく模写なので画像の横にキャンバスを作成し模写をしました。色彩の感覚も身につけたかったのでスポイトも禁止しました。

バナー模写を3ヶ月やってみた結果

そんなこんなで続けられ、バナー模写を始めた11月から3ヶ月が経ちました。その結果、私に起こった変化を紹介します。

１.デザイン表現の引き出しが増えた
今まで自分が持っていた表現にはかなり偏りがある、ということに気づかされました。
既存のバナーを模写することで、自分の中に今までなかった表現を身を以て知ることができます。加えて、その表現を実際に作る方法まで模索しながら学ぶことができます。
新しくバナーを作る際に「このバナーだと模写でやったあの表現が使えるかも…」と模写で出会った表現を業務で応用するような機会もありました。

２.フォントに興味が湧きまくった
これは予想外の結果でした。
殆どのバナーには文字が載っています。そして様々な種類のフォントが使われています。既存バナーを模写することにより、たくさんのフォントと出会うことができました。
そしてその中で知ります。フォントそれぞれが持つ個性、特性、魅力…
今まで私は有名どころのフォントしかレパートリーがなく、
バナーを作る時、いつも同じようなフォントばかり使っていました…
フォントの世界がこんなにも奥深く、豊かだと知りませんでした。
今後バナーを作るときは、その舞台が一番似合うフォントを見つけ出すぞと心に誓っています。

最近ではフォントについてもっと理解を深めたく、フォントに関する書籍を読んだり歴史について調べたりしています。とても面白いです。
このことはとても大きな収穫だと感じています。

３.デザインすることがもっと好きになった
表現の引き出しが増え、フォントの奥深さを知り、私が理解していたデザインはごくごく一部だったこと。そして、デザインはもっと自由で可能性があるということをバナー模写を通じて実感しました。
自分にできる表現が増えること。たくさんの素敵なデザインに触れること。
バナー模写はデザインの楽しさ、豊かさを改めて教えてくれました。

今後は今回の習慣化の工夫や特訓のやり方を活かしてUIデザインの特訓もしていきたいな、と考えております。
その時はまた記事にできればと考えております。ありがとうございました！