バナートレース#14 cyma

作業時間

オリジナルのバナー

バナーの概要

自転車通販サイトcymaで割引キャンペーンが開催されていることを伝えるバナー

バナーのターゲット

・自転車の種類は問わない自転車を購入したいと思っている人
・ネットで自転車を購入しようとする人・・・どちらかというと田舎で近場におしゃれな自転車を売っている店がないような土地に住んでいる人
・どちらかというとシンプルでスマートな感じの人
・芸能人でいうと：要潤さん（自転車が好きらしい）

バナーのポイント

・30%オフという部分を一番に伝えたいというのがわかる。
・いろんな種類・いろんな色の自転車があることがわかる。
・縦と横のラインがきっちりと揃っている

トレースの経過

15分：写真を探し、構図を作り、文字を入れている最中。
今回見つけた写真は、あとで使おうとした時に想像していた感じに全くならなかったので使うことをやめてイラストで代用した。

30分：フォントの調整。バナートレースしていてfuturaのフォント使われている頻度が高いことに気づいた。

45分：フォントの調整の続き。文字同士の位置関係を見ながら調整をしていた。

その後最初にダウンロードした写真の切り抜きをしたが、イメージと違ったため他の写真を検討。フリー素材でしっくりくるものがなかったので、今回はイラストで代用することにした。イラストを探している最中。

60分：Freepikでいい塩梅のイラストを見つけて配置している最中。
aiデータだったので、自転車のイラストの色をオリジナルの写真の色に変更。
※Freepikのプレミアム会員ではないので、クレジットを左下につけています。

75分：自転車のイラストの配置が完了。
フォントの色を変更。

83分(完成)：全体の外枠に1pxの線をつけた。
オリジナルの画像と見比べて、「国内最大級の...」の文字を太くした。
cymaの部分は太すぎる＆小さい気がしたので、細くしてサイズをあげた。
あと、トレースした方のMAXの文字が横長のように見えたので、フォントの幅を狭くして完成。

重ねた結果：cymaの部分はぴったり！ぴったりだと気持ちいい。
MAX30%OFFはベースラインの設定ができてなくて、オリジナルよりも上になっている。

構図

調べたこと

技術的な面ではないが、freepicの利用にあたってクレジット表記について調べた
→ https://www.curioscene.com/use-of-freepik-and-guidelines/

思ったこと

始まる前は縦横が揃っているように見えていたが、いざ詳しく見てみると、きっちりとは揃っていなかった。

トレースを始めた頃よりフォントの調整ができるようになってきた感じがする。
＜離れて見比べる→修正する＞という工程を入れるだけで全然クオリティが変わる。
スピード感ももちろん大切だが、変な方向に進んでないか立ち止まって見てみることも大事。

＜カラーについて＞
・テキストに使われているのは黒ではなくて濃いグレー
グレーにすることで少し柔らかい感じになっている。

・自転車の色は上下で真ん中以外は同系色になっている。
紺系とオレンジ系は離して置かれている。
色的には右下のオレンジの自転車が特に目立っている。