DESIGN ARCHIVE - BLOG

楽天Edyのロゴデザインについて考えよう。

2012-02-02T02:03:00.003+09:00

twitterを見ていたら、トレンドになるぐらい楽天Edyのロゴがダサいと話題になっていて、関連ツイートを眺めているとネガティブな意見がほとんどで、ポジティブな意見は皆無に等しい状態で少し驚きました。

通常のプロセスであれば、多くの案と人の判断を経て絞り抜かれているはずのロゴが、なぜこれほどまでに評判がよくないでしょうか。

単純に否定的な言葉だけで片付けてしまうのではなく、デザイナーとしてその理由を考えてみたいと思います。

■定着している楽天への否定的イメージ

時はさかのぼること2009年の8月。楽天グループにイーバンク銀行が入った際に、手数料など多くの改変が行われ、それが既存ユーザーにとってはデメリットになるものばかりで「改悪」というイメージが定着してしまいました。
今回のEdyも2009年に連結子会社化したビットワレットを楽天が完全に取り込んでいくような形で、既存ユーザーがイーバンク時代の改変の悪夢を思い出してしまい、脊髄反射的に否定的な意見がでてしまっていることから、デザインも余計に良く見えてこないのではないかと思います。

■ロゴ同士のバランス
それぞれのロゴの大きさや色のバランスが同じレベルになっているからか、「楽天」なのか「Edy」なのかどっちつかずで、両者がつばぜり合いをしているような感じがします。
こういった部分に関してはクライアントの思惑や政治が多く絡んでくるので、デザインレベルではどうしようもなくなってきてしまうのですが、せめて色だけでも統一できればもう少しバランスのとれた感じにみえたのではないかと思います。

■文字そのもののバランス
新しくなったEdyのロゴそのものが、やや左によっているように見えるせいか、それが不安定なイメージを想起させて、ネガティブな意見につながっているのではないかと思います。
その理由を探るために、ロゴを分解して観察してみたところ、具体的に大きく3つほど気になった点がありました。

1つ目は「E」の右端のラインがピッタリとそろった状態になっているので、錯視が働いて真ん中の線が飛び出ているように見えることです。
通常はこの錯視を避けるために真ん中のラインを少しだけ左にずらすような処理を行うのですが、文字を構成するルールとしてシステム的な思考や数値を重視されているということなのかもしれません。

2つ目は「d」の上部がキャップハイトのラインからはみ出ていて「E」のラインと揃っていないためにアンバランスさに拍車をかけているという点です。
書体によってはキャップハイトのラインからはみ出ていているものとそうでないものと色々あるのですが、この場合は上にある楽天ロゴへの干渉を防いで統一感を出すために、Eのラインと揃えたほうがスッキリ見えるのではないかと思いました。

3つ目は「y」の1画目がベースライン付近で終筆していないためか、浮いたような存在になっている点です。
文字のエレメントはベースラインに揃っていることで、水平に目線がスムーズに動いて見やすくなるものなので、その規律からあえて逸脱しているということは、「y」の文字に「ルールに囚われない」とかいったような、何か特別な意図があるのかもしれないです。

考えて分かったことをまとめてみると…

ロゴデザインに対する評価は、デザインそのものの造形的な印象よりも、企業のもつブランドイメージによって評価が左右されてしまう場合がある。

異なる要素をもつデザインを組み合わせる際は、どちらかが歩み寄って方向性を揃えていかないと全体で見たときにバランスがくずれて見える場合がある。

以上、色々と考えてみましたが、口だけ達者になっても仕方がないので、これまでの考えを踏まえて、現在のロゴが持つエッセンスを残しつつもバランスを調整してみました。

これはあくまで1人の狭い思考における、1つ結果にしかすぎないので正解であるとは全く言えません。

考えてみて大切だと感じた事は「デザインに正解は無い」とよく言われるように、何故そうなっているかを考えて自分なりに答えを出してみること。
そうすることで、簡単な言葉で片付けられてしまいそうなデザインも、その裏に潜む論理まで見えてきて、たくさんの気付きを得ることができると思います。

音楽をつなぐこと、デザインをつなぐこと。

2011-12-07T22:32:00.001+09:00

「エディトリアルデザインとDJミックスは似ている」
デザインをしながらミックスCDを聞いていて、ふと思いついたので思考整理のメモをしながら、そのイメージをビジュアル化。

1.BPMとグリッド

DJミックスでBPMの異なる曲を調整して全体のリズムをつないでいくように、エディトリアルデザインでは様々な文字や画像をグリッドにピッタリと合わせて全体のリズムをつないでいく。
異なる要素が一定のリズムにピッタリと整列した瞬間、どちらも心地よい感覚が生まれていく。

2.曲順とページネーション

DJミックスでは、落ち着いた曲から一気に盛り上がる曲に変えたりして、聞き手を飽きさせないように流れをつくっていくことが大切。
エディトリアルデザインも、始めにを大きな演出をしてその後じっくりと読ませる流れを設計したりすることで、ページをめくること自体の体験をデザインする。
緩急をつけてつなぎ合わせていくことで、全体を通して新たな1つのストーリーが生まれてくる。

3.選曲と素材

DJミックスでは、どんなに退屈だと思っていた曲でも前後の曲の関係性で引き立て役になったり、時には主役になったりする。
エディトリアルデザインも、不要に思える素材でも、他の素材と対比させてバランスをとったりすることで、魅せるべき素材の意味が引き立ってくる。
どちらにおいても無用に思えるものが、実は引き立たせるための有用な価値をもっているということ。

4.エフェクトと装飾

DJミックスでは、単に曲をつないでゆくだけだと退屈なものになるときがある。そこで、スクラッチやエフェクトをかぶせることでそこにしかない臨場感が生まれてくる。
エディトリアルデザインも、単に文字と画像を綺麗に並べただけでは面白みが無いときがある。あえて極端な形にしたり装飾を加えることで、そのページにしかない空間を生み出していく。
どちらもやり過ぎると複雑ものになっていくため、絶妙なバランスが重要だということ。

5.表紙とジャケット

最後に大事なこと。いくら中身が良くとも、外見が魅力的でないと気づいてもらえないかもしれない。気づいてもらえないということは存在しないということ。
どちらも内容や雰囲気のエッセンスを一つの限られた空間に凝縮して、見る人を引き寄せて心の隙間に入り込んでいく。

音楽をつなぐこと、デザインをつなぐこと。
全く違うようで、本質的な部分は一緒なのかもしれない。

Android 4.0 Ice Cream Sandwichのフォントは、なんだか変な味がする。

2011-11-14T13:00:00.001+09:00

Google / Samsung introduce Android 4.0 Ice Cream Sandwich

先日発表されたAndoroid 4.0 Ice Cream Sandwithの新しいフォント「Roboto」について。
今回のバージョンアップではフォントに力を入れて来ているそうで、発表時にも大きく扱われていました。
GoogleでAndroidのデザインを担当するMatias Duarte氏によると、新しいフォントRobotoは「わかりやすくて親しみやすく、Androidを魅力的にし、もう少し人間らしくするものでなければならなかった」ということを出発点に作られたそうです。

インターフェイスの根幹を成すフォントに、これまでにない力の入れようを感じるわけですが、よくよく見てみると、ところどころ違和感をデザインになっていて、それが独特の変な味を醸し出している印象を受けました。

その違和感とは何か、他の様々なフォントと比較して、その「変な味」の理由を考えてみることで、モヤモヤした感覚をスッキリさせてみたいと思います。

変な味その1：雰囲気

Robotoは「人間らしさを追求したフォント」だそうですが、筆記体の風合いを持つヒューマニストスタイルと、Helveticaのようなネオグロテスクスタイルが混在していて、なんともバラバラなテイストになっています。
読みやすさを重視するために色々なフォントの良い所を取り入れていったそうですが、美味しい物だけを集めて並べてもそれぞれが主張してしまってなんだか分からない料理になるよりは、フルコース料理のように全体で見たときにバランスのとれている方が読んでいて心地よいのではないでしょうか。

変な味その2：エレメント

Droid Sansではすべてのエレメントが統一されていましたが、Robotoではそれぞれ違うデザインが施されています。
この理由について、RobotoのフォントデザイナーChristian Robertsonによると、Helveticaのように閉じた「a」や「s」などが、文章として並んだときにリズムを生み出し、美しく読みやすいデザインになることから、それらをアレンジしたデザインにしたそうです。
これは賛否両論ありそうですが、考え方の指標として、GeorgiaやVerdanaの作者で有名なMatthew Carter氏の「読者の書体認知について」の言葉が参考になります。

私の存在を知られたくない、新聞や雑誌の読者が書体を意識したとしたら、それは問題があるということだ。読者のそんな反応はごめんだよ。
『ヘルベチカ -世界を魅了する書体-』

つまり、フォントは情報を伝えるための器であり、器と食材がバランスを取り合ってこそ料理が美しく見えるように、文字それぞれが主張してしまっていると、本来の目的である情報を読み取る行為への妨げになるのではないでしょうか。

変な味その3：幾何学

Robotoのコンセプトは、側面がまっすぐな大文字や、陸上競技トラックのような独特の丸みを帯びたイメージで、機械的な骨格を持ちながらも、幾何学的な曲線をうまく組み合わせることで明るい雰囲気をもったデザインを目指しているそうです。
しかし、代表的なフォントであるFutura、DINなどと比較をしてみると、円の幅や中心点がバラバラでやや複雑な構造になっています。
見た目のアンバランスさを食感で例えると、Frutura、DINがサクッとかみ切れそうなのに対して、Robotoはグニャッとしていて、うまくかみ切れない様な感じがします。
幾何学をベースにつくられたフォントはその背景にある構造がシンプルで合理的だからこそ美しく見えるのであって、それらがうまく構成されていないとコンセプトの良さが活きないのでは無いかと思います。

さて、一人のデザイナーとして、感じたことをまとめてみましたが、食べ物にも慣れがあるように、フォントも実際に使っていけば自然と愛着が出てきて良く見えてくるのかもしれません。

Ice Cream Sandwichはオイシイのかマズいのか…。
さてさて、みなさんはどう感じましたでしょうか??

異論・反論など、twitterやコメント欄でどんどんご意見いただけると嬉しいです!

このエントリに関連するオススメの書籍

「もしもJobsとAdobeがtwitterをしていたら。」3年半以上にも及んだ、FlashをめぐるJobsとAdobeの論争まとめ。

2011-11-11T19:49:00.001+09:00

とうとうAdobeがモバイル向けのFlash開発中止を発表しました。
プラットフォームとして大成功を収めてきた1つの技術がいかにして衰退していくのか。
その流れを分かりやすく振り返るために、JobsとAdobeによるFlash論争の歴史を、twitterのタイムライン風にまとめてみました。
タイムライン風なので下の方からどうぞ。

こうしてみるとAdobeが「We Love Apple」というツンデレキャンペーンをしかけてきたあたりから勝敗は決まっていた感じがしますね。
PCはFlash、モバイルはHTML5というかたちで注力していくそうで、これからどうなっていくのか…。まだまだ混乱は続きそうです。

シンプルさと一貫性。

2011-11-09T16:27:00.000+09:00

Google+にはじまり、じわじわとサービスのデザインを向上させているGoogle。
先日Gmailやリーダーもデザイン変更になり、シンプルでとても使いやすくなった感じがします。

Googleの公式ブログによると、今回のデザインは「Google のサービスをよりシンプルで一貫性のあるものに変更しています。」とアナウンスしており、言葉通りにシンプルさによって見やすくて使いやすいデザインが実現されていると感じます。

では、具体的にどういったところが「シンプルで一貫性のあるもの」なのか、デザインが変更された主要なAppsである、Gmail、カレンダー、ドキュメント、リーダーのデザインを分解し、それらをまとめてみることでシンプルで使いやすいインターフェイスの理由に迫ってみたいと思います。

1.構造の一貫性

アプリケーションの構造が、メニューバーは上部、情報のカテゴリはサイドバーに、メインの情報は右中心にかならず構成されていて、全体を通して同じ構造になっています。

これによって、アプリケーション間の切り替えに戸惑うことなく、スムーズに操作が行えるようなデザインになっています。

2.配色の一貫性

モノトーンをベースとした配色に、操作している時に一番重要とされる要素が、配色の中で一番目立つ色であるオレンジ色になっています。

他にも検索ボタンの部分は青色で統一されていたりと、全体の中で色の意味が統一されています。

配色における選択と集中が効果的になされていて、重要とされる要素が一瞬で認知できるようなデザインになっています。

3.アイコンの一貫性

フラットで色数が抑えられていることによって、小さなスペースでも高い視認性を持ち、アイコンがたくさん表示された場合でも互いの要素を干渉せず、全体での調和がとれるようなデザインになっています。

正直、アイコン単体では何を表しているのか分からない位シンプルすぎるかと思いますが、コンテクストに沿った形で配置された時に、最小の表現で最大の効果をもたらしてくれています。

4.状態表示の一貫性

ステータスが変更されたときに、必ず上部に同じ様なデザインで表示されるようになっています。一貫した表示方法によって、変化が起きた事を確実に知らせ、システムに対するユーザーの信頼性を高めることにつながっています。

5.レイアウトの一貫性

Googleカレンダーでは、ウィンドウのサイズを変えても見た目の構造が変わらない様に設計されています。他にも、サイドバーのメニュー間隔がサイズに応じて変わったりと、一貫した柔軟性によって、使用環境が変化した場合でも、慣れ親しんだ形で使う事ができるようになっています。

6.操作の一貫性

選択できる要素が階層化されている部分はすべて三角の矢印で操作できるようになっており、階層化されたメニューの存在を一貫した表示にすることによって、全体を通してオブジェクトの意味するものが直感的に理解しやすくなっています。

以上の点から、分かることをまとめてみると…

色や形に一貫した意味を持たせることによって、表示されているものの意味が理解しやすいものになる。

構造・レイアウトを一貫させることによってユーザーの学習を容易にし、効率的で使いやすいものになる。

シンプルで使いやすい理由。
それは、煩雑になりがちなアプリケーションの画面・操作体系に一貫性をもたせてまとめ上げることで、結果としてシンプルになり、機能としての美しさが際だったデザインに仕上がっているからではないかと思います。

Web上でのビジュアル表現手法が豊かになり、Appleなどが現実世界のメタファを重要として要素を付加してきているのに対して、GoogleやMicrosoftのデザインはどんどんそぎ落とされてシンプルでミニマムなデザインになってきています。

これからインターフェイスのデザインはどちらへ向かうのか、とても興味深いですね。

このエントリに関連するオススメの書籍

細かすぎて伝わりづらい! iOS 5のデザイン変更点まとめ。

2011-10-17T15:41:00.000+09:00

iOS 5のリリースやiCloudの開始、iPhone 4Sの発売と、ここ最近のAppleのプロダクトが一通り出そろった感じですね。
3GSを使っていて常々もっさりしていたので、早速iPhone 4Sに乗り換えたところ、画面の中をスケートをしているかのようにスイスイ動いてくれてとても快適です。
2年前に3GSを使っていたときは、なんて速いんだろうと思っていたわけですが…慣れとは恐ろしいものです。

さて本題ですが、ここ数日使っていた中で気付いた、細かすぎるデザイン変更点があったので前回のLionと同じようにまとめてみました。

細かすぎるデザイン変更点第2弾、今回も目を凝らしてどうぞ。

1.アイコンバッジ

iOS 4のアイコンバッジのシャドウは濃いめのブラックで強めのシャドウになっていましたが、iOS 5ではグレーっぽく明るくなっています。
全体的に比較してみると、iOS 4のシャドウは浮いている感じがするので、明るくなったことで画面全体のトーンにまとまりが出たように感じます。

2.ボックスデザイン

設定画面などのボックスデザインが、iOS 4ではフラットなラインに対して、iOS 5ではシャドウとハイライトが追加されて立体的なデザインになっています。
iOS全体で同様の立体的なデザインが適用されているので、デザインの一貫性がより高まった感じがしますね。

3.メッセージのハイライト

これは賛否両論ありそうですが、iOS 4ではメッセージの文字がプレーンなテキストだったのに対して、iOS 5ではハイライトが追加されてこれまた立体的なデザインになっています。
他にも吹き出しの背景色やシャドウが明るくなったことで、背景と文字のコントラストが高くなり、個人的には文字の可読性が高まって良くなったと思います。

5.回転ロックボタンの厚み

iOS 4では回転ロックボタンのシャドウ距離が3pxだったのに対して、iOS 5ではシャドウ距離が4pxとなって、より立体的に見えるようになっています。
反対にミュージックアイコンのシャドウ距離は3pxで変わらずのままですので、1pxの違いをデザインすることで、回転ロックという機能アイコンと、ミュージックを起動するという起動アイコンの違いを表しているのではないかと思います。

5.ホームアイコンの間隔

iOS 4ではアイコンの間隔が38pxの等間隔だったのに対して、iOS 5では中心だけが40pxと広くなっています。

はて、なぜ真ん中だけ広くなっているのでしょうか…。

バランスをとる為に錯視の調整をしているのか、はたまた真ん中が広い方が人間工学的に操作しやすいのか…。
色々考えながら、両サイドの間隔も測ってみたところ、iOS 4では左34pxの右36pxになっており、画面全体が実は2px左寄りになっていました。

といっても、言葉では伝わりづらいと思いますので、分かりやすいようにより詳細な図にしてみました。

このことから考えてみると、iOS 5ではセンターから2pxアイコンを動かすことで、このズレを調整して全体がより安定して見えるようにしたのではないでしょうか。
これまでは左寄りだったことから、左手操作の人にとってほんのちょっと使いやすかったというわけですが、これからは右手操作の人にも優しいデザインになったということですね。

他にもボタンの位置が微妙に調整されているとことがあったりして、ブラッシュアップの上をいくポリッシュアップでデザインを全体的にピッカピカに磨き上げていますね。
パッと見どころか、拡大してさらに目を凝らさないと分からないぐらいまで微調整されていて、本当に極限まで完成度が高められています。

デザインが非常に優れているといわれ、評価が高いiOSですが、それに満足することなく改善していく、このデザインへのこだわりを感じて、エイブラハム・マズローの以下のような言葉を思い出しました。

何もすることがないという状況はあり得ない。
我々はすでに踏み出しているのだ。
我々には、能力があり、才能があり、
方向が決まっており、使命があり、神からの呼びかけがある。
―エイブラハム・マズロー

決して立ち止まることなく常に最高のものを追い求め、創り出すこと。

そうすることで「納得」を超えた「感動」が生まれる。

ものを創るときの姿勢として、とても大切なことを教えてくれます。

予約しました!

午前9時41分、Appleが止めた時間の謎。

2011-10-05T14:36:00.000+09:00

ついにiPhone 4Sが発表されました。
日本からは2キャリアから出ることになり、乗り換えるのか、そのままなのか、これまで電波の弱さに悩まされてきたユーザーにとっては悩みどころですね。

さて、あまり変わり映えのしないiPhone 4Sですが、よくよく見てみると、ひとつ気になることが…。
スクリーンショットの時間が、なんとも中途半端な9時41分になっています。

キリの良い9:40でもなく、イベントの開始時間である10:00でもなく、なぜこんな中途半端な時間なのでしょうか。

気になったので過去の製品画像をみてみると…。

なんと全てが「9:41 AM」で統一されています。

ここまで中途半端な時間で一貫しているということは何か意味があるのかもしれないですね。

ジョブズもしくはMac誕生の時間なのか、Appleにとって何かしらのメモリアルな時間なのでしょうか？

気になって海外のApple系ブログを色々と探索していたら、TUAWの記事に、Secret Labsの開発者ジョンマニングが、アップルストアにいたスコット・フォーストール（Apple上級副社長）に時間の意味を質問したという内容の記事がありました。

それによると、プレゼンテーションでプロダクトを大きくお披露目する時間を、約40分で発生するようにkeynoteをデザインし、スクリーンに映し出されたときに観客の時計とズレがないようにしていたらしいのですが、ピッタリ予定通りに行かない事を見越して数分追加した時間なのだそうです。
この40分に対し、スコットは「secret magic time」と名付けていたそうです。

実際にiPhoneが初めて発表された2007年のMacWorldをみてみたところ、プレゼンが開始されてちょうど40分頃にiPhoneのスクリーンが初めて公開されています。

つまり、時間が統一されている理由は、iPhoneのスクリーンが世界に向けて初めて公開されると予測した時間で、合理的な理由がありつつも、Appleにとって記念すべき時間でもあるからということですね。

さて、無事解決したかと思われますが、ここで新たな疑問がでてきます。

その「secret magic time」はなぜ40分なのかということ。

分刻みのプレゼンテーションを組み立てるぐらいですから、そのタイミングにも意味があると思います。

それについて掘り下げている記事は見あたらなかったので、2つ理由を推測してみました。

推測1：科学的な理由

via delphwynd

脳研究者の森昭雄教授によると人の集中時間はだいたい40分といわれているそうで、その特性を考慮した時間になっているからではないかと思います。長時間集中して仕事や勉強を続けることは結構難しいことではないでしょうか。

速すぎず、遅すぎず、集中力が切れてしまいそうなタイミングを見計らい、目の覚めるような大きな発表をすることで、飽きさせない様な工夫をしているからではないでしょうか。

推測2：構成的な理由
ジョブズはプレゼンテーションのメタファーとして三幕構成の演劇を好んで用いるそうで、その構成全体の中で第一プロットポイントを起こす丁度良い時間が40分であり、セオリーを活かした構成にしているということではないでしょうか。

実際に今年のWWDCでも、ちょうど40分を過ぎた頃にメインである「iOS5」の発表がされています。

優れた脚本は三幕構成を使っているといわれるように、人を魅了させるプレゼンテーションは三幕構成を持っているということですね。

いずれにしても、スクリーンショットの時間表示というしょーもない好奇心に、ちゃんと意味をもって応えてくれるAppleのこだわりには常々驚かされますね。

最近、他のメーカーがなぜAppleに追いつけないかという内容の記事を良く見かけますが、それは、ディズニーランドの世界が完璧につくりあげられているように、プロダクトそのものに止まらず、それらをとりまく世界や体験を完璧なものにするというこだわりの差が、競争力の差につながっているのではないかと思います。

午前9時41分、それは、

iPhoneが発表されたときから

Appleの世界で止められている、

ということなのかもしれません。

ジョブズのカリスマ性という
時を止める魔法がなくなった今、

他の世界が時を刻み始めることは

やってくるのでしょうか。

気になるところです。

Constraints lead to the design.

2011-09-30T16:13:00.001+09:00

制約は、

デザインを妨げる物であり、

デザインを導いてくれるものである。

その意味するものを理解していないと

間違った方向に進んでしまう。

似ているようで違う。Google+にあって、facebookにないもの。

2011-08-28T08:30:00.000+09:00

via @uxboy

先日Google+に招待をいただいて、ぼちぼちと使い始めて思ったこと。

リリース当初、Google+のインターフェイスのデザインがfacebookに驚くほど似ている（上記画像参照）という話題がありました。僕自身も、パッと見では同じ様な印象を受けるのですが、なんとな〜くGoogle+の方が見やすくて洗練されているように感じます。

そこで、「なんとなく良い」というなんとなくモヤッとした感覚を、インターフェイスを分解して比較してみることで、具体的に優れている理由をまとめてみました。

1.アイコンの簡潔さ

両者のインターフェイスにおけるアイコンの役割は「一目で何か分かる」ようにすることであり、それが小さくなればなるほど視認性に重点をおくべきだと思います。
その中で、facebookのアイコンは多色かつ線的な表現になっていることで、全体で見た時に少しごちゃごちゃした印象を受けます。
それに対し、Google+のアイコンは色数を抑え、フラットな表現になっていることで、小さなスペースでも視認性が高く、よりシンプルであることで全体のデザインに調和が図られています。

2.ユーザーの空間

facebookの創始者マーク・ザッカーバーグ氏は、自身の広告哲学についてこう言ったそうです。

「ぼくは広告が全部嫌いというわけじゃない。
くだらない広告が嫌いなんだ」

しかし、facebookの広告は文字量が多くてパッと見何を伝えたいのかがわかりづらいものが多く、それがユーザーの混乱を招く一因になっており、現在の広告にその哲学が生きているかは疑問に思えます。
それに対し、Google+はそもそも広告が無いので、ユーザーにとってクリーンな空間であると思います。ベータテスト中なので「今のところ」ですが。

3.文字の読みやすさ

facebookはフォントサイズが11px、行間が1.28emとなっていて、文字が小さくて窮屈な印象を受けます。
それに対しGoogle+はフォントサイズが13px、行間が1.4emと、文字が大きく、より広い行間によって読みやすい文字設定になっています。
鈴木一誌氏の『ページネーションマニュアル』において、美しいとされている文字組の行間はフォントサイズの150%〜170％と言われており、それに従った場合、どちらも読みやすい設定とは言えませんが、Google+の方が文字の読みやすさに配慮されたデザインであるといえます。

4.レイアウトの余白

facebookでは、サイドバーの項目やコンテンツ同士の空間が狭く、ボックスの中にすし詰めの様にレイアウトされています。
それに対し、Google+ではそれぞれの要素の空間を適切にとっていることで、クリックしやすく、余白をうまく活かすことで落ち着いたデザインになっています。
「シンプルプレゼン」で有名なガー・レイノルズ氏の言葉を借りると、

「余白は埋めるべきものではなく、重要な何かである。」

まさにその通りであると思います。

5.インタラクティブ性

サイドバーとストリームを区切る線が、facebookでは単色のラインになっているのに対し、Google+ではストリームをクリックすることでコンテンツ単位に色分けがされるようになっています。
この細かな配慮によって、デザインエレメントそのものが主張しすぎず、ユーザーが読むべきコンテンツの量が把握しやすくなっており、よりインタラクティブで使いやすいものになっていると思います。

以上のfacebookとGoogle+のデザインの違いから分かることをまとめてみると…

アイコンを小さなスペースで表示する場合は、要素を限りなく削ぎ落すことによって視認性・統一感のとれたデザインになる。
適切な文字設定や、余白をうまく活かし、テキストをインターフェイスとして丁寧に扱うことで、読みやすく安定したデザインになる。
コンテンツを分けるエレメントを主張しすぎない程度に、機能を付加することでより使いやすいものになる。

Google+にあって、facebookに無いもの。それは、先行者が築き上げてきたものを土台に、余計なものを削ぎ落すという「引き算のデザイン」と、新たな価値を創りだす「足し算のデザイン」をバランス良く組み立てていると言うこと。

Google+のデザインは
マイナスでもあり、プラスでもある。
何を残し、何を活かすか。
選択のバランスを取ることの大切さを教えてくれます。

と…Google+を推しつつも、まだまだ（´・ω・）ﾎﾟﾂｰﾝとした感じなのでサークル入れてもらえたら嬉しいです。招待枠もたんまりあるのでtwitterでリプライいただければ招待状お送りしますので遠慮無くどぞ。

ふるさと再発見。

2011-08-24T03:25:00.000+09:00

会社の夏休みを利用して宮崎の実家に帰省してきました。
いつもは家で料理と時間をダラダラと貪っているのですが、諸々の事情で色々と回ることになり、美しい風景や面白い発見がたくさんあったのでその一部をご紹介したいと思います。

ではでは宮崎の魅力をご堪能あれ。

■三之宮峡

岩瀬川の清流に広がる渓谷。川沿いの遊歩道に11ヶ所も続くトンネルを通り抜けるたびに、自然にある黒色のフレームと、奥に見える緑色の鮮やかなコントラストがとても印象的でした。

トンネルをすべて抜けると、川霧のひんやりした感覚に、川のせせらぎの音と蝉の鳴く声で、記憶の奥底に眠っている真夏の山のイメージを呼び覚ますような空間が待っていました。
後でよく案内を見てみたら「残したい日本の音風景100選」ですと。納得です。

■出の山公園

全国名水百選に選ばれた水が流れ、夏にはゲンジボタルを見る事が出来る公園。
川霧が立ちこめた湖の上を、野鳥が自由に飛び回っていて、日本画に描かれているような山の風景を360度感じる事が出来ました。

淡水魚だけを100種類も集めた水族館もあり、普通の水族館では見られない様な不思議な生き物がたくさんいました。写真はその内の1匹。ウーパールーパーといえば、白色でかわいいイメージを思い浮かべますが、1匹だけ黒色で顔がキリッとしていて、なんだか男前な感じが面白かったです。

■サンメッセ日南

世界で唯一復刻が許されたモアイ像がそびえる場所。水平に広がる海と広大な空を背景に立ち並ぶモアイ像の姿は圧巻。

緑一色の丘をあがっていくと「天空の塔」と名付けられた建物があります。ロマン溢れる建物の雰囲気と、目の前に広がる海の景色がリゾートにいるような気分にさせてくれました。

■鵜戸神宮

崖にそって作られた橋を降りていった岩窟の中にある不思議な雰囲気の神社。海の青色と橋の朱色の色彩は、海面に現れた竜宮城のようで、なんだか引きつけられる魅力がありました。

不思議な雰囲気とは一転。神社から帰る途中、海へと続くノスタルジックな雰囲気の坂道もあったりして、タイムスリップしたような感覚にさせてくれる、たくさんの魅力を持った場所でした。

■青島神社

海岸から橋を渡って行く離れ小島のようになった青島にある神社。南国らしい木に囲まれた神社は、熱帯の秘境に迷い込んだような感じにさせてくれます。神聖すぎて江戸時代までは一般人立ち入り禁止だったとの事。歴史を感じるストーリーに、これまた納得。

宮崎＝東国原元知事、マンゴーと説明がしやすくなり、宮崎の知名度は高くなってきている感じがしていますが、まだまだ宮崎にはあまり知られていない魅力的なものがたくさんあると思います。
観光を予定の方や、宮崎近辺にお立ちよりの方は、ちょっと足を伸ばしてみると色々と新しい発見が出来て楽しいと思いますので、ゼヒともどうぞ。

自分が育った土地の事を、
知っているようで知らなかった事を知り、
離れていたことで、
その素晴らしさを発見した
そんな夏休みでした。

■おまけ

家の周りにいた猫。見返り美人ならぬ見返り美猫。猫がのびのびと暮らしているのも田舎ならでは。思う存分撮らせていただきますた。

細かすぎて伝わりづらい、Mac OSX Lionのデザイン変更点まとめ。

2011-07-25T01:38:00.002+09:00

先日発売されたMac OSX Lionを何の迷いもなくダウンロードして、日々Apple信者になりつつあるのを実感しております。
さて、実際に数日間使ってみた感想としては、追加機能や操作の変更がてんこ盛りで慣れるのに時間がかかりそうな感じですが、特に気になったのはUIのグラフィックも細かな変更がされているということ。
そこで、新しい機能や大きな変更が話題になっている中で、細かい部分にスポットライトを当てて、その「細かすぎる変更点」をまとめてみました。

違いが分かりやすくなるようにそれぞれ拡大してあります。
目を凝らしてどうぞ。

1.クローズ・ミニサイズ・ズームボタン

Snow Leopadでは各ボタンの大きさが14pxだったのに対してLionでは少し小さくなって12pxになっています。さらに、ロールオーバーしたときの記号のデザインも少し立体的なグラフィックになっています。
通常ではボタンは大きい方が押しやすくなるはずですが、小さくなったということは、これらのボタンの必要性が低くなっているということでしょうか。

2.ラベルカラーの間隔

Snow Leopadではラベルカラーの間隔が1pxだったのに対して、Lionでは間隔が広くなって2pxになっています。
実際に使っていても、間隔が広いLionのほうが色同士の識別がしやすくなったと思います。

3.ソートボタン

Snow Leopadでは項目を並び替えるソートボタンを区切る線が15pxで上下のアキが無かったのに対して、Lionでは上下に2pxずつ空きを作る形で11pxになっています。同じように、FinderのBack/Frontボタンも区切り線が上下にアキができているので、UIのデザインルールとして項目を完全に区切らない方向になったということでしょうか。

4.ウィンドウのテクスチャ

Snow Leopadではウィンドウ上部のカラーがグレーのグラデーションだったのに対して、Lionではノイズのテクスチャが追加されています。
テクスチャが入る事でiOSの持つアナログのテイストに近づいた感じがしますね。

5.ドックアイコン下のランプ

Snow Leopadではアプリケーション使用時のドックアイコン下のランプの大きさが10pxだったのに対して、Lionでは少し小さくなって8pxになっています。これは、アプリケーション操作の管理がMisson Controlで行う方向に向かっていることから、Dockそのものの必要性が低くなっているために小さくなったのではないでしょうか。

6.Finderアイコン

最後はおなじみのFinderアイコン。一見お変わりないように見えますが、拡大して見てみるとLionでは輪郭にハイライトが追加されて少し立体的になっていますね。微妙な変わりっぷりは、少しずつ絵が変わるモーフィングアニメのようで、危うく気付かぬままになるところでした。

以上、細かすぎて「些細な違いなど気にしてられん」とか「気付かない部分にこだわっても意味が無い」というお声が聞こえてきそうですが、美しいと言われるアップルのインターフェイスの総体は、1pxという画像を構成する最小単位のこだわりから成り立っているということ、細かすぎて伝わりづらい程に細部までこだわることの大切さを教えてくれます。

小さな変化が、大きな変化を創り出す。
アップルの革新は改善の積み重ねでもあるといえますね。

タイポグラフィを「学ぶ」から「楽しむ」体験へと変える。Typography Insight。

2011-07-04T11:21:00.002+09:00

先日発売したタイポグラフィ学習アプリ「Typography Insight」をいろいろと試してみてみました。
書体のエレメントの名称や歴史など、タイポグラフィの基礎を実際に手を動かして学ぶ事が出来て、これまでにない体験は「学ぶ」というよりも実践して「楽しむ」という感覚で、とても面白く、新たな可能性を感じました。
そこで、その面白さをより多くの方に知ってもらいたいと思ったので、Typography Insightについて色々と面白い点を紹介してみたいと思います。

考え抜かれたコンセプト通常は完成物としてのアプリしか公開されていませんが、Typography Insightはドキュメントとしてアプリが出来るまでのプロセスを詳細に残していて、着想から出来上がるまでの思考のプロセスがとても参考になります。
これまでの紙の本の問題点を解決するところからアプリの企画をスタートしていて、作者は以下の性質を問題点としてあげていました。

比較性
書体同士を比較するのが物理的に難しく、細部を比較する際はIllustratorなどのソフトウェアを立ち上げなければいけなかった。

検索性
書体やデザイナー名前などを調べたりする際の方法が、カテゴリやインデックスなどの大きな枠組みしかなく目的の書体を探し当てるのに手間がかかる。

詳報性
情報のスペースが限られているので見本の大きさが数種類しかなかったりと、書体を詳細に観察することが難しかった。

関係性
ページネーションに従って情報が構成されているのでそれぞれの書体のカテゴリやデザイナーと書体の関係性が分かりづらかった。

デザイナーならどれもウンウンとうなずける内容ですね。
上記にある様な紙の本の問題点を洗い出し、それらを解決した上でipadの様なマルチタッチUIを活かした「簡単かつ手軽に、楽しく学習できる」ということをコンセプトにして開発したそうです。

アプリだけでなく、その背景にある考えやストーリーを共有する事で、開発者とユーザーの両方の視点で考えることができて面白いです。

アナログの体験がそのままに

書体を並べたり、重ねたりと、Typography Insightで行うことはIllustratorなどのソフトウェアでも実現可能ですが、決定的に違うのは実際に文字に触れて操作するということ。それによって、マウスやキーボードを介する事無く、書体をプリントアウトして切り貼りするように、従来の方法論で書体に触れることで、書体に対するバランスの繊細な感覚を身につけることができます。

進化する教科書

現在のインターネットでは完成されたプロダクトを世の中に出すよりも、不完全な物をユーザーの声を聞きながら協同で作り上げていった方がうまく行くといわれています。
Typography Insightも現在は基礎的なものだけで、搭載フォントや書体関連検索の機能、日本語や中国語など他言語対応していくとのことで、これからの進化が楽しみです。

テクノロジーの進化が、学びの体験を変えていくということを体感できる。
タイポグラフィに関わるすべての人へ、必携のアプリです。

関連リンク
Typography Insightホームページ
Thesis Paper（制作プロセスの資料PDF）

The law of beauty hidden behind the iCloud icon.

2011-06-21T22:55:00.001+09:00

On the other day, iCloud has been introduced to the world and it became a big topic of conversation. The design of icon is refined as ever. Let's think about why it looks so beautiful. Changing the point of view a little, I'll try to find out the reason of its beauty by focusing on icon design itself.

At first, let's take a look at its appearance.

Its shape is balanced while the outline is irregular. It may looks easy to settle the whole shape as cloud-shaped with simplicity and balance, however, it's not that easy. It's actually a refined design.

We can't approach the reason of beauty only by just looking at. So, let's peer into its design.

As some of you may already notice, there are four circles hidden in the whole shape. At first glance, the curve looks irregular. Although, if you look at it further, it turns out that it has a balanced shape composed of precise circled.

In short, it tells that the beauty of icon comes out of the geometry. However, it's questionable that aligning circles at random can produce the balanced design.

So, I explored it further and measured the diameter of circles.

Surprisingly, the ratio of two pair of circles is 1:1.6, which is close to the golden ration.

Furthermore, I measured the ratio of the whole cloud.

It's truly "One more thing".

It's shaped as perfect design which casts its beauty on our unconsciousness by utilizing fundamental principle such as the golden ratio as well as the geometry.

To summarize...
•Geometrically-set curves generates the balanced shape.
•Applying certain law to random shapes brings the balanced design in whole.

Simple, but profound.
Awesome Apple's design philosophy.

Original Japanese article is here.
(Uploaded on June 09.)

icloudのアイコンに隠れた美しさの法則。

2011-06-09T16:30:00.006+09:00

Thank you for coming to my blog! this article English version is here.

先日のWWDCで発表されたicloud。アップルのクラウド本格参入ということで色々とサービスが話題になっていますが、相変わらずアイコンのデザインも綺麗に仕上がっていますね。
では、なぜ美しく見えるのか、少し視点を変えてアイコンのデザインそのものに注目して、その美しさの理由に迫ってみたいと思います。

まずは、なんとなく眺めてみましょう。

雲の輪郭が不規則な曲線を描きつつも、とてもバランスのとれた形になっていますね。ワラのなかから一本の針を見つけるぐらい、とまではいかないと思いますが、シンプルでバランスのとれた形にしながらも雲に見えるような形に定着させるのは、簡単そうに見えて意外と難しく、磨き抜かれたデザインだということが分かりますね。

なんとなく眺めているだけでは美しさの理由に迫れないので、もう少し目を凝らして見てみましょう。

勘の良い方は既にお気づきだったかと思いますが、形の中に4つの円が隠れていることに気がつきます。一見、何となく描いたように見えるカーブでも正円で構成することでバランスのとれた形になっていることが分かります。

つまり、「アイコンの美しさは幾何学で構成することにあり」ということが分かるわけですが、単純にランダムな円を配置していくだけでバランスのとれたデザインに仕上げることができるか、と考えるとあらゆる可能性が頭をもたげ、少し疑問に思えてきてしまいます。

そこで、さらなる理由を追い求めて、今度は円の直径を測ってみました。
すると…

なんとまあ、それぞれ左右の円の比率が1：1.6と、見事に黄金比に近い比率になっているではありませんか。

さらにさらに、雲の形の比率も調べてみると…。

まさに、「One more thing」。

幾何学だけでなく、黄金比のような原理的な法則を駆使しながら、美しさを無意識に訴えかけるスキのないデザインに仕上がっていますね。

まとめてみると…
・曲線を幾何学で構成（補正）することでバランスのとれた形になる
・細部のランダムな大きさの中にも一定の法則を適用することで、全体的にバランスのとれたデザインになる

シンプルなのに奥深い。
恐るべし、appleのデザイン哲学。

The essence of Japanese.

2011-05-30T19:46:00.001+09:00

気持ち悪いけどカワイイ、

ダサいけどカッコイイ、

不細工だけどカワイイ、

否定と肯定の狭間にある曖昧さ。

良いところも悪いところも含めてどう見るか、

そこに本質がある。

WEBタイポグラフィの「これまで」と「これから」。

2011-04-25T19:53:00.000+09:00

タイポグラフィ好きが夜な夜な表参道に集う会、Typetalks第3回に行ってきました。
メンバーは前回と同じヤマダコウスケさん、高岡昌生さん、小林章さんがSkypeビデオでの参加で、今回もタイポグラフィについて内容てんこ盛りのトークが繰り広げられました。

大きな内容として、WEBフォントとはなんぞや？という話から、そのWEBフォントを使ってWEBデザインにおける欧文組版はどこまで可能かについての話でした。

これまでのWEBサイト上の文字は、デザインを優先するために画像化されていたりして、汎用性の面で問題があることが多かったのですが、「WEBフォント」がそれらの問題を解決し「汎用性」と「デザイン性」を両立できることから、これからもっと普及していくだろうという事でした。

では、「WEBフォント」はWEBタイポグラフィにおいて、どういった問題を解決し、何を変えていくのか、「これまで」と「これから」を今回のセミナーの内容を元にまとめてみたいと思います。
※走り書きしたメモをもとにまとめたものなので、問題点などあれば遠慮無くコメントorツイートいただけると助かります!

■フォントファイルの場所

これまで表示されていたフォントはローカル上のデバイスフォントが表示されていましたが、これからはクラウド上（サーバー上）に置かれているフォントも表示させる事が出来るそうです。

■フォントの選択

これまではフォントを表示できる数はOSにインストールされているものに制限されていましたが、WEBフォントとしてクラウド上からフォントを表示するようにすることで環境に左右されることなくフォントが無制限に選択出来るようになっていくようです。

■和文フォントの表示

これまでOSにインストールされているもの以外の日本語フォントを表示するためには数MBもあるフォントデータをまるごとダウンロードさせて表示させなければならず、ダウンロードに時間がかかるためどうしても表示にタイムラグが発生してしまっていましたが、これからは「ダイナミックサブセッティング」というプログラムによってWEBページに表示されている文字のみをダウンロードして表示することで表示速度が改善され、より現実的なものになっていくようです。

■導入コスト

これまではフォントデータをサーバー上に置いて、ブラウザごとに分岐処理をする手間がかかったり、ライセンス等の問題が色々あったのですが、無料もしくは一定額の料金でWEBフォントサービスで設定し、簡単なコードをコピペするだけで後はおまかせで表示させることが出来るようになるそうです。

■まとめ
フォントの選択肢は増えるし、CSSの設定はコピペで済むし、テキストデータなのでコピペできるし検索ヒットするしetc.....
という感じで、良い事だらけで何かデメリットがあるんじゃなかろうかと疑ってしまいたくなる具合ですが、今のところ思いつくのは非対応のブラウザで表示されてしまったときの残念な感じが予想できてしまう、といったところでしょうか。

これから対応ブラウザが一般化し、フォントの選択肢も増えてゆくことを考えると、WEBタイポグラフィ知識の重要性がさらに高まってゆくのではないかと思います。

WEBフォントのシステムも理解しつつ、組版の知識も身につけつつ、デザインのスキルも磨きつつ…。色々と大変なことにはなりそうですが、その分新しいことに挑戦しつつ楽しんでいきたいですね。

「みんなで分け合えば、できること。」のポスターデザインで考えた7つのこと。

2011-03-28T00:17:00.002+09:00

「みんなで分け合えば、できること。」のポスターを作ってから、予想外の反響にてんやわんやで思考がオーバーヒート状態だったのですが、少し落ち着いてきたので、自分がなぜポスターを作ろうと思ったのか、その過程と広がりを時系列にしつつ、デザイン的な観点で整理して記しておきたいと思います。

1.デザインのきっかけ地震発生後、テレビなどで被災地の惨状を見るたび、一人の人間として何も出来ないことに歯痒さを感じていました。そんな中、余震が続く東京などでは、少しでも安心したいという気持ちからか、食料品・日用品の買い占め現象が発生し、物資が少ない中で多くの人が必要以上に買いだめする事で、物流のバランスが崩れ「今、本当に必要としている人々」に届かなくなるという事態が起きました。
地震発生直後は落ち着いていたスーパーやコンビニなどが、翌日には買いだめする人たちで溢れ、食料品などほとんどの棚がガラ空き状態になっているのをみて「これは異常だ」と感じていました。
その中で、twitter上で節電を呼びかける「ヤシマ作戦」に続き、物資の譲り合いを呼びかける、どうぞどうぞ精神の「ウエシマ作戦」を広めようという動きがあり、コピーライターの方々が続々と買いだめ防止をよびかけるコピーをツイートしていました。私もその目的のわかりやすさに共感し、「デザイナーとして何ができるだろう」と考えた時に、「買い占めの皆様へ。」という「少しだけ我慢すればどれだけ多くの人を助ける事ができるか」ということが明確に数字にされたツイートを見て、このメッセージをさらに分かりやすく瞬時に伝え、「買いだめ現象の異常さに気付きをもってもらえる様にすること」がデザイナーとして出来る事なのではないかと考えました。

2.デザインの役割デザインとは付加価値を生み出し、差別化していくための手段だと思われがちですが、原点に立ち返ってみるとデザインは目的を達成するために「情報をより分かりやすく整理する」ということにたどり着きます。
錯綜する情報、刻一刻と変わる状況で、世の中は「スピード」と「分かりやすさ」が求められていると感じ、その状況でデザインの力を活かす事が出来るのではないかと考え、その効果を最大限に生み出せる「インフォグラフィックス」という手法を使おうと考えました。

インフォグラフィックスとは、複雑な内容やイメージしづらい物事の仕組みなどを把握・整理し、視覚的な表現で他の人に情報を分かりやすく伝えるグラフィックデザインのこと。絵や図で説明すると、言葉で伝わらないことでも簡単に理解できる。それがインフォグラフィックスの目的であり、理想である。（木村博之／インフォグラフィックス―情報をデザインする視点と表現、2010、P8）

3.デザインのジレンマ節電が叫ばれている中で、Macやモニタなどの電力を消費するものを使って制作をしていたので、「このままポスターを作らずにMacをシャットダウンした方が節電になり、自分が今すぐできることなのではないか」というジレンマに陥りました。
しかし、ポスターを作りtwitter上のテキスト主体のコミュニケーションだけでなく、より多くの人に伝わるように視覚化する事で、自分一人が節電するよりも、より多くの人に見てもらい、気付きを持ってもらう方が、前向きな成果を見込めるのではないかと考えました。
デザインが生み出す分かりやすさ、その可能性を信じました。

4.デザインの可能性ポスターをデザインしている時に、一番に重視したことは「押し付けがましくないデザイン」にするということ。買いだめの心理は一人一人の不安な気持ちからなる生存本能であり、人として生きる為の能力を否定することはできない、でも一方で理性的な生き物でもあるという事から、「買い占めのみなさまへ。」の物資の関係性を分かりやすく見せる事で、自発的に気付きを持ってもらえる様なものを目指しました。買いだめ防止を押し付けるよりも個人の自主性を尊重した方が遥かに納得感が起きやすいと考えたからです。

また、標識や工事現場の表示などで日常的に刷り込まれている「黄色と黒」の注意喚起のイメージをベースに、情報は極力シンプルに、奇をてらわず愚直に分かりやすさを追求したものにしました。

デザインがある程度進み、最後のコピーをどうしようかと考えた時に、買いだめ防止を呼びかけるコピーが次々とツイートされていた中で、@YOUTHEKICKさんの「分け合いの気持ちを大切に」という趣旨のコピーがストレートに飛び込んできて「これだ」と思いました。実際にコピーを入れてみると、意味がストンと落ちる様な形でデザインが仕上がりました。

5.デザインの拡散力ポスターを作り始めて約3時間後に完成し、ツイートしてからその日の夜には10万を越えるフォロワーを持つ方々に次々とリツイートされ、翌日からは新聞、テレビ、ネット、ラジオなどあらゆるニュースメディアで紹介されていき、それを推進力にデジタルからリアルへ大きく広がり、実際にあらゆるところに貼り出される様になりました。
他にもポスターとしての形態に留まらず、ムービー、バナー、待ち受け、Tシャツ、萌えイラスト版、歌など様々なアクションのきっかけにもなり、デザインの意図がシンプルで明確であればあるほど共感が起きやすいということを実感しました。

6.デザインの本質今回のポスターデザインで感じた事は、Youtube・USTREAMなどの動画メディアや、際限なく増殖するWEBメディアが一般化して受け手の情報量が増えていく中で、希代の写真家ロバート・キャパをモデルにしたミュージカル『NEVER SAY GOODBY』の歌詞に「たった一枚の写真でも　人生の真実を映し出せると」あるように、「たった一枚のデザインでも　物事の本質を導きだせる」ということ、グラフィックデザインの力強さを再認識しました。

7.デザインの力ポスターをデザインしてから数日後、学生時代にとてもお世話になった方から突然電話をいただきました。その方は、私が新聞奨学生をしていたときの販売店の店長で、色々と相談に乗ってくれたりしていて、その方が店長でなければ今の自分はないと言っても過言ではないくらい心の支えになっていただいた方でした。
その店長の奥さんが気仙沼の出身で、親戚の方々が被災されてとても大変な状況であるという事でした。私自身もその知らせに驚き、心が痛みました。
でも、その中で「自分が世話をした学生が震災復興のために、前向きな行動を起こしていたことをニュースを通して知り、とても元気付けられた」とメッセージをいただきました。自分にできる「デザインの力」で少しでも貢献・恩返しできたこと、一人でも多くの方に役立てたのだということを心の底から実感することができて、行動を起こして本当によかったと思いました。

主観的で退屈な長文になってしまいしたが、最後に強調しておきたいのはポスターが出来たのはソーシャルメディア上で共感の連鎖があったからだということです。
@amnesia828さんの「買い占めの皆様へ。」の分かりやすいツイートがあって、@YOUTHEKICKさんの素晴らしいコピーがあって、twitter上で多くの方々に共感していただけたからであり、決して自分一人の力で出来たものではないということ。ソーシャルメディアの大きな可能性を体感する事が出来ました。

一刻も早い震災復興のために、今回の経験を糧に「デザインの力」を信じて、次なる行動へつなげていきたいと思います。

手のひらの中の小さな行動でも、みんなを救う力になれる。「SAVE MIND, 100 CREATION」

2011-03-24T17:56:00.003+09:00

「みんなで分け合えば、できること。」のポスターを公開したことがきっかけで、ケータイ募金サイト「SAVE MIND, 100 CREATION」に作品を提供させていただきました。

「SAVE MIND, 100 CREATION」とは、復興に向けてクリエイター100人が100作品を提供し、1作品105円でダウンロードすることで、被災地の方々へ全額寄付をすることができるというものです。

「ケータイで募金」という、
手のひらの中の小さな行動でも、みんなを救う力になれる。
今は「自分にできること」を信じて
一つずつ大切に行動していきたいと思います。

こちらのQRコードからアクセスで募金をすることができます。
（ケータイからのみダウンロード可能です）

提供作品はこちらでも見ることが出来ます。

ソニー・デジタルエンタテインメント・サービス公式ブログ

ロゴマニュアルはもう古い？変化し続けるアイデンティティ『MIT Media Lab Identity, 2011』

2011-03-10T12:21:00.001+09:00

MIT Media Lab Identity, 2011 from readyletsgo on Vimeo.

MIT Media Labのロゴ。
このロゴは40,000通りのバリエーションに変化するそうで、これまでの「ロゴは固定化する」という概念を打ち砕くようなものですね。
バリエーションがある中でも一定の規則性を持たせ、イメージを一貫しながらも動的に変化していく。
視点を変えることで様々な見え方になるということが見事に表現されているようで面白いです。

紙媒体がデジタルメディアに置き換わっていくことで情報量が増えていく。
伝えるメッセージは「質より量」か「量より質」か、デザイナーはメディアの特性を熟知してコミュニケーションを設計していかなければならないですね。

Think Deeply.

2011-03-09T13:21:00.000+09:00

なぜ、そうなるのか。
なぜ、そうするのか。
思考をとことん掘り下げる。
アイデアは、その先に待っている。

買い物をエンターテインメントにする!『店頭デザイン大解剖展』

2011-02-21T01:19:00.003+09:00

普段はあまり深く意識する事の無い「店頭デザイン」にスポットライトをあてた展覧会『店頭デザイン大解剖展』に行ってきました。

仕事で店頭デザインの制作をやることが多いので、そのネタ探しとして行ったのですが、思った以上の発見がありました。その中で興味深かった発見を3つほど。

■店頭デザインの重要性
マスメディアの煽動による記号消費が失われつつあるなかで、店頭でダイレクトに消費者に語りかける事ができる様な、即効性の高いものへの重要性が高まってきているそうで、これからはより生活者視点でコミュニケーションを考えていかなければならないということを感じました。

■多様な店頭デザイン
店頭行動を5つのキーワード「集合力」「サイズ」「目利き」「安心と信頼」「ストーリー」に分類して解説されていて、例えば「サイズ」エリアの商品が極端に大きくなっているPOPなどは「普段は小さいものをあえて大きく見せる事で驚きを演出している」といった様に、さまざまな店頭演出の手法が詳細に解説されていて、店頭デザインとひとくくりにするには余りあるほどバラエティに富んだデザインがいっぱいでした。

■単に商品が並んでいるだけの買い物は面白くない
「店頭デザイン」は、消費者との空間を多彩に演出する事で、単なる「消費行動」を「お買い物」として多彩に演出することでエンターテインメントとしての役割をはたしてくれているのだと感じました。

入場無料なので、店頭のデザインに関わる人はタダで引き出しが増やせます!
そうでない買い物好きな方も、展示に行ってみた後は「お買い物での発見」がより楽しいものになるかと思います!

Typetalksに行ってわかった、グラフィックデザイナーとWebデザイナーの、オンスクリーンタイポグラフィにおける意識の違いまとめ。

2011-01-25T12:09:00.001+09:00

「フォントについて参加者同士でオープンに意見を交換しよう!」という、楽しげなタイポグラフィセミナーのTypetalksに行ってきました。

講演された方は有名なフォントブログを運営されているヤマダコウスケさん、欧文組版についての詳細な本を書かれている高岡昌生さん、ドイツにおられる小林章さんがSkypeビデオでの参加でした。ドイツとの距離感を全く感じず便利でありがたい時代だなぁとしみじみ。

本題の講演内容についてでしたが、主にヤマダさんがWebデザインの観点からWebにおけるタイポグラフィについてテクニカルな部分を中心に語られていて、そこに高岡さんと小林さんが気になった事を掘り下げていく感じでした。

その中でも印象的だったのがヤマダさんがグラフィックデザイナーやクライアントとWebの仕事をする時に、文字の扱いに対して認識のズレが結構あるようで、その苦労話が印象的でした。

紙のデザインであたりまえにできることができなかったり、グラフィックデザイナーの作るWebサイトは総じてWebデザインのお作法をわきまえていないなどの話があったり、自分もWebデザインについて色々と勉強中で、違いの部分がイマイチ整理できていなかった部分があったので、それをまとめてみることにしました。

1.フォント

グラフィックデザイナーが無数にあるフォントのなかから自由に選ぶのに対して、Webデザイナーは効率さを重視し、文字を画像化するのを好まないため、選びたくても選べない。欧文であればWin&Macに入っている共通のフォントをCSSで使用する事で質の高いフォントを使用する事が可能だが、数えるくらいしか無いのが現状。

2.字間

紙媒体のデザインはコンマ何ミリの世界でこだわりますが、Webの場合だとCSSで字間を設定しても、IllustratorやPhotoshopで文字詰めするように、緻密に設定できないのでこだわりようがない。スクリプトで使用可能ですが、技術的に少しハードルがあがってしまうのが難点。

3.行間

グラフィックデザイナーは行間について気を使うのは当然ですが、紙媒体の場合はスペースに限りがあるのでゆったり組めないことが多い。
反面、Webデザインでは現状の多くのWebサイトを見れば分かる様に、スペースがあるにもかかわらず配慮されていないことが多い。
行間についてはWebの方が自由度が高そうに思えますが、これまた閲覧環境によってフォントも変わるので最適な行間を導き出しにくいのが難点。

4.単語間

グラフィックデザイナーは字間と同じ様に細かく調整するのに対して、Webデザインでは調整は可能ですが、閲覧者の環境によっては意図した表示とズレでしまう可能性があるのでリスクが高い。

5.段落

グラフィクデザイナーは本文などは基本的に箱組を好みますが、Webデザインで箱組にしすると行末が綺麗にいかなかったり、欧文などが多く混ざっていると意図しない表示になる可能性があってリスクが高い。
この現象は紙のデザインにおいてもよく発生し、その都度細かい調節で回避可能ですが、Webの場合はブラウザによって解釈が変わるので、調整に難点があるそうです。

まとめ

グラフィックデザイナーは感覚的にイメージしているものを極力定着させた形で見せるのを重視するのに対して、Webデザイナーは効率性を重視し、合理的なデザインを重視されることが多いようです。
基本的に、文字の組み方は複数の要素を相対的に調整して美しく読みやすくしていくものであるため、その要素をすべて微調整できないWebデザインでは妥協せざるをえない部分が多いようです。こうしてみるとグラフィックデザイナーがワガママをいっているようにも…。

同じ平面のデザインでも、互いの常識は常識では無いということ。
二つのデザインを隔てる意識の壁を取り払って、一貫した良いコミュニケーションを生み出すために、お互いに歩み寄り、最適解を探す事が大切なのだと感じます。

まだまだ知識不足なので「ココの部分は解決できる方法があるよ!」などがありましたらTwitter、コメント欄で教えていただけるとありがたいです!

Remember true purpose.

2011-01-17T22:40:00.000+09:00

本当の目的は何処にあるのか。

目の前のタスクにとらわれすぎて、

心が埋もれてしまってはいけない。

ipad DJをネクストレベルへと引き上げる。『djay for ipad』

2010-12-13T18:55:00.000+09:00

こんなDJアプリを待っていました!

「djay」とは、機能が最低限であるが故に直感的な使いやすさを実現しているDJソフト。そのdjayのipad版が出たということでアプリの中ではやや高額の部類ですが、迷わず購入しました。
いざ使ってみると「djay」の使いやすさはそのままにしつつも、タッチインターフェイスが加わる事によってスクラッチの感度も良好で、素晴らしいアプリに仕上がっています。以下具体的にご紹介します。

回るアルバムアート
通常のDJソフトは曲名の文字が表示されているだけの簡素な感じだったりするのですが、「djay」の特長であるアルバムアートがレコードのレーベルとして表示され、回っている事で音楽を観る事の楽しさを再認識させてくれます。

無限の選曲
これまでのDJアプリではWifi経由で取り込まなければいけなかったりと、使い勝手が悪いところがあったのですが、「djay」ではitunesライブラリに登録されている曲をすべて選曲することができるので、ストレスなく自由な選曲が可能になり、いつでもどこでもミックスを試すことができます。

アナログメタファの成功
アナログからデジタルへとインターフェイスが変わる段階において、電子書籍のブックメタファの価値についてはその必要性が低いとされていますが、「djay」においてはアナログターンテーブルの構造を模している事で曲の位置関係やスクラッチなどの感覚がリアルに近い形で再現されて直感的に操作できるようになっているので、アナログに親しんできた世代は抵抗なく使いこなすことができます。

今までアナログの機材を揃えようとすると重かったり場所をとったりと物理的に色々大変だったワケですがiPad一台で遜色ないものが手に入ってしまいます。

DJをやってみたいけどお金も場所もない( ノД`)
そんなお嘆きの方が気軽にDJが始められて、ipadの可能性をまだまだ感じさせてくれる、そんなアプリです。

日本のデザインに脈々と流れる「桑沢イズム」を感じ取る。「SO＋ZO展」

2010-11-26T02:13:00.001+09:00

日本のデザイン界、アーティスト界の歴史に名を刻んできた「桑沢デザイン研究所」と「東京造形大学」の企画展。多くの優れた人材を輩出している教育機関。その秘密を少しでも探るべく行ってきました。

圧倒的な作品群

約100人の方々の多岐にわたる作品群は、とても密度が濃く、その量の多さから優れた教育機関であることの証明を目の当たりにすることができます。

ユニークな授業

「100円でどれだけ良いデザインをみつけることができるか」という様な課題があるそうで、デザインの視点を養えるようなやり方はとても勉強になりました。

桑沢イズム

教育思想の根幹にある「社会をよりよくするためのデザインを実現するために、デザインをする人間そのものが社会的、良識人でなければいけない」という考えは、現代社会におけるデザインのありかたの源流を成しているのだと思いました。

展覧会を通して感じた事は、徹底して「考える」ということ。

普段、小手先の技術に頼りすぎて本質的に考えることをおろそかにしがちなので、この展覧会を通じて「桑沢イズム」を感じ取る事で初心を思い出す良いきっかけとなりました。

テクノロジーの発達が加速度的に早まっていく中で、それを使って創造する人間の思考は追いついているか。

デザインを過去から未来へと見据えることが出来る良い展覧会です。

「デザインフェスタ」に出展してきました。

2010-11-15T03:06:00.002+09:00

「デザインフェスタVol.32」に出展してきました。

出展したのは目盛りタイプのオリジナルふせん「POOK」です。

本に付せんを貼っているときに、貼る高さの位置で優先順位をつけて、それがイコライザーのように見えたら面白いのでは、という発想から始まり、この思いつきのアイデアをどのくらいの方々に受け入れられるのだろうか、という好奇心から出展しました。

始めは色のバリエーションのみで考えていたのですが、ビジネスライクすぎるということで遊び心のある絵柄も追加し、全10種類のふせんの制作と、ディスプレイ、POP、リーフレット、ホームページなど含めて、2人がかりでトータルにデザインしました。

初出展だったので「もしかしたら1個も売れないかも」という不安に包まれながらでしたが、予想以上に好評で非常に多くの得るものがありました。

出展してよかったこと
●お客さんの反応をダイレクトに感じられる
たくさんの来場者の中で、興味をもっていただける方はどんな人なのか、商品の説明をしたときのリアクションなどを直に受け取る事で、求められているものはどのような商品なのか、ということを肌で感じ取る事が出来ました。

●他の出展者の方と知り合える
来場者の方だけでなく、出展者の方も見に来てくだっさって、自分も他の出展を観に行く事で、自然と交流するようになるので様々なクリエイターの方と知り合える絶好の場所です。

●売れると、とにかく嬉しい
自分が一から考えてデザインしたものが人に受け入れられて、しかも買っていただけたときの喜びは何物にも代え難いです。
本当に、心の底から「ありがとうございます」といったのは何年ぶりだろう、と思うぐらいに充実した気分になりました。

出展で大変だったこと
ミニブースだったのでディスプレイなどの準備は少なくて済んだのですが、開催直前の2週間くらい前から他の用事が立て込んできて始めのスケジュール通りにいかず、出展できるかどうかの瀬戸際で、睡眠時間を削ることになった事が精神的にも体力的にも大変でした。

大変だけれども、それを補ってあまりあるぐらいたくさんの笑顔とエネルギーが会場に満ちあふれていて、とても刺激になりました。

この経験を糧に商品のバリエーションを増やしつつ次回出展に向けて、また頑張りたいと思いますので、みなさまぜひぜひよろしくお願い致します!

POOKのホームページはこちらからどうぞ↓
http://pook.sub.jp/

文字に触れる。タイポグラフィ・エクササイズアプリ「EL」

2010-10-27T11:37:00.000+09:00

このところデザインフェスタに出展する関係で更新が滞ってしまいました…。

ぎりぎりですが、近々出展する商品のHPを公開できる予定です。

先日、タイポグラフィ・エクササイズアプリ「EL」を購入しました。

文字好きはマストなのでご紹介。

ipadで直感的に「四角」と「数字の2」という限られた要素を使って画面の構成を学ぶアプリです。

目的としては、Illustratorなどでマウスを使ってオブジェクトをあーでもないこーでもないとやっているのと同じなのですが、実際にオブジェクトに手で触れて自由に動かしたり拡大縮小できるので、アナログともひと味違った感覚で面白いです。

機能としてシンプルな分、限られた制約の中で多様な構成を生み出すことの大切さを実感させてくれます。

このアプリを使ってみて、モリサワの「Fontpark」などがアプリ化されたりすると、またひと味違った操作感になるのでは、と思いました。

このアプリは基礎レベルのもので、レベルに合わせて順次発売されていくらしいので、次回リリースも楽しみです。

Don't be a slave to grid.

2010-10-08T16:55:00.000+09:00

システム化されたレイアウトは

合理性を高めてくれる反面、

動的なイメージが低下する。

グリッドを意識するあまり、

思考まで囚われてはいけない。

次世代クリエイティブを体感、TOKYO GRAPHIC PASSPORT。

2010-09-28T12:05:00.001+09:00

TOKYO GRAPHIC PASSPORTに行ってきました。

世界各国のクリエイターのプレゼンテーションや、様々な展覧会やワークショップが開催されていて、自分が何人いても足りないくらい楽そうなイベントが目白押しでした。

数あるセッションの中で、「タイポグラフィーの可能性」と「モーショングラフィックの最前線」というテーマのセッションに参加してきました。

「タイポグラフィの可能性」
このセッションでとりわけ興味深かったのがtomatoのジョン・ワーウィッカー氏のトークで「タイポグラファーは音楽家である」ということ。
人が文字に接するとき、その形によって心の中で生成される言葉の音が様々であるように、音楽も演奏する形態によって様々な音色を奏でるという点から、共通した「音」というものを作り出しているからなのだということを感じました。

文字と音楽。一見関係無さそうに思える事柄を結びつけて考えているワーウィッカー氏の思慮深さに感服。

「モーショングラフィックの最前線」
いろんな意味でダントツで面白かったのがデビッド・オライリー氏。
のっけから「私は馬鹿でなので、通訳の方が知的に訳してくれることを望みます」と発言したり、意味不明な自己紹介スライドの日本語が絶妙な組み合わせだったり、短い映像を流しているあいだに、ふと舞台からいなくなったかと思えば衣装を着替えて意表をついたりと、単にトークしているだけでなく、参加している人を楽しませるというエンタテインメント性の高いトークでした。
作品も他とは際立った世界観をもっていて、想像力の異次元を垣間見ることができます。

また、これからは「組織ではなく個人がクリエイティブシーンを担っていくのではないか」と話されていて、まさにYouTube時代を象徴するクリエイターだと思いました。

展覧会は29日までやっているそうなので興味のあるかたは是非。
新世代の作品群が、凝り固まった思考を爽快に打ち砕いてくれる事間違い無しです。

新宿消火器デザイン考。

2010-09-21T00:47:00.000+09:00

新宿図書館から帰る途中に、何やら見慣れないデザインの消火器ボックスがありました。

消火器というと真っ赤なイメージがあるのですが、この消火器ボックスのデザインは白をメインに使っていてあまり消火器らしくない感じです。このくらい落ち着いた感じのほうが景観的には良いのでしょうが、反面いざというときに消火器だということが分かりづらい側面をもっていると思います。

街の景観をとるか、分かりやすさをとるか。そんな事を考えながら歩いていると、1分も歩かないうちに違うデザインの消火器に遭遇しました。

この消火器ボックスは側面に赤の配色がされていて、正面はステンレスのような感じで先ほどのものとはまた違った印象をうけます。
比較して見た時にこのデザインで特徴的な部分は側面に大きく消火器と表示されている点だと思います。
理由として考えられるのが、消火器を探す際は「必ずしも正面から見るわけではない」ということから側面にも分かりやすく表示されているのではないでしょうか。
上部の三角型はどんな意味があるのでしょうか。謎です。屋根のような形をしているので消火器の一戸建てのように見え、ミニマムでかわいらしい感じがします。

今度はどちらの消火器ボックスのデザインが優れているのだろうと考えながら道路を横断しようとしたところ、真っ赤な見慣れたアイツが視界に飛び込んできました。

そう、ここは早稲田通り。

道路を一つ渡ると中野区なのです。

先ほどの新宿区の消火器ボックスが新築のマイホームだとすると、こちらは木造借家のようで少し頼りない感じがします。それでも中野区の消火器ボックスは変わりないようで雨風にさらされながらも今日も元気に直立しているようです。

デザインをよく見てみると真っ赤で従来の消火器らしいイメージで一目で分かるのですが、遠目で見るとポストと見間違えやすい点があるかと思います。

これまでの消火器ボックスのデザインを総合してみると、やはり「赤」という色は欠かせない要素であることがわかります。その中で視覚的に強い赤色を、様々な景観の中でバランスのとれるようにデザインしながら、いかに「消火器がある」という認識をつくりだすかが重要なのではないかと思います。

普段はまったく気にしていなかったのに、ひとたび「消火器」を意識するといろんなデザイン情報が飛び込んでくる。

視点を変える事の面白さに改めて気付いた一日でした。

がんばれ中野区消火器ボックス。

AvenirとFuturaに込められた、共通する1つの想い。『30 Essential Typefaces for a Lifetime』

2010-09-12T20:24:00.001+09:00

30 Essential Typefaces for a Lifetimeが届きました。

渋谷のLIBROで見て欲しいなと思い、何となくamazonで調べてみたら海外の書店だと新品で半額以下だったので、書店にいながらもamazonで注文してしまいました。

アメリカからの発送でよほど過酷な旅をしてきたのか、新品にもかかわらずカバーがくたくたで、労をねぎらってあげたいぐらい疲れた本でした。まあ、半額以下だったのでよしとします。

本の内容は、世界中で多く使用されている主要な欧文書体の制作背景・主な用途・作品事例が様々なデザイナーのインタビューとともに掲載されています。

Avenir,DIN,Frutiger,Sabon,Times New Romanなどについてまとめられていて、様々な定番書体の背景を理解するのにとても参考になります。

和書だと欧文書体に関する本が限られてくるので、英語を身につけて洋書で知識を広げる事の大切さを痛感します。

この本で面白かった部分は小林章氏のAvenirついての話です。

・「Avenir」は「Futura」より良いデザインを目指した書体（Futuraとはラテン語で「未来」の意味）

・Avenirはフランス語で「未来」を意味する

AvenirはFuturaを出発点とし、共に未来を意味する書体でありながら、より良い未来への想いが込められた書体だということです。

書体の名前の由来を知る事で、また違った視点で関わり合う事が出来る。

知れば知るほど面白い世界ですね。

綾の照葉樹林。

2010-09-07T16:04:00.001+09:00

実家の宮崎へ帰省したときに綾の照葉樹林に行ってきました。

この地で一番の目玉といえば綾の大吊橋。

長さ250m・高さ142mの、日本で2番目に大きい歩行者専用吊り橋で、思わず脚がすくんでしまうほど高くて長いのですが、その怖さを乗り越えてまでも観る価値のある絶景が目の前に広がっています。

視界に収まり切らないほど壮大な自然は、何となくジブリの原風景を見ているようで、不思議な気持ちを思い起こさせるものがあります。

普段はMacの前にへばりついて仕事をしていることが多く、どうしても視野が狭くなってしまいがちなので、自然の中で五感を刺激できる体験はとても貴重で、心地良いリフレッシュになりました。

宮崎へ観光に行かれる方はコースに入れて間違いなしのおすすめスポットです。

「音楽」と「デザイン」が一体化した空間。ロンドングラフィックデザイン展『UK? OK!!』

2010-08-30T00:48:00.000+09:00

渋谷のパルコで開催されている、ロンドングラフィックデザイン展『UK? OK!!』に行ってきました。

UKのデザインシーンを支える各デザイナーの「Sound」をテーマにしたグラフィックとインタビュー映像がボックスごとに展示されています。

いろんな音楽のジャンルの発祥地なだけに「Sound」の多彩な表現があり、「UKのグラフィックデザインシーンは音楽と密接な関わりがある」ということを空間を通して感じ取る事が出来ました。

この展示で面白かったところは、作品がボックスごとに断絶されていることで、それを下から能動的に「くぐる」ことによってデザイナーの持つ世界と面と向かって向き合う事ができるところです。

その中で特に興味深かったのが、Tom hingston studioとTappin Goftonのインタビュー映像におけるコメントの共通点です。

「UKのシーンは小さなインディペンデントなスタジオが創っている」Tom hingston studio

「アイデアと情熱さえ持っていれば世界的なプロジェクトは成功させられる」Tappin Gofton

とても野心的なコメントで、シーンを創り上げることに規模は関係なく、どういった意識をもってデザインに関わっていくかを考える事が重要なのではないかと思いました。

ラスト3日間中だったので、TomatoのSimon taylorが制作されたスペシャルサウンドとのコラボレーションも行われていて「音楽」と「デザイン」の関係性を改めて考え直す良いきっかけとなりました。

『文字をつくる9人の書体デザイナー』から学ぶ、デザインへの3つの姿勢。

2010-08-23T11:15:00.003+09:00

数々の書体がどんな人によって、どのように作られているのかとても興味があったので読んでみました。

タイトルの通り永く愛される書体を創り上げてきた人の書体デザイナーの方々のインタビューが豊富な図版と美しい写真でまとめられている本です。

文章量があまり多くないのですぐに読み終えることができますが、長年書体デザインに携わってきた方々だけに、デザイナーの方々のそれぞれが文字に対する哲学を持っていて、含蓄のある言葉がたくさんあります。

そのなかで、特に印象に残った部分を3つと、そこから何が学べるかを考えてみたいと思います。

●物事の原理を知ること
鳥海修氏が写研時代の『一番文字が上手な人』に文字がうまくなる秘訣を探ろうとしたときのこと。

「橋本さんに文字のことを質問すると、『筆で書くとこう。だから明朝体のときもこうなるんだよ』と、『筆で書くと』が枕詞のように話に出てきた。だから書道をやろうと思ったんですね。」

今はMacがあれば寸分のズレもない円や曲線が簡単に描け、フォントも容易につくることが出来ます。しかし、文字というものは手で描かれたものが起源であり、すぐにコンピューター上でつくるのではなく、書道などで実際に自分の手を動かして文字を書き、筆の動きを体で感じる事で、なぜこの形になるのかという必然性を知ることで、経験に裏打ちされたデザインができるのではないかと思います。

●先入観や知識にとらわれない
西塚凉子氏が卒業制作で書体デザインを考えたときの事。

「『良寛』は通常の日本語と同じ様に、四角い枠の中に収められてつくられている。じゃあ私は筆書系の書体でもっと動きのあるものをつくってみようと思ったんです。そのころはまだフォントの知識がなかったので『四角に入れなくてもいいじゃん』みたいに勝手に思ってたんですね（笑）」

通常グラフィックデザインを仕事にしているならば文字が四角の仮想ボディに収まっている事は当然知っているべき事なのですが、西塚氏はその知識がなかったからこそ、その四角い枠を飛び越えた発想が出来たのだと思います。知識は時として柔軟な発想を妨げるということであり、既存の枠を取り払い、先入観にとらわれないことが大切なのではないかと思います。

●感覚を言語化する
大平善道氏が写植オペレーターとして働いていた時、いつも同じ書体を指定するお客さんにその理由を質問したときのこと。

「お客さんに質問してみたら、その書体の魅力を説明してくれました。聞いてみて初めて、なるほど、とわかったわけです。そうすると、次からその書体にたいする意識の度合いが変わってくる。ああ、この書体は素晴らしいな、こんなきれいな書体が日本にあるんだなと。」

例えば、自分のデザインを説明するときに「なんとなく良いから」だけで済ませるのではなく、感覚を言語化することでどうしてこのデザインになったのかという事をきちんと説明し、意識を共有することがお互いの理解を深めて行く上で大切なのではないかと思います。原研哉氏も「自分の考えているポイントを適切に能力こそコミュニケーションの基本であり、デザイナーは本来、『説明のプロ』にならざるを得ない」と述べており、感覚的な部分だけでなく論理的な考え方も重要だということが分かります。

文字好きにとって、たくさんのためになる言葉がちりばめられていて、普段は雄弁に語りかけることなく、自然に存在している書体の声を一冊に凝縮して届けてくれた著者に感謝したいと思います。

文字だけでなく、デザインへの姿勢が多く学べ、コミュニケーションを生み出す仕事をしているすべての人にオススメの本です。

持続可能な未来のために、デザインができること。

2010-08-12T12:04:00.003+09:00

『消費社会のリ・デザイン』を読み終えました。
これまで消費主義的に欲求を満たしてきたライフスタイルでは環境への負荷が高く、持続可能性が低いということ。持続可能な未来のためには「物質的・経済的な豊かさ」から精神面での欲求を満たす「文化的な豊かさ」への価値転回が必要だということが様々な観点から述べられています。

その中で興味深かったのは「文化的な豊かさ」の必要性について述べられていた以下の点です。

絶対的にも相対的にも精神的な豊かさに物質的な豊かさは関係ない『幸福の心理学／マイケル・アージャイル』
「経済成長」と「幸福」は必ずしも相関関係に無いことから、精神的な豊かさを求めるべきである『GNH／国民総幸福量』
自我欲求（差別化の欲求意識）から、さらに上の段階である自己実現欲求（精神面での充足）へシフトし、多くの人が社会貢献の考えを持つことで豊かな社会となる『マズローの欲求5段階説』

このことから、「文化的な豊かさ」は「物質的・経済的な豊かさ」の延長線上には無いということが示されており、多かれ少なかれ大量消費社会を助長してきたデザインの役割も変わらなければならないということです。

では、その時デザインは社会のために何をすべきかについて、以下の部分が参考になります。

デザインは自己完結することなく、生産・購買・使用・廃棄・再生というトータルなシステム、及びモノをとりまく社会、さらにそれを越える地球的環境との関係性においてソーシャルにデザインされるべきである

つまり、これからのデザインが担うべきことは、問題を解決するにあたって、見た目の美しさなどの表層的なことだけでなく、問題の本質を捉えトータルにデザインしていく必要があり、IDEOのCEOであるティム・ブラウン氏の言う、直感と分析能力のバランスがとれた「デザイン思考」がより重要になってくるのではないかと思いました。

持続可能な未来のために、デザインがしなければいけないこと。
それは「人間を中心に地球が回っているのではない。地球を中心に人間が回っているのだ。」という意識の転回がおこせるような仕組みを根本からデザインしていく姿勢が大事だなと感じました。

社会におけるデザインの役割を考えていく上で多くの示唆を与えてくれる本です。

Appleのフォント「Myriad Pro」と「Myriad Pro Web」から読み取るWeb用フォントの秘密。

2010-08-06T22:10:00.016+09:00

先日AdobeのCS5をインストールしたら、Macに始めから入っているフォントの「Myriad Pro」の他に「Myriad Pro Web」がインストールされていて「Web? 何か違うの？」と気になりだしたら止まらなかったので調べてみました。

Appleのコーポレートフォントである「Myriad」を解剖していくことでデザインの美しさの秘密に迫ると同時に、Webの冠をつけたフォントはどの様に改良されているのかに迫ってみたいと思います。

まず、始めに「Myriad」とはどんな書体なのでしょうか。Wikipediaで調べてみると…

ミリアド (Myriad) は、サンセリフの欧文書体で、いくつかあるフルティガー体 (Frutiger) 模倣フォントの一つである。アップルやアドビシステムズがコーポレートフォントに採用している

Apple、Adobeと、世界のITを牽引する企業が採用しているという事から、先進的なイメージを与えてくれるフォントだということが分かります。

では「Myriad」と「Myriad Web」は、具体的にどこが違うのか、はじめにアウトラインにしたものを重ねてみました。

可読性を高めるために、カウンターを広げたためか、全体的に横長になっている印象を受けます。

その中でも、特に違いが見られたのが大文字の「N」です。

左の「Myriad」のNは直線的に構成されているのに対して、右の「Myriad Web」は中心部が少し膨張気味になっています。

では、どのくらい違うのか、試しに直線を入れて見ると…。

こうして比較してみると、右の「Myriad Web」の方は斜線部に肉付けがされてることが分かります。

何故でしょうか、その理由に迫るために、スクリーン上で実際に多く表示されるであろうサイズへと徐々に縮小してみたいと思います。

視力検査ではありませんよー。

相対的に見てみると、左の「Myriad」は、だんだんと小さくなるにつれて中心部が少し頼りなさそうな感じになり、1番上のものと比較してみると違った印象が感じられます。
反面、右の「Myriad Web」の方は中心部に肉付けしているために、安定した感じがしますが、大きくなるに従って肉付けしている部分に違和感が感じられます。
あちらを立てればこちらが立たず、どちらも一長一短な感じです。

では、「Web」用のフォントとはどんなものか、まとめてみると…

可読性を高めるためにカウンター（ふところ）を広くしている
斜線部分は安定感を出すために少し肉付けがされている
小さく表示された場合のデザインを優先している

ということになります。「Web用＝スクリーン用」で表示される文字は比較的小さめに表示される事が多いため、それらを前提に視覚的な調整をおこなっているということでしょう。

電子書籍などが普及していき、スクリーン上で文字を読む機会が増えていく中で、デザイナーとして可読性の高いバランスのとれたデザインをするために、見出しには「見出し用のフォント」と使い分けてきたように、スクリーン上でも状況に応じてWeb用のフォントを使い分けなければいけないということを、より強く意識していかなければならないということになります。

うーん。小さな変化でも見た目の印象はガラリと変わる、「神は細部に宿る」ですね。

インセプション。

2010-08-01T22:59:00.003+09:00

「インセプション」を新宿バルト9で観てきました。
評判通り非常に面白かったので簡単なあらすじと感想を記しておくことにします。

「インセプション」とは人の夢の中に入り込んでアイディアを植えつけること、そうすることで対称の意識や人格を変えてしまうことです。
他人の夢の入り込んで情報を盗んでいる主人公のコブ（レオナルド・ディカプリオ）に、大企業のトップであるサイトー（渡辺謙）がライバル会社を解体させるため、コブとその仲間とともに、ライバル会社の命運を握った息子の潜在意識へと潜入していくというストーリー。

この映画でキーとなるのが現実と夢との時間のシステムです。現実世界での5分は夢の世界では1時間となり、夢の階層をおりるごとに時間が12倍に引き延ばされていく、ドラゴンボールで言えば「精神と時の部屋」、一般的に言えば「浦島太郎」のような感じです。このシステムが巧みに利用されていることで映画の緊張感が一層引き立てられています。
はじめの方は「上の階層」「トーテム」などいくつものキーワードが散りばめられていてよくわからない感じなのですが、ストーリーを追うごとに「なるほど」と思わせる形で明かされていくので観客を全く飽きさせないしくみになっています。

なかでも、一番印象的だったのが、夢の中では夢を作り上げている自身が思った通りに世界を設計できるという設定で、コブがアリアドネ（エレン・ペイジ）に実際に夢の設計について説明しているシーンで不可能世界を可能にし、自由に動き回る様はアーティスティックな感じでマトリックス以来の新鮮な世界観でした。

ダークナイトで評判の高かったクリストファーノーラン監督の最新作なだけに話題性が高く、期待の高まる映画ですが、面白いの一言で片付けてしまうのはもったいないくらいに観れば観るほど様々な視点や発見がありそうな程イマジネーションに富んだ映画で、久しぶりに何度も観たいと感じさせてくれる映画でした。

アップルvs.グーグル

2010-08-01T15:34:00.005+09:00

デジタル社会において非常に大きな力をもった2つの企業について書かれた本。

「アップルとグーグル」この2つの企業についての言説はネット上でもよく散見されますが、まとまった形で書かれたものはあまり無いので本書を読みました。

2社の動きを起点に、iphoneやipadの登場で社会に何が起こっているか、そこから日本の企業は何を学ぶべきかを解説されてあります。

全体像の把握という感じで、あまり深く解説はされていないので、普段からIT系の情報をくまなくチェックしている方が読まれると少々物足りない感じがするかもしれません。

アップルについて非常に詳しい小川浩氏と林信行氏が、書かれているのでどころどころのジョブズの名言の引用が非常に印象的でした。

なかでも特に印象的だったのが日本の企業が長期戦略に失敗する理由について解説されている以下の部分です。

「何か問題を解決しようと取り組むと、最初は非常に複雑な解決方法が頭に浮かんでくる。多くの人々はそこで考えるのをやめてしまう。でも、そこでやめず、問題をさらに突き詰め、タマネギの皮を何層かむくように頑張っていると、しばしば非常にエレガントなデザインにたどりつくことができる。多くの人々は、そこにたどり着くまでの時間もエネルギーもかけていない」

アップルなのにオニオンかい、と、ツッコミを入れたくなる感じがありますが、要は問題解決のためにはとことん考え、その上で無駄を削ぎおとす必要があるということでしょう。

アップルとグーグルから何を学び、活かして次へとつなげていくか、多くのヒントがつまった本でした。

トレードオフ。

2010-07-31T03:28:00.008+09:00

無意識にクリックしたリンクでさえも属性化され、
自分自身がデータベース上でパーソナライゼーションされていく。
その情報が活かされる事は便利である反面、
監視社会とのトレードオフであることを忘れてはならない。

「ドイツの最も美しい本」の本。

2010-07-30T09:47:00.020+09:00

会社帰りに古本屋に寄ったところ、書体好きにとって良い本と巡り会えました。

買ったのは、ドイツのブックデザインコンクール入賞作品がまとめられている本。図版の解説として使用書体名や紙の名前などの詳細がのっているので、優れたデザインはどのような素材や技術を使っているのかを知る事が出来ます。

傾向として「Futura」「DIN」「Garamond」などが使われたデザインが多ことから、永く愛されているようなスタンダードな書体を使っているものが、やはり評価されやすいという事なのでしょうか。

デザインをしている時に、「この書体はアリなのか」と、ついつい考え込んでしまう事が多いので一つの指針となる本です。

電子書籍の勢いが急加速し、紙の本がいずれ無くなるといわれているけれども、日常の中に偶然の楽しさを見つけることができる「本屋」という空間はずっと在り続けてほしいものです。

Where is my IDentity.

2010-07-29T14:45:00.016+09:00

デジタル世界への入り口。
不意にそれらが閉ざされ、個とのつながりを断たれたとき。
自分自身は、見る事も発言する事も出来なくなる。
その時、アイデンティティは何処へいくだろうか。

アップルのキャッチコピー。

2010-07-28T11:48:00.016+09:00

昨日アップルからまた新しい製品が発表されました。
Magic Track Padなど、彼らの送り出す製品はいつも何かしらワクワクさせてくれるものが感じられます。

では、なぜそういったことが感じられるのかを考えたとき、それはキャッチコピーから読み取ることが出来ると思います。
今回発表された新製品のキャッチコピーのなかでとりわけ特徴的なものが「Apple LED Cinema Display」のこのコピーです。

何を今さら、と何の変哲もない印象を受けるかと思います。画面の広さや視野角をうたったものはアップルの製品でなくともゴロゴロころがっています。

しかし、あたりまえのことをあたりまえに言うことで、アップルの「無駄な機能を削ぎ落として徹底的に使いやすくする」という一貫したデザイン思想を明確に表現し、製品がもたらすその先に何があるかを受け手に示してくれています。

手垢のついたような着飾った言葉があふれる中で、言葉をも徹底的にそぎ落とす。
それが、逆に新鮮味を与えてくれているからではないでしょうか。

はじめまして。

2010-07-27T11:45:00.010+09:00

Twitter全盛期の中ブログを始めてみることにしました。

今さらといった感じもありますが、

情報が洪水のようにあふれかえっている今だからこそ

自分の考えをまとまったかたちで整理して

流されないようにしていこうと思ったためです。

テーマは特に決めずに自らの周辺雑記を気の向くままに書いて

まずは「続けること」から始めてみたいと思います。