Mac業界の最新動向はもちろん、読者の皆様にいち早くお伝えしたい重要な情報、
日々の取材活動や編集作業を通して感じた雑感などを読みやすいスタイルで提供します。

Mac Fan メールマガジン

掲載日:

iPhoneやMacが美しい理由。ビル・アトキンソンの「円描画」を“美”に昇華させたせたスティーブ・ジョブズ。Appleデバイスの「角丸四角形」「3次ベジェ曲線」が誕生するまで

著者: 牧野武文

iPhoneやMacが美しい理由。ビル・アトキンソンの「円描画」を“美”に昇華させたせたスティーブ・ジョブズ。Appleデバイスの「角丸四角形」「3次ベジェ曲線」が誕生するまで

Appleデバイスの美しさの特徴は、曲線の美しさだ。この曲線は3次ベジェ曲線といい、多くのAppleデバイスは直線と3次ベジェ曲線で構成されている

そのため、シンプルでありながら、Appleにしかない美しさを感じることができる。この美しさを発見したのは、もちろんスティーブ・ジョブズだった。当時のAppleのソフトウェアエンジニア、ビル・アトキンソンの功績とともに振り返ろう。

Lisaの「スクエアドット問題」。ビル・アトキンソンの主張は届かず、課題を残したまま発売された

ビル・アトキンソンは、Macの源流にあたるLisaの開発を進めながら、高速で円を描画するアルゴリズムを開発した。これにより、ダイアログやウインドウが高速で描けるようになり、GUI(Graphical User Interface)を基本にした操作体系が完成し、今日のmacOSにつながっている(そのアルゴリズムの詳細はコチラの記事で解説している)。この開発の中、ビル・アトキンソンは“Macの美しさ”につながる重要な発見をした。

Lisaのディスプレイは4:3の画面でありながら、ピクセル数は720×360ピクセルになっている。ハードウェア製造の面から考えると仕方のないことだが、1つのピクセルが縦長になっていたのだ。

しかし、LisaGrafを開発しているビル・アトキンソンは縦長ピクセルに悩まされた。半径100ピクセルの真円を描いたら、縦長の楕円のように表示されてしまうのだ。ピクセルが縦長な分を調整して描くべきか、それともLisaのディスプレイは縦長に表示されるものだ、とユーザに諦めてもらうか。そのいずれかしかなかった。

ビル・アトキンソンの円描画のアルゴリズムをChatGPTに再現してもらった。シンプルなプログラムだが、これで円が描ける。掛け算は2倍以外使われていない。2倍の掛け算はコンピュータではビットシフト演算と呼ばれ、高速に処理できる。

ビル・アトキンソンは、ピクセルを正方形にして768×512ピクセルのディスプレイにするべきだと主張した。これは「スクエアドット問題」としてLisaチームで大きな議論になったようだ。ただ時間の問題もあり、Lisaは縦長ピクセルのまま発売を迎えてしまう。

Lisaはセールス的には失敗したといっていい。1984年にMacintoshが発売されると、急遽LisaにはMacintosh互換モードが搭載され、在庫分はMacintosh XLという名称で売り出された。しかし、スクエアドット問題が解決されないままだったので、Macintosh XLではMacintosh用のソフトウェアが縦に引き伸ばされて表示されていたという。そうして、Appleは1985年にMacintosh XLの販売を停止した。

一方、Macintosh以降は正方形ピクセルが採用され、グラフィックデザインやDTP(Desktop Publishing)などの分野でプロユースにも耐えるコンピュータに育っていった。

ビル・アトキンソンもジョブズに“降参”。美しさの根源たる「RoundRects」(角丸四角形)の背景

決定的な主張をしたのは、Lisa開発のリーダーだったスティーブ・ジョブズだ。ビル・アトキンソンが高速で円や楕円を描くというデモを見せると、スティーブ・ジョブズはそれを見て「角が丸い矩形も基本図形にするべきだ」と主張した。長方形と小さな円を4つ組みわせれば実現できるが、プログラムを書くのは非常に複雑な作業である。

それもあり、「そこまで凝った図形は必要ないのではないか」とビル・アトキンソンは主張した。同じチームにいたアンディ・ハーツフェルドのエッセイ「Round Rects Are Everywhere!(角丸四角形はあらゆるところにある!)」によると、せっかく苦労して円を高速描画して楕円まで描けるようにしたのに、スティーブ・ジョブズはそれを賞賛することなく、もっと高い要求をしてきた。ビル・アトキンソンは、それにイラついたのではないかと書かれている。

ビル・アトキンソンの主張に対し、スティーブ・ジョブズは突然興奮して「角丸はあらゆるところにある!」と言い出したという。テーブルの角やホワイトボードの角を指差しながら、「ここにもある、ここにもある」と。そしてビル・アトキンソンを外に連れ出し、二人で街の中を歩きながら、「ほらここにも、あそこにも」と次々指を差していった。

ジョブズが角が丸くなっている駐車禁止の交通標識を指差したとき、ビル・アトキンソンは「もうわかった。勘弁してくれ」と降参。家に帰り、角の丸い矩形の高速描画プログラムを仕上げ、それを「RoundRects」(角丸四角形)と名づけた。

スティーブ・ジョブズに強く求められ、ビル・アトキンソンは角丸四角形を描くプログラムも書いた。これがのちのAppleデバイスの美しさを決定づけたと言っていいだろう。画面は、開発中のLisaの画面をポラロイドカメラで撮影したもの。「Round Rects Are Everywhere!」(Andy Hertzfeld)より引用。

現在もAppleデバイスに採用される「角丸四角形」。Apple史上、もっとも美しいアルゴリズム

この角丸四角形は、今日のmacOSでもあらゆる場所に使われている。ウィンドウもダイアログも入力フィールドも矩形ボタンも、あらゆるものが角丸四角形だ。現在では、円弧ではなく、より美しく見える3次ベジェ曲線が使われるようになり、iPhoneやiPad、Macなどの筐体にも採用されている。

特に、iPhoneとiPadはそのサイズまで同じだ。両方のデバイスをお持ちの方は、重ねて並べてみていただきたい。寸分もずれることなく重なるはずだ。

iPhoneとiPadの角。三次ベジェ曲線が使われ、Appleデバイスの美しさを決定的なものにしている。

この角丸は、他社製品でも使われている。角がとがっていると思わぬケガにつながることがあるからだ。しかし、Appleの角丸はひときわ美しい。ぜひ他社製品の角丸とも比べてみていただきたい。その美しさが実感できるだろう。

Apple製品の美しさの要素のひとつである角丸四角形は、このようにして生まれた。「Apple史上もっとも美しいアルゴリズム」という筆者の意見に、賛同してくれる方は多いのではないかと思う。

おすすめの記事

著者プロフィール

牧野武文

牧野武文

フリーライター/ITジャーナリスト。ITビジネスやテクノロジーについて、消費者や生活者の視点からやさしく解説することに定評がある。IT関連書を中心に「玩具」「ゲーム」「文学」など、さまざまなジャンルの書籍を幅広く執筆。

この著者の記事一覧