※回答一覧

 出題者   カテゴリ   作成日

浅野		 デザイン　－鉄則と時短テクニック担当 2014-05-01 13:42:39
 問題   ヒント   回答数 
■素早くカッコ良いバナーの作り方
はじめまして。浅野ともうします。よろしくおねがいします。
今回は、ウェブ担として効率的なバナーの作り方について考えます。

1.　自分で作ったデザインや自社のデザイン(たとえばバナー)で今ひとつ垢抜けなくて悩んでいるもの、もしくは別サイトで「これは真似したい!」と思うものを1つ提出してください(URLをお願いします)

2.そのデザインでは、誰に、何を伝えて、どんな印象をもってもらうべきだと思いますか?

3.1のデザインで、2がうまく伝わらない(もしくは伝わる)のはなぜだと思いますか?

実際に制作されている方はソフト名、バージョン、OSもあわせて教えてください。よろしくお願いします。		 9

 

メンバーの回答一覧　お疲れ様でした！
※講師コメント詳細は冊子に掲載されています。

なるほど
票数		 回答 講師コメント
2 りきまる
「これは真似したい!」と思うもの
→http://retrobanner.net/wp-content/uploads/2014/03/20140327-140013.jpg

誰に、何を伝えて、どんな印象をもってもらうべき
→英語で会話をしたいニーズを持っているユーザーに対して、最短30日で英会話がマスターできる商材であることを伝えて、1日5分という手軽さと、その積み重ねによって世界中の人と交流が取れるようになるという「不安<期待」の印象を持ってもらう

伝わるのはなぜ
→わかりやすく、英会話を求めている人のゴールが伝わりやすいキャッチコピー
→1日5分と明確に数字にしているため負担が軽い印象を伝えやすい
→最短で30日とゴールまでの期間がつかめているため30日はがんばろうと目標としやすい

ソフト名、バージョン、OS
→PhotoshopCS6、win7		 なし (浅野　桜)
2.3.はおっしゃる通りだと思います。丸田さんの回答も英会話でしたから、対称的なバナーで興味深いです。こちらのバナーのいい点は、ご指摘の通りメリットがきちんと示されていることですね。特に「１日5分」「最短30日」というワードは、時間がない人にとっては“刺さる”と思います。
1 YN
1. 別サイトで真似したいと思ったバナー
Amazon.cojp のKindleの宣伝バナー:左40%くらいでkindle paperwhiteを、右60%くらいでkindle fire HDXを紹介しています。
http://g-ec2.images-amazon.com/images/G/09/kindle/merch/2014/campaign/pricedrop-KT/split-bunkbed-KP-KT-pricedrop-JP-660x180._TTH_.jpg

2. e-リーダーを探している人に、タイプの異なる端末を同時に提示して選択肢を与えます。この場合、商品の明確な対比により、ニーズにより近い商品を選択しやすくすることが重要だと思います。(違いが分かりにくい類似商品を並べると、かえって選択を困難にさせる恐れがあります)。また、どちらもシンプルで気軽に使える印象を与えることにより、e-リーダーやタブレット端末を所有したことのない人に対するハードルを下げることも重要だと思います。


3.
・それぞれの商品の対比が明確で、特性が直感的に分かります
・派手なキャッチコピーやイクスクラメーションマークを使わないことにより、シンプルさ(使い勝手の良さ)を示唆することに成功していると思います。。
・カラフルで華やかなkindle fireに比べ、paperwhiteはモノクロ画面ということもあり、地味ではありますが、決して見劣りすることなく、クールでポジティブな印象を醸していると思います。そのため、それぞれの個性が尊重され、両者が互いに引き立て合っている印象を受けます。		 なし (浅野　桜)
2.3.ともに、おっしゃる通りだと思います。amazonサイト内でのkindleのプロモーションということで、（極端に言うと楽天のような）表現を抑えたトーン＆マナーを採用しているのだと思います。
1 丸田
1.これはよい、と思ったバナー
http://retrobanner.net/archives/5109


2.
英語の勉強が続けられなくて、続けられない自分をなんとかしたいけど、意志が弱くてできないなぁと思っている人


3.
伝えたい箇所が目立つようになっている

ビジュアルの選定(宅配便のスタッフ)とサービス名がリンクしていてわかりやすい

色の使い方に清潔感がある
宅配便のスタッフはアイボリー系、背景が白なので、
キャッチコピー(ブラック)、サービス名(グリーン)が引き立てられている

以上です。		 なし (浅野　桜)
「見立て」が上手なバナーですね。バナーに限らず、町中の面白い広告（グラフィック）はこういった「見立て」が上手いものが多いです。色彩についてもおっしゃる通りだと思います。 ただ、どういったユーザーに対してのバナーなのかが分かりませんでした。英会話をバリバリやりたい方なのか、一度挫折した方なのか、英会話学校に行く時間のない方なのかetc...外部に出稿しているバナー広告ですから、そういったユーザーに“刺さる”ような文言があっても良いと思いました。（りきまるさんへのコメントもご覧下さい。）
1 DMG
折角なのでWeb担当者通信のバナーについて記載いたします。

1.
A:今ひとつだなあと思った画像
http://image.moshimo.com/af-img/0251/000000011434.jpg

B:これはいいいなあと思った画像
http://webtan-tsushin.com/img/catch_cmp.png

2.
Aの画像は
業界のトップランナーかどうかは、画像を見せても本当にその人が
業界の有名人かはバナーだけでは判断出来ないと思いました。
ターゲットを絞り切れて無いように感じました。

Bの画像は
非常に分かりやすくて、クリックされる画像だと感じました。
「困ったWEB担当者が、相談できる場」としてターゲティングも
きちんとされている。とても分かり易いバナーだと思いました。

3.
ターゲティングがはっきりしているかどうか、だと思います。
分かり易い言葉で、誰にむけたメッセージなのかを明確化することで
伝わり、クリックされやすいバナーが制作できるのではないでしょうか。		 なし (浅野　桜)
3.についてはおっしゃる通りだと思います。Bは特にコピーが明快ですね。逆に、A.は（本当にその人が業界の有名人かはバナーだけでは判断出来ないけれど）人数が多くてなんだかバックアップ体制が万全そうだ！＝安心！という考え方もできます。これを楽天さんなどでは「人気（ひとけ）」などと言っています。 実際の所のコンバージョンの比較が気になりますね！興味深い回答ありがとうございました。
0 SUGIMOTO
1、自分で作ったものではないが、良かったと思うものです。
http://gmobb.jp/lp/xmax/images/gm_img01.png

2、普段外出しているときにPCでインターネットを良くする人で、テザリングではまだ物足りないと思っている人に乗り換え、もしくは、追加のルーターとして検討してもらえるようにする。

3、ちょうどモバイルルーターが欲しかった時に、ネットサーフィン中に流れて来ました。ちょうどいいタイミング(検討中)に、良い商材がバナーとして表示されると、思わずクリックしてしまいます。「鬼安」という表現もユニークだと感じました。		 銅 (浅野　桜)
1.について、私も2.と同じような印象を持ちました。こういった価格訴求系のバナーはインパクトが勝負ですから、「鬼安」と「青鬼のビジュアル」「デザイン要素としての青色」がマッチしているところが上手いです。 こういった表現は良いですよね。いわゆるチラシ的なデザインで、私も好きです（作るのも）。 ファーストインパクト勝負のバナー広告らしいよい実例を挙げていただいたので、「銅」に選ばせていただきました。
0 chichichi
1.▼自社バナー
http://www.f-l-daiichi.com/image/bnr-gelato-m.gif

ソフト名、バージョン、OS:　Photoshop CS3, win XP

▼真似したい
【A】http://retrobanner.net/wp-content/uploads/2012/01/20120119-100013.jpg
【B】http://www.shop.jal.co.jp/info/CSfInfo.jsp?df=kdw&ic=kdw_cake&sp
(うまくちょうどいいバナーを見つけれずそこそこ、な気もしますが)

・【A】【B】余白のある高級感あるデザイン
・【B】のコピーで魅せる手法は、スイーツみたいな嗜好品には良いかも・・・と。
　　ただ、自店は業務用なのでもう少し分かりやすい方が良いかもしれません。
2.
誰に:　業務用のジェラートを探している方。
何を:　業務用に最適・受賞商品もあるしっかりした品質・こだわり素材でおいしいを伝えたい
どんな印象:　本物志向、こだわってる、プロも安心して使えるなど

3.
世界4位のポイントが、魅力的に見えてないのと、業務用かどうかが見えにくいと思います。
デザインも不足な印象。

用意できる写真が限られていて、別デザインといっても難しかった。
制作当時は、キャッチコピー・デザインスキル、ターゲットなど等、
思うように考えられなかったからだと思います。		 銀 (浅野　桜)
お作りになったバナーについて回答します。 １）写真は極力大きくしましょう。グラスなどははみ出してもかまいません。食べ物の場合はテクスチャーやキメ、ツヤが大げさに出ていた方が美味しそうに見えます。 ２）文字は明朝体にしてみてはいががでしょうか。（高級感の演出） ３）世界4位、というのがジェラートの賞について知識のないユーザーにとってはどのくらい凄いのかが伝わりづらいと思うのですが、プロユースの商材ですから、●●●賞（2013年度）4位など、賞の名前などもっと具体的に言ってしまえば、逆に、専門性の高さがうたえるので、想定されているユーザーへ響くのではないでしょうか。 非常に考え、実際に手を動かされていることが伝わってきましたので、「銀」に選ばせていただきました。
0 gabber1090
1. http://goo.gl/eFlRvT
※制作は外注です。

2. サイト上では50枚までの価格が表示されてお、またカートのシステム上の制約で99枚までが注文限度です。100枚以上の場合には本来大幅な割引が適用されますため、それらを想定した見積りをバナーの先にあるページから可能である事を告知したいとの思いです。

3. 「見積りフォーム」がその先にあると想像できないからかなと思います。		 金 (浅野　桜)
バナーにある「100枚以上〜」よりは >100枚以上の場合には本来大幅な割引が適用されます このコメントをそのまま掲載しても良さそうです。おっしゃるように、3.は確かに気になりました。ボタンというよりはリンクのないバナーにも見えますね。 例えば、「『大量注文受け付けます』〜99枚@100円、〜200枚@60円etc....まずはお見積もり！［クリック］」 などはいかがでしょうか。 また、「営業時間内３時間以内に即答！ですとか、最短●日納品」など、価格以外でも訴求できる点があるとより良いかもしれません。 問題点をきちんと理解されていること、「回答」がご自身の中にあることで、今回「金」に選ばせていただきました。
0 kamino
1.　自分で作ったデザインや自社のデザイン(たとえばバナー)で今ひとつ垢抜けなくて悩んでいるもの
http://www.bigsize.co.jp/list/t/5864/

もしくは別サイトで「これは真似したい!」と思うものを1つ提出してください(URLをお願いします)
http://www.bambooshoots.co.jp/


2.そのデザインでは、誰に、何を伝えて、どんな印象をもってもらうべきだと思いますか?
誰に　→　お客様に
何を伝え　→　スノボの良さ、楽しさ、商品機能
どんな印象　→　スノボ楽しそう!行ってみたいな



3.1のデザインで、2がうまく伝わらない(もしくは伝わる)のはなぜだと思いますか?
・「誰に」「なにを」伝えたいのか?ということを明確に考えていなかったから
・商品機能を紹介することも目的だったが、いつの間にかそれだけになっていた

・ソフト名　Fireworks
・バージョン　CS5
・OS　Windows7		 注目 (浅野　桜)
2.について少し掘り下げてみました。 >スノボの良さ、楽しさ、 ウェアの紹介ですから、スノボを既にやっている、やりたいという方がページを見に来るのではないでしょうか。 そう仮定すると、「スノボが楽しいかどうか」ではなく「自分のスノボスタイルに合っているかどうか」を知りたいのだと思います。スノボそのものの楽しさというよりは「これを着ればもっとスノボが楽しくなる」ということを訴求するわけですね。「体の大きな男性ユーザー」に「この商品によってスノボが楽しくなる」というベネフィットを伝えるためには、例えば機能や価格、デザイン性が良いこと、などをしっかり伝える必要がありますね（体の大きい方が特に気にされる点もあると思います）。テクニック的なことを言うと、例えば「従来品との比較」「ディティールの訴求」が挙げられると思います。 PS.デザインスキルとしては問題ないように思います！
0 yukko
1. 自分で作成したバナーです。

http://www.bigsize.co.jp/list/t/8344/

2.
誰に:体の大きな男性(ウエスト100cm以上)
何を:今まで販売していたブランドが定番路線からクラッシックなアメカジ路線に
　　　テイストを変更したことを伝えたい
どんな印象を:オシャレで新しいブランドのような印象を持ってもらいたい

3.
うまく伝わらない理由:自分自身が今までのテイストと新しくなったテイストとの違いが差ほどないと思いながら無理やり制作をしてしまった。そのため何を軸にするべきか?ということが決まらず、思いつく要素を入れ込んでしまったため。



ソフト:Fireworks
バージョン:CS5
OS:Windows7		 なし (浅野　桜)
2.3.についてはその通りだと思います。ご自分でよく理解されているのに「うまく伝わらない」と思われるのはなぜかを考えるだけで良くなると思います。（実際の数値が分からないので、これが悪いページか判断はできないのですが） こちらから挙げるとすれば、「新作感」「変わった感」がパッと見て少し分かりにくい点が気になりました。色合いがすべて近いからでしょうか。その部分だけを明るい色を使って目立たせるだけでも変わると思います。また、素材や規約次第ではありますが、ブランドの歴史を見せる（過去の服を見せるなど）ことで、比較していくのも良いでしょう。 PS.デザインスキルとしては問題ないように思います！