メイン | 2006年06月 »

2006年05月30日

ダ・ヴィンチ コードと黄金比とWEBデザインレイアウト

今はやりの「ダ・ヴィンチ コード」をココにつなげてきましたか〜って感じだけど。まあ、訊いてよ。

ダ・ヴィンチコードの中で、暗号解読の糸口になっていたのが、「フィボナッチ数列」でした。そして、ここから話は「黄金比」へと発展して世界一美しい数値「1.618」へと話が向かう。
この一連の流れを、本書WEBデザインレイアウトでも『うつくしいデザインをつくる魔法のレイアウトバランス』として取り上げ、デザインやレイアウトを美しく仕上げるためのコツとして紹介しました。特に、「フィボナッチ数列」から導き出される比率をレイアウトバランスに置き換え、厳密な黄金比でなくても、レイアウトとしての完成度を増す理由であることを解説しています。

この魔法のレイアウトバランスは、最初は意識しないとなかなか実行できないものではありますが、なれてくると、黄金比のバランスを目が覚えて、自然にそのバランスを図れるようになるでしょう。そうなると、いちいち採寸しなくても自然な感覚で黄金比のバランスを持ったデザインレイアウトを組むことができます。
また、だれもが美しいと感じる完璧なデザインバランスを微妙に崩すことで生まれる「違和感」を如何にして自分らしさとして確立するかが、その人らしさなんでしょうね。
デザインを志しながらも、挫折してうまくいかないとお嘆きの貴兄に、騙されたと思って試してみてください。

投稿者 continue_kozai : 03:53トラックバック (0)

2006年05月29日

情報デザインと情報設計の違い

自分でいうのも何だけど、ウェブ制作において、たぶん今もっとも重要な職業なのが「インフォメーション・デザイン・アーキテクト」という肩書きの人なんじゃないだろうか。

今、世間を騒がせているマンションやホテルの「構造設計」なんかを考えてみると至極わかりやすいんだけど、「せっかく作ったWEBサイトなのに、構造がムチャクチャな為に、使いにくくてだれも利用しない」なんてことって良くありますよね。WEBサイトは震度5強で壊れる事はないけど、誰も利用しないために壊れることは良くあるケース。前章でもふれた「トップページデザインを真っ先に欲しがるケース(まずはデザインありき....未だ衰えず。)」はまさにこれに当たる。
デザインだけかっこよくても、使いにくかったり、中身がなかったりっていうのは言わば《張りぼて》みたいなもんで、見かけ倒しにすぎないわけですから、デザイン的な評価とユーザーの評価も分かれるところです。
では、だれでも情報はデザインできるのか!?という疑問...。できるっちゃ〜できるけど、知識の深さによってそのできばえが大きく変わるのは間違いない。

グラフィックデザインやWEBサイトのデザインなんて、いいサイトをパクる事でそれなりのカッコを整えることはできるけど、こと構造だけはパクれない。まったく同じディレクトリ構造を持ったまったく同じミラーサイトのようなものなら別だけど。
そのサイト構造にした理由なり、そのレイアウトになった理由は、ハッキリ言ってできあがりのサイトから創造するのは難しいし、想定できたとしてもそれはほんの一部に過ぎないだろう。
サイトをデザインする上で最も大切なものは何か...。
それは、
事業戦略であったり商品なら販売戦略
に他ならない。

これなくしてはWEBサイトは成立しないといっても言い過ぎではないと断言できる。サイトなりページをわざわざ金をかけて作って、一体何をしたいというんだ!と問えば、答えは「それは売りたいからだ。または世間に知ってもらいたいからだ。」と返ってくる。だったら、どうすれば、売れるのか?どうすれば知ってもらえるのか...。
押し売りならいざ知らず、この情報化社会においてそんな一方的な押しつけが通用するはずがない。必ず、受け手側の感性なり興味にマッチした情報の渡し方にあった作りというのが必要になってくるはずである。ーーそれが、いうところの「情報デザイン」であり「情報設計」なんではないでしょうか。

はて?そこで、「情報デザイン」と「情報設計」って違うの?ということになるわけですが、明らかに違います。
数式で表すと、
「情報デザイン」≠「情報設計」
「情報デザイン」<「情報設計」
だと思う。

わかりやすくいうと、
「情報デザイン」は表面的な目に見える情報を効果的に「デザイン」することを指し、
「情報設計」は成り立ちとしての情報の構造をどのように組み立てるかという目に見えない部分の「構築」を指す。

例えば、ナビゲーションメニューのデザインやボタンの形状、配置や、タイトルの立て方やそのタイトルのコピーをも含み、サイト内の移動やページ間の移動に際しての使い勝手全般を「グラフィックデザイン」的にサポートするデザイン工程全般を指すのが「情報デザイン」の役回りと解釈している。
また、サイトを利用する想定ユーザーの行動パターンを分析し、内包する製品情報やサービス情報の体系をどのように配置し、どのようなリンク関係を持たせるのか、また、グローバルナビゲーションとして立たせるメニューページはどこに設け、どのような内容にするのか、ディレクトリ内での移動手段として設けるべきローカルナビゲーションの必要性や、他のページやディレクトリへ移動するための手段や表現方法など、サイト全般に関わる構造を建築的な視点から体系化する。
さらにその上で、各ページの中での各要素の役割と情報量をも制御するのが「情報設計」の役回りと解釈している。
ある意味において、「情報デザイン」は「情報設計」の領域の延長線上にあり、線引きが難しいところがあるものの、「情報設計」されたスケルトン(骨組み)を如何に見栄え良く仕上げていくかというところが、「情報デザイン」の任務とも言える。

ここまで読むと、「情報デザイン」より「情報設計」の方が大変だし、情報設計ありきの様に思えるけど、目に触れる部分の役割は構造を管轄する設計よりも大変な事も多い。
いくら、構造が理論的に正論であっても、それを表現するデザインに説得力がなければいけないわけで、そこには、単に構造的要素を「デザインする」ことだけでない「情報を認知させるためのトリック」が仕組まれていなければならないのである。まあ難しくかしこまるわけではないけど、「認知心理学」的要素や、「統計学」的要素を取り入れて、気がついたら「サイト制作者の意図にズッポリはまっていた!」っていう図式が、「情報デザイン」の終着点なんでしょうね。

まあ、「情報設計」と「情報デザイン」は持ちつ持たれつの関係にあって、両者が引き立てあって一つのサイトを作り上げている!といえばわかりやすくもありわかりにくいのかも(^^ゞ知れませんね。

投稿者 continue_kozai : 02:23トラックバック (0)

2006年05月28日

ダイレクトメール(はがき)の効果

あえて公言する必要もないのだが、ハッキリ言って「ファッションには疎い」。渋谷系とか青山系とか、さっぱり。っていうかついていく気もない。
性格的なところもあったりするのだが、ボクの衣服に対する感覚は16歳の時に停止してしまった。それから26年一貫して変わっていないスタイルが「アメリカントラディッショナル」。いわゆるIVYですかな。

■ボクが26年こだわり続けているファッション
幼少のころから、いいものを来たことがないので、16歳で「MEN'S CLUB」を普通に読む人に驚いた。そして当時静かなブームを迎えていたIVYの第2次ブームにみごとに感化され、着るなら「Jプレス」。ブレザー裏地の赤いラインにとてつもないステイタスを感じ、一方で金額的な手のとどかなさがまた一層感情をそそる。
というわけで、初めてJプレスの袖に手を通した20歳の時から今も昔もずっとJプレス。以来買う服といったら、Jプレスか、ラルフローレンか、ニューヨーカーか、ブルックスブラザースかVANしかない。それもVAN以外は、松屋銀座のみ。他ではまず買わない(っていうか売ってない)。

■久しぶりの豪快なお買い物
さて、やっと本題。ゴールデンウィークに久しぶりに家族連れで、ブレザーやらスラックスやらをまとめ買いしに、松屋銀座のJプレスを訪れ、それぞれ2着ずつとシャツを2着買いました。その後、1本取り寄せになったスラックスを忙しさのあまり取りに行けず、2週間以上放置してたんだけど、先週月曜日にやっと取りに行きまして、またその時にシャツを2枚ほど買いました。で、その時の店員さんがめちゃくちゃ腰の低い人で、そんなにへつらわなくてもいいんじゃないと思うほどに良くしていただき、「以前に、ブレザーをお買い求め頂いたときの担当から、お葉書など出させていただいてもよろしいでしょうか?」などと尋ねられ、どうせ秋冬とかのバーゲンのDMだろうと快諾して住所を書いて帰りました。

■ふたつのダイレクトメール
週も明けてない数日後、JプレスからDMが届いていました。Jプレスのでっかいロゴをあしらったブランドイメージの絵はがきのウラに、びっしりと手書きのメッセージを添えて。正直、「あの店員、俺のこと良く覚えてるじゃん。家族連れだったことも明るめのシャツが好きなことも」。
ハッキリ言って、それが商売なんだし、商いの基本でもあるわけで指して驚きもしないのだけど、今このインターネット時代においてこうした原始的ONEtoONEなマーケティング手法は見直されているし、新鮮だったりする。少なくとも、このはがき一枚で二度と行くまいとは思わないし、また行こう!と思うのである。(っていうかココしかないしね(^^ゞ)
で、一方、先週ある会社さんのスタッフ二人から別々に季節のグリーティングカードを頂いた。いつも季節の変わり目になると送られてきて、いったいなんだったっけなぁ〜と首をかしげるDMです。結構、仕事的にご無沙汰してると、「ああ、こんな会社もあったっけ。今度発注するか〜」とも思うけど、結構頻繁にお仕事をさせていただいて、メールのやり取りもしてる担当者から、あえて別々に同じはがきを2枚もらっても、その意味が理解できなくて、結局置き場所に困ってしまう。

■今回のコンティニュ的こころ
担当者の名前まで一緒に刷り込んである宛名シールを貼って、大量印刷された絵はがきを別々に送付して、彼らは何をしようとしているのか。
せめて、一言二言、日頃の感謝や次の仕事への意気込みぐらい書き込めばいいのに。
はがきを出した=コンタクトした。こういう図式に疑問を抱かない社員の意識もさることながら、そういうシステムを良しとして矛盾を感じない会社にも明るい未来は無いような気がする。

投稿者 continue_kozai : 00:28トラックバック (0)

2006年05月26日

タイミングを大切にすることが出発点

デザインをする上で、「どんな内容をどんな風にレイアウトするか」なんてことはデザイナーなら当然考えることではあるけれど、それを「時間軸」で考える人は少ないのではないだろうか。ここでいう情報設計とは、まさにソコがポイントと言える。

ついこの間まで、ECサイトをはじめとして、「母の日には○○が最適!」とか「母の日のプレゼントには△▽を贈りましょう!」的なタイトルを付けて特集が組まれていたと思う。まあ、タイミング的に、母の日の前はそういうニーズが増えることもあり、まさにそれが商機に繋がるのだけれど、ぼくが言っている「時間軸」とはそんな単純な事ではない。
WEBを通じて、情報検索をする動機の背景には、その人それぞれのタイミングが存在しているはずということ。
それは、前出の「イベント」に触発されているかも知れないけど、それは、「先の話」として余裕のある時間上にあるのか、「その時」が直前に迫った時間上にあるのか、という検索している人のTPOが影響してくる。
時間に余裕があれば、じっくりと検討するためにそのページを開いてるかも知れないし、時間が無ければすぐにでも結論を求めたり要点を整理したいなど、「一目で見て判断できる材料」を探していることでしょう。これは、言い換えると情報を知りたい「深度」が違うということで、広く浅くなのか狭く深くなのか、はたまた「狭く浅く」なのかということ。
情報提供を目的とするページを制作するのなら、まさに「ココ」を探求しないといけないのではないか!一方的な情報としてメーカーの言葉や売り手の言葉で、クドクドと説明することだけが『良い情報』とは言えないのではないだろうか。『良い情報』は、内容ではなく、タイミングやTPOにマッチした情報をユーザーは指すのだから。
また、ユーザーがWEB上で情報を検索する際には、たとえば「来週は、彼女の誕生日だから、彼女へのプレゼントを探さなきゃ」などという「いつ」「だれが」「だれに」「何を」「どうしたい(買ってあげたい)」といった考えの元に検索行動しているという事実も考えなくてはならない。
ユーザーの動機行動は、明確な目的を持って行動しているという事でもあり、その一方でのサイト側としてもハッキリとした目的(ユーザーが享受できるメリットやベネフィット)を示すことがそこにヒットする近道にもなる。
この5W1Hな情報構築の考え方は、数年前にあるクライアントさんへのワークショップ講義のなかで取り上げた事があって、
・いつ(発売日とかキャンペーン期間とか)
・誰が(大抵は情報発信者やメーカー)
・誰に(コアターゲット層)
・何を(商品やサービス)
・どうしたい(特長の理解、購買など)
ということを考えたコンセプトワークをしないと、ただ作っただけの中身の薄いサイトになっちゃうよ...的な話。
この中でも一番重要なことは、「誰に」「何を」伝えるのかということだということはわかりやすいけど、この情報を的確に効果的に伝える手法が、先ほどのタイミングを考えたデザイン表現だったり、レイアウト構造だったりするわけです。
タイミング次第で、同じ人が同じページを見ているのに情報が見えたり見えなかったりする....見過ごしてるだけなのだけれど、それがWEBサイトにとっての命取りになったりします。
というわけで、構造上、
・すぐ見て概略を察知する
・ちょっと詳しく知りたい
・もっと知識を深めたい
という、深度をデザイン構造上から見て取れるような形が、それぞれのタイミングタイミングにマッチして、ユーザーの取捨選択の情報検索に引っかかってくれるのではないか....と思うわけです。
デザインだけでは表現できないこうした構造上のトリックが、これからのWEBに必要な「要件」ではないでしょうか。

5W1Hについての考え方を示すサイトを見つけました。
実践!WebマーケティングBlog「5W1Hで考える情報の連携」
http://marketing.mitsue.co.jp/archives/000123.html

ボクが漠然と考えていたことを理論的に解説しています。

投稿者 continue_kozai : 21:31

2006年05月25日

まずはデザインありき....未だ衰えず。

正直、困ったものです。

何かを変えようとするとき、真っ先に要求として上がってくるものは必ず「デザイン」だ。それもトップページ。これだけは未だに変わらない。
そうじゃないんだと、声高に訴えてもなかなか聞く耳を持ってくれないのが現実で、大抵のクライアントさんは「そういわれても専門じゃないしわからない」と異口同音。
ある意味、形のない概念だから直感的でなく、判断が難しいというのは事実としてあるのだが、見かけのかっこよさやインスピレーション「だけ」でサイトの善し悪しが判断されてしまうということには異を唱えたい。デザイン性が大切なのは今も昔も変わらないし、それがサイトの価値を左右することも事実だ。ただ、《使いやすさ》や《わかりやすさ》と《かっこよさ》や《美しさ》はイコールではない。この部分は、別の次元であり、それを踏まえて、それを内包した機能性こそが「真のハイクオリティデザイン」と言えよう。

前出のトップページだけのデザインを仮にやった場合、見栄えや変わった感は補えるが、使いにくさや気配りのなさは補えきれない。トップページだけは救いようがあるものの、手つかずの下位階層やページ間の関係性はそのままだから、トップページの良さと相まって、問題はより一層増幅されてしまう。この不具合をどの程度放置し、どのタイミングで一掃するのかが次のテーマになるであろう。いずれにしても金のかかる話だ。

予算や時間の問題は如何ともしがたく、そういった意味でも「デザインだけは...」なんて愚かなオーダーになっていく。しかし、だからといって、ちゃっちゃっと情報設計ができるわけでもなく、それなりの時間とそれなりの費用が必要な事も事実なので、そこに予算と時間を割けないということならば、それはもう「勘」でやるしかない。
ある程度のところでは、「勘」は当たっているはず。ただ、そこに裏付けがないために押しが足りないのも事実である。良いデザインは急造ではできないことを、まずはクライアントさんに理解してもらうこと。これが、情報設計デザインの第一歩といえよう。

投稿者 continue_kozai : 04:40トラックバック (0)

2006年05月22日

コンティニュの「昔の」WEBサイト

まだ、「Flashの香西」を謳っていた頃の作品。
もう最後に更新したのは4年も前のことでした。
http://www.continue.jp/mx/index.html

投稿者 continue_kozai : 05:41

売れない商品や人気のない商品のウェブサイト

ウェブサイト設計において、こんな手強い条件はない。最近、この手の仕事を3つ抱えることになった。自分の知識と市場との差異を検証する上ではもってこいの臨床実験と言えよう。
もともと、ウェブサイトがどのような順序でユーザーの目にとまるか。商品が売れているから気になって見に行くケースと、まったく売れてないけど、誰かが取り上げることでブームとなって見に行くケース...。前者はウェブサイト制作も容易であり、後者はチャンスが来るのをじっと待つという感じ。
しかし、ウェブサイトにおけるホントの底力は、この後者でのみ発揮されると言えよう。なぜ、売れないのか。なぜ、人々に興味がないのか。ハッキリ言えば、商品やサービスに魅力がないから飛びつかないからなのだが、だからといってまったく魅力がないかといえば、そうでもない。いいところはやっぱりあるのである。現に、そこそこは売れてるわけだしファンもいる。
一部のコアな人たちが、何に惹かれ何に価値を見いだしているのか。その一方で、人々はどこに魅力を感じないのか。ふたを開ければ、商品なりサービスの中途半端さが原因で片付けられそうなものであるけど、これがビジネスとして請け負っている以上、我々クリエイターは売れるウェブサイトを目指すだけだ。
ただひたすらに、ユーザーの声に耳を傾け、ユーザーの欲求や不満の一つ一つを解析して、その「真意」を探り、そこに到達するような構造を再構築する。このプロセスが情報設計であり、ユーザーの興味を引き入れるための道筋になると考えています。

投稿者 continue_kozai : 04:42トラックバック (0)

2006年05月18日

ユーザー視点の意味するところ

いつの頃からか、WEB系雑誌やデザイン系雑誌って見なくなって久しいのだが、人が買ったそういった本の表紙をたまにチラ見していると、「ユーザビリティ」とか「ユーザ視点」とか割に取り上げていることに気づく。
ユーザビリティはいざ知らず、「ユーザ視点」という言葉は、そろそろ市民権を得てきたのかな...と思う。
そもそも、ユーザ視点って何だろう。われわれクリエイターは、まずクライアントからの要望をオリエンで受け、クライアントがやりたいことや実現したいことをオーダーとして請けるわけで、その願いを達成するためにどんな企画やデザインにしようかと、頭を悩ませているのが実際ではないかと思う。そのできあがった案をプレゼンするのも善し悪しを判断するのも、クライアントだから。
しかし、ほんとうに忘れてはいけない事として、「でも、そのサイトを使うのはユーザーなんだ」ってこと。いくらクライアントのお金でクライアントの要望を叶えようとも、ユーザーが見向きもしない、ユーザーがサイトにストレスを感じて来たくない使いたくないと感じてしまうことは、本来から言えば、クライアントの要望を満たしてないことになるんだと思う。

そういう意味からも、最近、ぼくのところに来る話として、「使いやすい構造設計をして欲しい」「このサイトのダメなところを直して欲しい」という要望が持ち込まれてくる。
でも、決して凄いことをマジックな事をぼくは仕事としてやっているのではなく、ぼく自身がユーザーになってそのサイトを訪れて、そのサイトを使って感じたことを、感じるだろうと思うことを基準にして、気持ちよく、楽しくサイトを使える為に、自分だったらどういう順序でサイトを巡回するとか、どういうコピーだったらボタンを押すだろうとか、作り手の立場でユーザーの事を考えるのではなく、ユーザーの立場で作り手の気持ちを推測しているだけに過ぎない。それが、ぼくの、ユーザー視点のあり方なんです。

言ってることは、とても当たり前でまっとうな事だと思うでしょうか。でも、実際、やってみようと思うとできないところが、ぼくのところに話が持ち込まれる一番の理由なんでしょう。
ほんの僅かなアプローチの違いが、発想の転換に繋がり、それは言われればもっともな話で、「コロンブスの卵」なんでしょう。これが、これからのコンティニュのメインワークであり、コンティニュのカラーになっていくんだと思います。
でも、その礎になっているのは、やはり読みあさった知識だけではなく、20年来の経験がものを言っているということは明らかだと思います。

投稿者 continue_kozai : 01:14トラックバック (0)

2006年05月15日

香西睦について

氏 名/香西 睦(こうざい むつみ)
性 別/男
年 齢/1964年4月15日生まれ 辰年43歳
血液型/責任転嫁のAB(RH+)
趣 味/Macintosh、映画鑑賞、硬式テニス
家 族/愛する人と愛するこども5人
一 言/僕にとって仕事はこだわりであり、能力の探求・挑戦である。そして、可能性がある限り努力を惜しまない。

投稿者 continue_kozai : 08:16

プロフィール

社名/合資会社コンティニュ・ジェーピー
資本金/1,000,000円
代表/香西 睦(こうざい むつみ)
設立/2002年2月5日(創業1998年11月11日)
住所/千葉県浦安市高洲5-2-1-620(〒279-0023)
電話/047-305-8890
Mail/master@continue.jp

投稿者 continue_kozai : 08:09

タイプミス(表示間違い)のお知らせ

■第2版で修正されましたが、初版では表記が間違っています。
20ページの下から6行目
誤:アイデアラッシュ
正:アイデアフラッシュ

■以下の部分は、第2版後に発見されたため表記がまだ間違っています。
2ページの図1-1 グラフィックデザイナーとWEBデザイナーに必要な知識の違い
誤:サーバなど知識
正:サーバなどの知識

■ちょっとかなり恥ずかしい初歩的タイプミスですが (--;)
154ページ目著者プロフィール4行目
誤:若干25歳で
正:弱冠25歳で

投稿者 continue_kozai : 05:10

ただいま絶賛発売中です!!

ウェブクリエーターズバイブルシリーズ WEBデザインレイアウト
2004年2月2日にソフトバンククリエイティブ社より発売された
ウェブクリエーターズバイブルシリーズ WEBデザインレイアウト
ただいま好評発売中です。


デザイン上達への早道は、決まったデザインパターンをまる覚えするのではなく「そのパターンの成り立ち」を理解すること。デザイナーとして忘れがちなポイントやよりクウォリティの高いデザインをするために必要な基礎知識をどう理解するかのヒントをより多く掲載!!WEBデザイナーを目指す人なら必読です。

お求めまたは詳しくはアマゾン・ドット・コムにて

WEBデザインレイアウト

投稿者 continue_kozai : 04:35

 
Powered by Movable Type 3.2-ja-2 | RSS2.0 | ATOM