Skip to main content

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

 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やコメント欄でどんどんご意見いただけると嬉しいです!

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


Popular posts from this blog

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

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の違いをデザインすることで、回転ロックという 機能アイコン と、ミュージックを起動するという 起動アイコン の違いを表しているのではないかと

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

Thank you for coming to my blog! this article English version is here. 先日のWWDCで発表されたicloud。アップルのクラウド本格参入ということで色々とサービスが話題になっていますが、相変わらずアイコンのデザインも綺麗に仕上がっていますね。 では、なぜ美しく見えるのか、少し視点を変えてアイコンのデザインそのものに注目して、その美しさの理由に迫ってみたいと思います。 まずは、なんとなく眺めてみましょう。 雲の輪郭が不規則な曲線を描きつつも、とてもバランスのとれた形になっていますね。ワラのなかから一本の針を見つけるぐらい、とまではいかないと思いますが、シンプルでバランスのとれた形にしながらも雲に見えるような形に定着させるのは、簡単そうに見えて意外と難しく、磨き抜かれたデザインだということが分かりますね。 なんとなく眺めているだけでは美しさの理由に迫れないので、もう少し目を凝らして見てみましょう。 勘の良い方は既にお気づきだったかと思いますが、形の中に4つの円が隠れていることに気がつきます。一見、何となく描いたように見えるカーブでも正円で構成することでバランスのとれた形になっていることが分かります。 つまり、 「アイコンの美しさは幾何学で構成することにあり」 ということが分かるわけですが、単純にランダムな円を配置していくだけでバランスのとれたデザインに仕上げることができるか、と考えるとあらゆる可能性が頭をもたげ、少し疑問に思えてきてしまいます。 そこで、さらなる理由を追い求めて、今度は円の直径を測ってみました。 すると… なんとまあ、それぞれ左右の円の比率が1:1.6と、見事に黄金比に近い比率になっているではありませんか。 さらにさらに、雲の形の比率も調べてみると…。 まさに、「One more thing」。 幾何学だけでなく、黄金比のような原理的な法則を駆使しながら、美しさを無意識に訴えかけるスキのないデザインに仕上がっていますね。 まとめてみると… ・曲線を幾何学で構成(補正)することでバランスのとれた形になる ・細部のランダムな大きさの中にも一定の法則を適用することで、全体的にバランスのとれたデザインになる シンプルなのに奥深い。

The law of beauty hidden behind the iCloud icon.

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. Howeve