Creazy!

WEBエンジニア・ヤガーのテック・ガジェットブログ

Renewal2009 小技集

[N]ネタフル x [S]シカマケ = ブログデザイン勉強会 第2回:テーマ曲を決めて自分を更に深堀

投稿日:


ブログデザイン勉強会第2回
昨日はブログデザイン勉強会の第2回がありました。
まずは、前回のおさらいですが1枚絵に自己紹介を描いてきて皆さんに発表。
それから、今のサイトと比べてどうかという事を他の方からご意見いただきました。

個人的にはブログ/ブロガーとしての認知度UPのためのブランディングですね。
いまより良いイメージを与えるためにどこを変えるか・・・具体的には若返りwww
もしかしたら問題となっているかもしれないyagerアイコンも、黒い背景色も自分では気に入ってたりするので、他の部分を変える事によってブログのイメージを変える事ができるだろうか。

via: [N]ネタフル x [S]シカマケ = ブログデザイン勉強会 第1回に参加

大きくは下記2点が現状の課題として浮かび上がってきたわけです。

  • 実際よりもおっさん臭い(yagerアイコンが原因か…)
  • 全体的に重苦しい(黒ばっかりなのが原因か…)

問題点がわかるとどこを改善すると効果が出るかハッキリ分かるので、もうこの第1回だけでもかなり方向性は見えたような気がしました。
ですが、今回は更に深堀すべく「リニューアル後のテーマ曲を発表」という宿題が待っていたのです。これは結構悩みました。


結局、ボクが選んだ曲はコレです。
KISS of LIFE [Maxi]
B00005HY5F

【曲名/アーティスト名】
KISS OF LIFE/平井堅
【選んだ理由】
1)おっさん臭いと言われてるので→若返り
「瞳をとじて」とかしっとりラブバラードの印象が強い平井堅ですが、あえてダンスチューンを選んだのはやっぱり”若返り”。もうちょっとノリが良く、取っ付きやすいイメージにしたい。

2)実力派
技術系ブログなので、「本物志向」でありたい。「流行でR&B歌ってます」じゃなくて、ちゃんとR&Bが好きで、歌がうまい(技術力がある)ことを印象付けたい。

3)何気に歌詞も良かった
サビの部分、
“every day, every night, wanna kiss, want your lips”

“every day, every night, write some code, with useful tips”
に替え歌したいですw

【YouTubeURLなどもしあれば!】
http://www.youtube.com/watch?v=8CNcni1tp98&fmt=35

理由の3)は言い忘れたw まあ良いかどうでも良いネタでした。
それから、余談として平井堅はソッチ系の人に人気があるので、あやかって同業者に一目置かれるポジションになりたいなとか話したんですが、どうもソッチ系の話に花が咲いてしまいだいぶ横道にそれてしまいました。ごめんなさい皆さん。
ボクはゲイではありません。
深堀するとやはりどんどん見えてくるものです。前回の課題である、「若返り」と「重さを軽減」に加え技術系ブログとしての「信頼感」みたいなものを加えたいなというのが浮かんで来ました。んで、次は具体的にそれらをどうやって改善していくかという話になるのです。
順番が前後しますが、参加者それぞれの発表の前に講師のウジトモコさんからプチセミナーがありました。
その1:マーケティングとデザインを組み合わせる技術

  1. 間違えられてはいけない対象(ディレクション)
  2. クラスアップする?しない?(する)
  3. ターゲット広め?深め?(広め)
  4. クラスとタイプ(梯子の法則)
  5. らしさで最強の武器を=トーンアンドマナー

ブロガー向けの勉強会なので、みなさんクラスアップしてターゲット広めを目指したらどうですか?というお話がありました。
ボクの場合は、技術系ブログとしての信頼感を上げたいと思っているし(クラスアップ)、明るい印象にしてとっつきやすくしたい(ターゲット広め)と思っているので難しいとは思いますが挑戦して見ようと思います。
その2:視覚効果を最も効率よく使うには?
▼ポジショニングを明解にするデザイン戦略のコツとは

  1. 使用するフォントを統一すること:キータイプフェイス
  2. メインになるビジュアル:キービジュアル
  3. カラー戦略を決める:キーカラー
  4. 世界感や雰囲気をコントロールする:トーンアンドマナー

まず、フォントについては少しウジさんにも相談したのですが、今メインの見出しで使っている明朝体フォントが古くさい印象を与えているんじゃないかと思っています。これは、前に第10回:Windowsフォントをアンチエイリアスでキレイに見せる方法というエントリーを書いた時に、単純にアンチエイリアスの効いた明朝体フォントが美しかったので採用してみたのですが、この文字が与える印象とかあんまり深く考えてなかったんですねw なので、基本的にはゴシック体で統一していこうかと。
あとは、黒一色で重苦しいので明るい色の割合を増やそうかなと。あと、黒以外の色がリンク色のオレンジしかないのですが、新しいキーカラーを一つ足しても良いかなとか思ってます。黒自体は好きな色なのでベース色で置いといて、キーカラーでイメージチェンジ!
▼役割分担を明解にするデザイン戦略のコツとは

  1. あえて目立たせる?目立たせる?:メインとサブ
  2. 視点誘導のシナリオはある?あえて、放流?:ナビゲーション
  3. 役割分担できてる?あえて、なじます?:カラー
  4. らしさや遊びを忘れていない?:トーンアンドマナー

役割分担のところでは、デザインに「遊び」がありますか?という話題が盛り上がりました。最近だとGoogleロゴが「はらぺこあおむし」になってたり、「お、いつもとちょっと違うかな?」と思わせてユーザーを飽きさせない工夫をしているか?ということですね。
大手企業のサイトでもちょっとした遊びがあると注目してしまいますよね。さらに個人ブロガーだったらお偉いさんの圧力とかもないはずなのでお遊びもしやすい環境だと思うのです。(「遊び」と「悪ふざけ」の境界が難しいという話題もでてました。これもバランスが重要なんですね…。)
ボクとしても「遊び」の部分は大好きだし、特にポジション的に失うものもないのでなんか仕掛けを入れたいなぁと思ってはいるんですが…、多分、普通にデザイン上げるだけで精一杯かと。でも継続して考えます。
あと、不評の(笑)yagerアイコンも作り直そうか検討しています。
ただ、どちらかというとyagerアイコンは放っておいてサイト名をシンボル化して強調する事でサイト全体の印象変えられないかな?と思ったり。「メインとサブ」の関係の逆転というか、そもそも今のこのブログは「creazy photograph」というサイト名の存在が希薄だなぁと考えているのです。例えば、コグレさんの「ネタフル」や、いしたにさんの「みたいもん!」、いちるさんの「小鳥ピヨピヨ」とか、ブロガー名を抜きにしてもサイト名だけで価値を持ってるんですよね。
そんな有名ブログと肩を並べたいとか恐れ多い事を言っているわけではないのですが、どちらかというと自分が前にでて行くのは苦手なので、ブロガーよりもブログ自体が目立てば良いかなと。じゃあ、まずFavicon変えろよ!って話ですがw (告知:サイト名、微妙に変化する予定ですw)

まとめ

という訳で、自分のブログについて更に深堀されゴールが明らかになったのと同時に、次回は実践編でラフ案最低3つ(!)という難題が出されているので、また頭を悩ませる事になるでしょう。とはいえ、ウジトモコさんも言っていましたがバランスをみないと判断できないというのも分かるのでやっぱり3案くらいは必要なのかなと思います。
それから、ウジさんが釘を刺すようにおっしゃっていたのが、
「3案というと、B,C案はA案の劣化コピーになりがち」という話。
1個目のA案に全力を注いじゃって、B,C案はあんまりなできになってしまうという(あ〜あるある)。
それに対する方法としてウジさん自身がブログに書いていました。

方向性を変えて3案
方向性は同じでモチーフを変えて2案

via: 使える「デザインセミナ-」 : おすすめA案の呪縛から逃れるための「ワーク」

すごいよ、先生!参考にさせて頂きます!
え?クラスアップとかトーンアンドマナーとかが分からない!?
じゃあ、急いでシカマケ本を買って読んでくださいwww
視覚マーケティングのススメ (アスカビジネス) (単行本(ソフトカバー))
4756911994

-Renewal2009, 小技集

執筆者:


comment

メールアドレスが公開されることはありません。

関連記事

「TwitterFollowBadge」がIEで見れない件の対応方法

なんか、近くで嘆きの声が聞こえた気がするので(w)さらっと書いときます。 TwitterFollowBadgeっていう、ブログのサイド(右か左)にはれるTwitter用のブログパーツがあるんだけど、こ …

新しいFacebookページにStatic iframe形式でタブを追加する方法

【2011/02/21:追記】 iframe形式を使おうと思っている方は、こちらの記事も参考にしてください。 Facebookページのiframe形式タブに切り替える場合は、バグに注意! 少し前にfa …

Google Analytics に独自検索エンジンを追加している場合の問題と対応

今日まで夏休みなんですが、昨日まで出かけていた期間のアクセス解析をGoogle Analyticsで確認していたら、すごい勢いで下降線。というか、これは明らかにおかしいのでデバッグしてみるとGoogl …

Ffmpegで複数動画を結合して一つの動画に出力

いつも、動画変換においてやりたいことがあってもコマンドを思い出せないFfmpeg。今回もこのごろ良く使うものを自分用のメモを兼ねて記録しておきます。

MovableTypeで記事に挿入したFlickrやAmazonの画像タグをサムネイルサイズに変換して表示する方法

最近のブログやWEBメディアで、新着記事や人気記事の一覧を小さなアイキャッチ画像と共に表示しているのをよく見ます。画像があると、記事の内容が一目で把握できるのとともに、アイキャッチの名前の通り目を引き …

スポンサードリンク

スポンサードリンク