こんにちは。Halcanaです。
Webデザインの勉強の一環として、実際の広告バナーを題材にバナートレースに取り組んでいます。こちらの記事ではバナートレースの取り組み記録を残していきたいと思います。
振り返り
※実際に取り組んだのは7月です。
united-arrowsのセール告知バナーです！こちらは（確か）初めて取り組んだバナートレースなので、結構時間がかかりました。。。一番時間がかかったのはフォント探しだったと思います。ある程度は妥協も必要^^;
デザイン分析 – 色使い
このバナーのポイントはパッと目を引くビビッドピンクの「60（％）」と「SALE」ですね。ベースカラーのネイビーに対して、反対色になっているのでよく目立ちます。
反対色とは、色相環の反対に位置する色のことです。似た意味の言葉で「補色」もありますが、こちらは色相環の正反対の色を指します。それに対し、反対色はその両隣など少し幅広い範囲の色を指していることが多いように思います。
反対色を使うと派手になりやすいですが、このバナーはネイビー・ピンク・白の３色でシンプルにまとめられているのでそこまでキツい印象にならずブランドの上質なイメージも損なわないバナーになっています。
デザイン分析 – 動き
文字に傾きを加えていることも、「60」を目立たせるポイントの一つだと思います。
目立たせたい文字を傾けたり他の文字にかぶせることでバナーの中に動きが出て、情報の優先順位を上げるだけでなく全体として遊び心も感じられるデザインになっているのだと思います。
まとめ
今回はデザインの色使いと動きに着目しました。
Photoshopの操作に慣れるまで、しばらくは文字組・文字だけバナーのトレースが続きます。スモールステップで取り組んでいく予定です^^b
次のバナートレース記録はこちらから！
コメント