1

By iphonedigital

AppleはiPhoneやMacBookといったハードウェアから、iOSやmacOSといったソフトウェアまですべてを開発している企業です。ソフトウェアからハードウェアまで高い評価を受けるApple製品ですが、これらのデザインが具体的にどのように優れているのかをプロダクトデザイナーのマーク・スタントンさんがiPhoneのホーム画面に並ぶアイコンから解き明かしています。

Apple’s Icons Have That Shape for a Very Good Reason

https://hackernoon.com/apples-icons-have-that-shape-for-a-very-good-reason-720d4e7c8a14

「もし、iOSのインターフェースデザインに興味がないのなら、Apple製品のアイコンを見てみるべき」とスタントンさん。iPhoneやiPadのホーム画面上に並んでいるアイコンは、一見角の丸い正方形に見えますが、これは実際には「正方形と円の中間のようなもの」であるそうです。

ただ角を丸くした正方形よりも「複雑かつ洗練された形である」というAppleのデザインしたアイコンは、iOS 7以降から使用されるようになりました。Appleは微細なディテールにこだわることでアイコンの形を変更したわけですが、その変更はあまりにも小さなものであったため、パッと見ただけではその変化に気づくことすらできないレベルです。「なぜAppleがそのような微細な変更をアイコンの形に加えたのか？」という疑問に対する答えは、シンプルに「一貫性」にあるとスタントンさんは語ります。Appleは自身の作るハードウェアとソフトウェアの両方に一貫したデザインを施しており、その結果、iPhone画面に並ぶアイコンの形に小さな変更が加えられたというわけ。

iOS 7でアイコンの形が変更された事実を知るには、変更前後のアイコンの形を比べればわかります。変更前のアイコン(黄色)と変更後のアイコン(青色)が重なる部分を削除すると、「the difference」と書かれた部分のように、四隅の部分にうっすらと曲線が残ることがわかります。



また、Appleのハードウェアデザインにおける重要な要素は、「接線を避ける」という部分にあり、Appleはプロダクトデザインにおいて徹底的に接線を避け、曲率連続性のもと巧妙にデザインを行っています。

これをよく示しているのが以下の写真です。右の写真はMacBook Proの角を撮影したもの。2つの面が垂直に交わり、角を丸く加工しているわけですが、その曲線はとても滑らか。スタントンさんは「(MacBook Proのデザインは)ただ表面がマットに仕上がっているだけではありません」と述べており、複数の曲線を連続して使用することで「美しく、セクシーな曲面」を生み出しているとのこと。一方、左の写真は平面と曲面が変わる場所がはっきりと見えて野暮ったいのがわかります。



この連続して異なる曲線を用いて作る美しい丸みについて、スタントンさんは「これがApple製品をみんなが愛する理由のひとつ」と説明しています。そして、この連続した曲線はiPhoneのホーム画面に並ぶアイコンにも使用されています。

以下の図はApple製品以外の野暮ったい曲線(左)とAppleの曲線(右)の違いを示すもの。左の場合、直線から曲線に変わる場所で曲率がいきなり0から最大値に変化し、一定のまま曲線を描いています。一方で、Appleの曲線は曲率が徐々に変化しており、これによりよりなめらかな曲線ができあがっているというわけ。



この違いをスマートフォンの画面上にあるアイコンで見つけるのは非常に難しいところですが、上記の黄色と青色のアイコンの例からもわかるように、実は確実に変化していることがわかります。ここで重要なのは、「Appleのアイコンは曲率が徐々に変化している」ということではなく、「ハードウェアでもソフトウェアでも同じ指針でデザインが行われている」という点です。

Appleはこのような曲率を変化させる曲線の引き方に対して特許を取得していないので、他の企業も同じようなデザインを行うことは可能です。しかし、こういったデザインはそれほど多く見かけないように思えます。その理由は、プロダクトデザインを行うためのCADツールを使うエンジニアがそのような考えを持たないこと、あるいは、デザイナーがCADツールの専門家ではないため曲線を再現できないのかもしれません。

なお、Appleがプロダクトデザインやアイコンデザインに用いている「曲率連続性」については、Autodeskの提供するAliasツールのチュートリアルを見るのがオススメとのこと。