MENU

Apple San Francisco Font:境地に辿り着きし「恋するフォント」

Appleの広告やサイト、iOSやmacOSなどのシステムフォントにも採用されている、「誰もが見たことある」であろうフォントこそAppleのSan Francisco (SF)フォントなのである。このフォントが最初に発表されたのが2014年11月19日(日本時間)であり、ついに10周年をも迎えた。この記事では、開発された経緯から現在に至るまでの進化、そしてその美しさやAppleのこだわりを余すことなく紹介する。

目次

Apple Watchのサイズに適するフォントを作れ

今でこそ多用途的に用いられているSFフォントシリーズだが、その始まりはApple Watchからである。Appleが2014年に発表したApple Watchには、それまでに見たことのないフォントが搭載されていた1。それこそがSan Francisco、現在のSF Compactに当たるものだ。

従来のiOSやmacOSに搭載されていたフォントはHelvetica Neueであり、非常に王道で美しいがApple Watchの小さなディスプレイでは読みづらい。そこで、Appleはその要件を満たすためのフォント制作に着手した。SF Compactは横側が直線的にデザインされており、文章を表示した際の字間を確保することができる。この上で、SF Compact DisplayとSF Compact Textという2種類を導入した。Displayは比較的字間が狭く大きい文字を表示するのに適している。一方のTextは本文用で、字間を広くとることなどで文章の読みやすさは格段に改善する2

少しぼかしたHelveticaとSFの比較。下から5行目「intelligent」の読みやすさは雲泥の差だ。

Appleが使っていた「2つのフォント」

完全新規開発となったApple Watchに対し、それ以外に関してはすでにあるフォントの置き換えとなる。そのため、まずはSF登場以前にAppleが使っていた2つのフォントをご紹介しよう。

一つは、Appleが2003年頃からプロモーションフォントに一貫して使ってきた「Myriad」だ3。2001年に登場したiPodや、2002年に登場したフラットパネルのiMacなど、製品が重厚から洗練へ変化してきたのに合わせ採用されたサンセリフ体で、可愛さや人間性を感じるフォントだ。このフォントにAppleが急成長していったところの印象を持つ方も少なくないだろう。
なお、後期にはWebサイト上のほとんどが細いウェイトの採用になり、スタイリッシュな印象を与えた。

Appleが長く使ったMyriadフォント。

もう一つは、システムフォントとしてフラットデザイン化の重要な点と印象付ける「Helvetica Neue」、特に細いウェイトのものだ。OS Xでは従来Lucida Grandeという低解像度ディスプレイ向けのフォントが使われていたが、Retinaディスプレイが普及した2014年のEl Capitanより採用が始まっている。そしてiOSでは従来スキューモフィズムデザインが長らく採用されてきたが、ユーザーがスマートフォンに慣れたことを受けてより洗練したフラットデザインに移行するに伴い採用を始めた。
フラットデザインの美しさを活かす細いウェイトで、新時代の到来を予感させるものであった。

万能で最強なSF Pro

話は戻り、Apple Watchの発売からわずか2ヶ月後となるWWDC15にて、iOS 9にも新しいSFフォントを採用すると発表した4。今までシステムフォントとして使われていたHelvetica Neueの後継と言えるフォントで、現在のSF Proに相当するフォントだ(当時の発表会では単に「SF」、のちに公開されたファイルやHIGの表記は「SF UI」であった)。

このフォントもSF Compactと同様にDisplayとTextの2つを持ち、Textの方がふところを大きく取るなどして小さい文字でも読みやすくし、サイズによって使い分けられるようになっている。また、UltralightからBlackまで9ウェイトあり、CompactにはなかったItalic (斜体)も用意されている。

その特徴はやはり美しさにあると思う。システムフォントとして使われていたHelvetica、プロモーションフォントとして使われてきたMyriadの要素をしっかりと入れつつも、Appleの次世代を担うに相応しいデザイン要素も含まれている。Myriadといえば「P」や「e」などに柔らかさがあり、どこか人間的な雰囲気を感じる。その一方で、Helveticaはすごくかっちりとしたイメージで堅実派だ。これらの後継となるSF Proでは、Helveticaをベースとしつつも、「i」「a」「G」など程よくMyriadのイメージも保ち、さらにDINなど他のフォントの要素も含みながら洗練された印象だ。

文字の作り方の比較(抜粋)。概ねHelveticaが元になっている印象だ。

2017年以降AppleのWebサイト上のフォントはSF Proに一新され5、Special Event (現在のApple Event)のスライドや各種広告までがこのSF Proに統一されたのだ。この美しいフォントに統一されたことによって、システムフォントを含めて「Appleといえばこのフォント」というイメージを作り上げることができている。なお、Webサイトはこの変更に合わせて極端に細いウェイトばかりを使うスタイルから、本文まである程度の太さを持ったウェイトを使うスタイルへ変更され、読みやすくなった。
さらにいえば、iPhoneが10周年を迎えたことを記念したフルリニューアルモデル・iPhone Xの発表も2017年だったことから、フォントの統一も全く新しいiPhoneのイメージに繋がっていると考える。特にMyriadと違い直線的なイメージを持つため、iPhone Xの画面全体に広がるスクリーンと合致しているような印象も受ける。

Internet Archiveより。左がMyriad時代、右がSF Pro化後。

進む多言語対応

SFシリーズは、基本汎欧州フォントであるため、ハンガリー語やポーランド語、ベトナム語を含むラテン系文字には対応するほか、当初よりロシア語やウクライナ語などのキリル文字、ギリシャ語のギリシア文字にも対応する。

さらに、現在はApple Developerにてアラビア語6、グルジア語、アルメニア語、ヘブライ語7などの文字に対応する拡張スクリプトの配布も始めた。

なお、日本語にはSF移行前からプロモーションフォントに用いられていたAXISというフォントがあり、SF Proに移行後はそのウェイトに合わせたカスタマイズがなされたSF Pro JP8というフォントがプロモーションフォントとしてWebサイトや各種広告などで用いられており、Magic Keyboard (JIS)の印字も2021年版より採用されている。しかし、AXISの権利関係の問題から配布はされておらず、システムフォントには2000年から使用を続けるSCREEN (旧大日本スクリーン)のヒラギノフォント9が抜擢されており、こちらもSFシリーズとの相性は十二分に良い。

Magic Keyboardは2021年のリニューアルに際して日本語フォントが変更された。

痒いところまで手が届く作り込み

SFシリーズは、当初よりシステムフォントとして制作されたため、細かいシチュエーションに対応できるような作り込みが丁寧になされている。具体的には、純正メモアプリで使われている「a」を一階建てにする対応、時計アプリで使われている変化する数字の等幅対応、「:」を挟んだ際に高さを自動でセンターに持ってくる対応、「6」「9」を直線的にする対応、さらに化学関係で使われる上付き文字・下付き文字・分数への対応など多岐にわたる。これに関しては実際に見た方が早いため、下にいくつか例を挙げる。

赤「:」が単体、緑「:」が数字に挟まれた時の位置だ。
上から分数、上付き文字、下付き文字、直線的な「6」「9」の敵王子が右側だ。

進化は続くよどこまでも

このSFフォントは年々バリエーションを増やしており、より多用途的に使えるようにさまざまな進化を繰り返している。ここでは、その具体的なバリエーションと、実際にAppleがOSに対してどのような点で組み込んでるのかという例を示す。

SF Pro + 4つの厚さ

SF Proというフォントについては先ほども紹介した通りだが、WWDC22にて3つ厚さが追加され、合計で4つの厚さのバリエーションを持つフォントとなった10。その厚さが、Compressed・Condensed・Regular・Expandedだ。Regularをベースとしたときに、Condensedは少し細めになった厚さで、Compressedは極端に細くなった厚さだ。特にCompressedは側面が直線的に仕上げられており、DINなどのフォントにも近しい幾何学的なデザインに感じられる。逆にExpandedは太くなっており、用途によってこの異なる4つを組み合わせられる。

その種類を活用した例として、OSに組み込まれている写真アプリのMemories機能のタイトル表記を挙げている。タイトルとその下の副題でサイズを変えるのはもちろんだが、4つの厚さと9つのウェイトを組み合わせ、揃えるところとコントラストを出すところとのバリエーションが豊かになり、その数はSF Proだけでも(4×9)^2で1300通りにものぼる。
また、マップアプリでは山脈の名前など長い領域名を示すのにExpanded、逆に自治体名や大陸名など広い領域名を示すのにはCondensedといった使い分けがされており、ウェイトと合わせて文字情報だけでも見やすいようにされている。
さらにiOS 17から追加されたStandByという置き時計モードでも、このバリエーションは活かされている。横に潰れた時計モードである「アナログ」では12・3・6・9の4つの数字がExpandedで表示され、横長なイメージに合致している。数字で時刻を示す「太陽」でも、横長なiPhoneの画面サイズいっぱいに表示するため、こちらもExpandedが採用されている。一方で、自国の数字の右側に日付や気温を表示する「デジタル」ではCompressedが使われており、縦幅いっぱいに時刻を表示しつつ情報表示もできるよう設計されている。

4つの厚さが紹介されているWWDC22のスライド。
StandByモード「デジタル」表示。SF Pro Compressedが使われる。
Standbyモード「アナログ」表示。SF Pro Expandedが使われる。

SF Pro Rounded

先述したSF Proの角を落としたものがSF Pro Roundedだ。SFファミリーらしさはそのままに、可愛らしさや親しみやすさを感じるフォントとなっている。iOSでは、特にヘルスケアアプリやウォレットアプリで確認でき、数字を強調するのに使われている印象だ。しかし、英語設定では本来SF Pro Roundedで表示されるべき単位などの箇所も、日本語では先述したヒラギノ角ゴシックになってしまっているため、英語設定時ほどの統一感は感じられない。

なお、Standbyでは「フローティング」という少し斜めったような太いウェイトの数字で可愛らしく表示するのに活用されている。

StandByモード「フローティング」表示。SF Pro Roundedが使われる。

SF Compact

SF CompactはApple Watch用のフォントとして小さくても読みやすいように開発された、というのは前述のとおりだ。もちろん、形は違えどSF ProなどともSFファミリーを形成している。

Apple Watchのブランドフォントとして「WATCH」ロゴをはじめ各所で見るフォントだが、その使用先は意外にもWatchにはとどまらない。Apple Watchと同時期に発売されたMacBook 12インチモデルや充電式になったMagic Keyboard群のキーも、このSF Compactを採用する11。これらは刷新されたデザインを持ち、イメージ一新に伴って採用されたのであろう。また、小さくても読みやすいという特徴を活かしてAirPodsの内側やiPadの背面などシリアル番号などの刻印にも使われている。

SF Compact Rounded

その名の通り、SF Compactの角を落としたものがSF Compact Roundedだ。このフォントは、SF Pro Roundedと比較しても圧倒的に使用されている。まずApple Watchの文字盤に注目すると、そのほとんどのコンプリケーションの角が落とされているのがわかるだろう。デジタル秒表示やバッテリー残量など特に数字の使用機会が多いため、最適役だろう。さらに、時刻の表示やカレンダー、天気、アクティビティなどのSmart Stackやリマインダー、電卓、心拍数など幅広いアプリで使用されている。しかしながら日本語には案の定というべきか対応していないため、設定言語によって日本語かラテン文字系言語かで見え方が変わってくる点は少し残念だ。

また、2019年に米国でリリースしたApple Cardというクレジットカードの氏名刻印にもこのSF Compact Roundedは用いられており12、小さくても読みやすさを一定にする。

左の日本語に対し、右の英語はSF Compact Roundedで揃っている。

SF Mono

SF Monoは、XcodeやTerminalなどコーディングのためのフォントとして、WWDC16のメインロゴに使われ大々的に登場した13。「Mono」は単一という意味で、その名の通り等幅フォントとなっている。前述した直線的な「6」「9」をはじめ、大文字Iと小文字lの判別がつけられるようになっていたりとコーディングの際の可読性を高められるような構成になっている。他のSFフォントと比べるとデザインの違いは顕著だが、文字の形のベースにSFの雰囲気はきちんと感じられる。

New York

急に西海岸に移ってしまい、SFではなかったのかと思われるかもしれないが、New YorkもれっきとしたSFフォントファミリーの一員だ。元々内部的にSF Serifと呼ばれていたこのフォントは、iOS 13で一新されたApple Booksのフォントとして世に出された14。文字サイズに応じて使い分けられるSmall・Medium・Large・Extra Largeの展開があり、それぞれ6ウェイトから選べる。

現在ではApple Booksのほか、今年(2024年)に日本に上陸したApple Music Classicalや写真アプリのMemoriesでも使われるフォントとなった。さらにiOS 16から選べるようになったiOSのロック画面の時計表示フォントにもこのNew Yorkは選べる。iOS 17からはバリアブルウェイトにも同機能で対応し、さらに使える幅が広がっていくだろう。

SF Camera

ここからはAppleが公式には公言していないフォントの話だ。SF Cameraというフォント15はiOS 13でiPhone 11の登場と共に刷新されたカメラアプリ内のフォントだ。幾何学的な印象を持つSF Proなどと比べるとイメージは変わり、少し横に長くなったり字間が広めに取られていたりしている。SF Cameraという名の通り高級カメラのような印象も与えるこのフォントは現状カメラアプリ内でしか見られず、今後の展開も気になる。

実際にAppleのカメラアプリで使われているSF Camera。

SF Cash

SF Cashと名のついたこのフォントは、Apple Cashという個人間送金ができるサービス16で使うために開発されたフォントだ。Apple Cashは現在米国にてサービスが開始されており、iPhoneをかざすだけ(NameDropの要領)で気軽に送金ができ、Apple Payで支払えることが特徴となっている。

このフォントはプレーンとChiseled(彫られた)という2つのパターンを持つ。前者はApple Cash残高の表示時に、後者は送金時の金額表示にそれぞれ使われている。なお、金額表示のため全てのアルファベットの表示には対応していない点も特徴として挙げられる。一方で現在対応している国は米国に限られるのにもかかわらず「¥」記号や「€」記号の表示に対応している点は興味深く、今後グローバル的に展開していく可能性を考えているのかもしれない。

Apple Cashの動作画面。SF Cash Chiseledが用いられているおしゃれなUI。

SF Shields

最後に紹介するフォントは、SF Shieldsだ。このフォントは、Semi-Condensed、Condensed、Compressedの3つの厚さを持ち、地図やナビゲーションなどのシチュエーションに用いられていたもので、SF Pro Condensedのことを内部的に呼称するときに使われた名前だ。現在ではSF Pro CondensedやCompressedが一般公開されたため、SF Shieldsを目にする機会はないだろう。

フォントにマッチするシステムアイコン

SF Symbolsとは、AppleがSFフォントと合わせて使うことを想定して開発したシンボルフォントのことで、WWDC19にて発表された。SF Symbolsは年々進化を続けており、当初はただのマークだけだったが、現在ではマルチカラーや階層の設定、さらにはアニメーションもつけられるようになっている。

現在最新となっているSF Symbols 6には6000を超えるシンボルが収録されており17、加えてカスタムシンボルの作成にも対応した。もちろん、SFフォントと合わせて使うことを念頭に開発されているため、見栄えを揃えられる9つのウェイトが用意されている。

SF Symbolsの一例。フルカラー対応している。
SF Symbols 9つのウェイトはSFフォントと同じだ。

最後に:なぜSan Franciscoと命名したのか

Appleは、初代Macintoshを1984年に発表した際に、Chicago・Geneva・New York・Monaco・Venice・London・Athensという7つのシステムフォントを用意した。これは、スティーブ・ジョブズ氏がフォントについてこだわりを持っており、ここで用意された7つにも自信を持っていたため、世界的な都市名を命名したとされている18。当時としてはフォントの種類が多くの中から選べるというのがパーソナルコンピュータ市場としては画期的であったため、AppleもMacintoshの中で押し出したポイントでもある。
その後に追加されたものについても、Cairo・Los Angeles・Torontoなど都市名をフォント名に採用したほか、Chicagoと合わせて使える日本語フォントには姉妹都市としてOsakaと命名された (日本語フォントは、この他にもKyoto・Sapporoなどが存在する)。

そこから日は経ち、ビットマップフォントから脱却した後のシステムフォントはどれも既存のものばかりだった。その上、細すぎてシステムフォントには適さないという理由からHelvetica Neue Lightは2年で交代するなど、フォントの迷走期間を過ごしていた。

その中で、自社開発を改めて行い、システムフォントだけでなくプロモーションフォントまで統一できる最強のフォントを作ろうとし、それで完成したのがSan Franciscoなのである。30年来の伝統である地名という要素を引き継ぎ、Apple本社に程近い大都市・San Franciscoの名を冠するのは、このフォントがAppleにとって一つの完成形であるという自身の表れなのではないだろうか。

  1. Apple Releases Its Most Important Typeface In 20 Years – Fast Company
    ↩︎
  2. https://youtu.be/OpveNRh-jXU?si=Nzr-41rk0OGL2yCU ↩︎
  3. Apple Font History 〜書体で見るAppleの歴史2〜|WOW note
    ↩︎
  4. Why Apple Abandoned the World’s Most Beloved Typeface | WIRED
    ↩︎
  5. AppleのコーポレートフォントがMyriadからSan Franciscoへ | Mac Fan Portal マックファン
    ↩︎
  6. Design for Arabic – WWDC22 – Videos – Apple Developer
    ↩︎
  7. Apple、最新のSan FranciscoフォントとSF Armenian, Georgian, Hebrewフォントを公開。
    ↩︎
  8. https://www.weblio.jp/content/SF+Pro+JP ↩︎
  9. 「ヒラギノフォント」をご存知ですか? 世の中で一番有名で身近なフォントかもしれない、ヒラギノフォントのルーツを探る。SCREENグラフィックソリューションズのフォントの世界。 — FONTPLUSブログ
    ↩︎
  10. Meet the expanded San Francisco font family – WWDC22 – Videos – Apple Developer
    ↩︎
  11. It Looks Like San Francisco’s Not Just the Apple Watch Font
    ↩︎
  12. Apple Cardに使用されているAppleの新しいフォント「SF Compact Rounded」がダウンロードできるぞ! | コリス
    ↩︎
  13. 「WWDC 2016」の壁紙 | 気になる、記になる…
    ↩︎
  14. Apple’s new typeface is available for use right now
    ↩︎
  15. サンフランシスコ(サンセリフ書体)-ウィキペディア
    ↩︎
  16. Send and receive money with Apple Cash – Apple Support
    ↩︎
  17. SF Symbols – Apple Developer
    ↩︎
  18.     MacintoshとLisaのFont 秘話
    ↩︎
よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

この記事を書いた人

Xから来ました。
Apple好きのガジェオタ、中3。

コメント

コメントする

目次