うるちです！
久しぶりに何か雑記でもと思い、書いてみることにしました。
あたうる興業はアクセスアップのため日本ブログ村というサービスを利用しているんですが、ここではランキング用のオリジナルバナーが作れるんですよ。
とあるブログでオリジナルバナーを作っている人を見かけて、これ面白いなと思って自分でもひとつ作ってみるかーと、軽いノリでやってみたんですが。
結果的に、ものすごく時間と労力を使うことになっちゃいました。というのもね、作ってみて思ったんだけど私デザインセンスの欠片もない！
デザインについて無知な初心者
デザインなんてマトモに勉強したことないので、そもそも「良いデザインとは何か」について何も知らないしわかってないのです。
そういうヤツがバナーとか作ろうったって、そりゃうまくいくわけないですよね。
最初はよくあるバナーのサイズにしようと思って、120×60で作ろうとしたんですよ。
あらかじめ大きく作って縮小かけた方がキレイになるっていうから、4倍位のサイズで作って縮小してみたんですがこれがもう散々でした。
まず、文字がつぶれて読みにくい。背景とかもこだわって、ブログのカラーと合うようなストライプにしたのに縮小すると存在感が薄い。
かといって無理やり視認性を上げるため文字色をド派手な黄色とかにすると、元々のカラーと合わずに浮いてしまいめちゃくちゃダサい感じになる。
ちっともしっくりこないので、時間は消費したんですがボツにしました。その記念すべき（？）ボツバナーはこちら。
ちなみに左下に空間が空いてるのは、ここにブログ村のバナーを埋め込むためです。
このサイズだと画数の多い漢字はつぶれて読めないし、あまり長い文章も書けないしで意外と制約が多いなーという事に気づきました。
「読みやすい」と「すっきり感」と「オシャレ」を全部兼ね備えたバナーを作るには、素人じゃとても手に負えん。プロの技術力を思い知らされましたね。
プロの仕事を参考にする
改めて後日バナー作りに挑戦。まずはプロデザイナーがどのようなバナーを作っているのか参考にするために、ASPのバナー広告を見にいくことにしました。
120×60という小さな空間に、プロはどのような要素を詰めているのか？複数案件の広告を見比べているうちに、素人の私でも気がついたことがありました。
- 色をあまり使い過ぎない。ベースカラー+2～3色くらいの構成が多い
- 使う色も視認性の高い白・黒・赤・黄色・オレンジなどのはっきりした色が多く使われている
- 一番伝えたい文字やロゴを一番大きく、目立つ色にする
- ベースカラーは単色が多い。柄とかグラデとかあまり使ってない
- ベースカラーが白なら枠線をつけるなど、バナーと背景の境目をはっきりさせていることが多い
プロの作ったシンプルかつすっきりしたバナーをひと通り見た後、自分の作ったボツバナーを見るとあまりにゴチャゴチャしているのが丸わかりでした。
色々考えて、まずブログのテーマカラーに合わせるのをやめることに。小さくてもちゃんと見てもらえるバナーを作るには、視認性が最優先だと感じたのですよ。
パキッとした見やすい色にして、文字に枠線つけたりみたいな余計な装飾も取っ払うことにしました。フォントもポップ体はやめよう。文字がつぶれる。
そして作ってみた2つ目の試作品バナーはこちら。
いきなりサイズ変わってますが、さすがに120×60は小さすぎて素人の私にはレベルが高いと思ったので、もう少し大きくして情報を入れられるようにしました。
ベースカラーを黄色系にすれば、白背景でも黒背景でもそれなりに見やすいです。直球のまっ黄色だと目に厳しいかと思って、少しオレンジ側に寄せてます。
フォントもあっさり目のゴシック体に変更。おかげで雑記ブログの「雑」の字みたいなやや画数の多い漢字も、何書いてあるか読める程度には見やすくなりました。
配置もブログの「ブ」の字がバナー中央部にくるよう調整し、それに合わせてあたうる興業の文字もバランスを整えています。
最終的に決定した3つ目のバナー
まあこれで決定でもいいかなーと思ったんですが、実際にブログ記事に張りつけてみると、ブログのテーマカラーと離れすぎてて少々浮いてる感が出てしまいました。
この問題を解決するため、あえてベースカラーは白にすることに。白ならブログ内でも普通に使われているため、うまく馴染んでくれるだろうという目論見です。
そして境目をはっきりさせるために、枠線をプラスしました。枠線も少し太めに引かないと縮小かけた時に細くなっちゃうので、何度かやり直しつつバランス調整。
枠線太くした分文字やイラストは少し縮めて、枠内に収まるよう気を付けました。
そして最終的に採用されたバナーがこちら。
一番最初のボツバナーと比べると、かなりすっきりして見やすくなったんじゃないかと思います。プロには及ばないですが、私なりに頑張りました。
終わりに
自分でバナーをデザインしてみると、たかが小さなバナーひとつでもプロが作るものはいかに丁寧に作られているかがわかりました。やらなきゃわからんもんだね。
日常にあふれるありとあらゆる製品たちも、こうしてどこかのデザイナーが試行錯誤しながら培った技術によって、支えられているのかもしれません。
以上、うるちでした！
気に入っていただけたら、クリックよろしくお願いします！
