フォントに「色」がつく。そう言ってもピンとこないかもしれませんが、現在のフォントの色は、ユーザーが決める前提で特に指定はありません。その一方、ここ数年で少しずつ増えている「カラーフォント」は、作り手があらかじめ文字・絵文字に色をつけたものです。

  • カラーフォントはその名の通り、文字に最初から色がつけられている(貂明朝テキストの文字一覧より)

    カラーフォントはその名の通り、文字に最初から色がつけられている(貂明朝テキストの文字一覧より)

そんなカラーフォントの先駆けとなったのが、アドビの「貂明朝」および本文用のシリーズ書体「貂明朝テキスト」。マスコットの貂や干支の動物など、イラスト素材級の存在感のあるものがいくつも含まれています。

今回は、2021年4月10日に開催された「フォントの日」イベントの後日談として、貂明朝の開発に携わったアドビのプリンシパルタイプデザイナー・西塚涼子さんとタイプデザイナー・吉田大成さんに、カラーフォントのメリットや、作り手としての苦労などをお話しいただきました。

カラーフォントのメリットと「衝撃」

――フォントの日の配信を拝見して、文字にはじめから色が付けられている「カラーフォント」の発展には驚かされました。

西塚さん: 実はフォントの進化そのものは比較的ゆっくり進んでいるのですが、アプリ側の性能が追いついてきたことで(進化が)目立ってきたというのが正しいかもしれません。

――フォントはユーザーが色や不透明度などを調整するのが普通でしたが、カラーフォントはあらかじめ作り手が色を決めて提案するような感覚があります。

西塚さん: そうですね、提案というのが近いと思います。貂明朝の場合は干支や貂のキャラクターを仕込みましたし、フォントの日に紹介したような透かし効果のある水彩風のフォントのような表現もできますので、一口にカラーフォントと言ってもアプローチはさまざまです。

  • アドビ プリンシパルタイプデザイナーの西塚涼子さん

    アドビ プリンシパルタイプデザイナーの西塚涼子さん

――カラーフォントによってユーザーが受けるメリットについて教えてください。

西塚さん: あらかじめカラーが決められているので手間いらずで便利、というのが第一でしょうか。

簡単な漢字、例えば「日」のような画数が少ないものでも、「全体は赤く、横の辺だけ青くしたい」場合、そうするには手間がかかります。加工する段階で文字を分解してオブジェクトとして扱うので、後から文字を入れ替えようと思ったら、また最初からやり直しです。

カラーフォントのテイストとデザインの系統がマッチしている前提にはなりますが、テキストのまま扱えるので、変更に強いなどのメリットはあると思います。

吉田さん: カラーがつくというだけでも目新しいですが、SVGファイルという画像データのようなものをフォントの1文字1文字に組み込めるのが、これまでと全く異なるところです。色がつくというだけではなく、写真のようなものまで文字として扱えるので、表現の幅が広がりました。

フォントの日で紹介した書体の中に、アクリル絵の具で描いたようなものがあります。こういった繊細なテクスチャは従来のフォントのようにベクターデータで作るとデータが重くなるというか、複雑化してしまうのですが、SVGファイルでは画像ひとつで済みます。……正直なところSVGファイルでも重いのですが(笑)

  • アクリル絵の具で描いたようなフォント「Acrylic Hand」(フォントの日の配信動画より)

    アクリル絵の具で描いたようなフォント「Acrylic Hand」(フォントの日の配信動画より)

西塚さん: そう、データは重いよね(笑) 吉田くんが言うように、カラーフォントは制作方法の部分で、業界がひっくり返るくらいのインパクトがありました。今までは写真のように複雑な画像データをフォントに組み込もうと思ったら、それをまず分解してパスにして、複雑な状態で入れないといけなかったのが、SVG形式であればそういった加工なしで済むようになりました。

文字のデザイナーが絵を描いた「貂明朝」

――貂明朝は2017年11月にリリースされ、カラーフォントの搭載が実現したのは1年後の2018年11月でした。その実装で苦労した点があれば教えてください。

西塚さん: すごく基本的なところなんですけれど、私はタイプデザイナーで、文字を作るのが仕事です。貂明朝ではカラーフォントの制作過程で、“文字を作る人”が絵も描くことになったので大変でした…(笑)

  • 貂明朝テキストの中に収録されたカラーグリフは、すべて西塚さんが描いた

    貂明朝テキストの中に収録されたカラーグリフは、すべて西塚さんが描いた

吉田さん: 当時すごく悩んで作られていたのを覚えています。

西塚さん: 貂明朝のマスコットが貂なので、色々な貂の絵文字を入れています。結構かわいくできたかなと思ってはいるのですが、さてこれは何に使うんだろう…と(笑)それ以降も、干支があれば年賀状に使えるという想定で数を増やし、天気記号にも和風の要素を入れて、デザインのアクセントとして使ってもらえるようにしました。

一般的に、フォントの中には絵文字も多く収録されています。例えば天気の記号や〇△□、トランプの記号などベーシックなものは昔から作っていました。ですが、作っても使われないパターンがとても多いんです。「このフォントの天気記号はコレ!」と発表のときにピックアップされて、あとは愛でるくらい(笑)

それでも貂明朝にあれだけのカラーグリフ(カラーのついた文字単体を指す)を入れたのは、カラーフォントという比較的新しい仕様を活用したかったからです。

――干支のカラーグリフをつかった年賀状のサンプルは、全て文字でできているとは思えない見た目で驚きました。

  • 貂明朝テキストだけで作り上げた年賀状のデザイン(フォントの日の配信動画より)

    貂明朝テキストだけで作り上げた年賀状のデザイン(フォントの日の配信動画より)

西塚さん: 文字で出せるという驚きもありますし、虎から牛に変えるのも簡単です(笑)Illustratorで作っているので、書式/アウトラインの作成で分解してしまえば、通常のパスのオブジェクトになりますので自由にカスタマイズできます。

――通常の文字のデザインと比較して、貂明朝のカラーグリフ開発は大変でしたか?

西塚さん: はい、かなり苦労しました。文字のデザイナーからすれば本業と違うやり方になるので。文字であれば用途を想定して作れますが、カラーグリフ(絵文字)は使い道が限られる割に工数もかかってしまい…。

吉田さん: 干支でいうと、動物によって大きさが全然違って、ねずみは小さいけれど龍は大きいのですが、それらをすべて同じ1文字の枠のなかに納めなくてはいけないのが大変そうでした。

――イラストを描くのとはまた違った苦労がありますね。

西塚さん: スケッチアプリの「Adobe Photoshop Sketch」(現在はAdobe Frescoに移行)で下書きして、Illustratorで下書きをトレースして作っていきました。Adobe Stockの写真を参考に、リアルな動物をモデルにして、現代版・鳥獣戯画のような、本物の動物より少しだけイラスト寄りのテイストを目指しました。

作る側の楽しみをユーザーに押し付けているところもあると思うのですが、ユーモアの一環として提示しました。例えば、昔のMS Officeのアプリに隠しコマンドが仕込まれていたような。ユーザーさんにフォントへの興味を持ってもらって、単に打ち込んだ文字だけではなく、中身の仕様をよく見てもらいたかったんです。

――それで、あれだけ多くのカラーグリフを仕込まれたのですね。

西塚さん: 早い段階でカラーフォントに対応できたのは、IllustratorやInDesign、Photoshopといった主要アプリのベンダーであるアドビだからこその強みでもあります。

それに、アドビのアプリなどで正しく動作する保証がない中、他社のタイプデザイナーさんがカラーフォントを開発するのは難しいと思います。アドビが先行してリリースすることでアプリでの動作証明にもなりますから、チャレンジ精神を発揮して、少し変わったことを率先してやっていく姿勢でいます。

私がフォントを作るときにいつも意識しているのは、ユーザーさんがフォントを選ぶ過程で、何かしらの発見をして、それを楽しんでもらうことです。それには多くの会社からさまざまなフォントが出されることが不可欠ですし、使う人に「ワクワク」を感じてもらうことが、フォント全体の発展につながると考えています。