
[Fontworks×Takram]フォントワークス創業30周年、記念ロゴの制作プロセスに迫る
2023年8月、フォントワークスは創業30周年を迎えました。これから一年間、アニバーサリーイヤーとして、30周年を記念したさまざまな取り組みを行っていきます。
まずお披露目させていただきたいのが、30周年記念ロゴです。「もじを通じて、 表現する人の創造をもっとじゆうにする。」というコンセプトのもと、誰でもインタラクティブにデザインできる独自のドローイングシステムから構築し、変化に富んだ遊び心のあるロゴが完成しました。


今回のnoteでは、この30周年記念ロゴの制作過程にフォーカスします。原案を担当した弊社書体デザインディレクターのヨアヒム・ミュラー゠ランセイ、フォントワークスの30周年プロジェクトに伴走しているTakramの山口幸太郎さん、菅野恵美さん、ドローイングシステムの開発からロゴの制作を支援した佐藤久太さんにそのデザインプロセスを語ってもらいました。

〈ゲストプロフィール〉
山口幸太郎
Takram アートディレクター, デザイナー, ディレクター
東京藝術大学にてデザインを専攻すると同時にデザイナーとしてグラフィックデザイン、サインデザイン、映像デザイン、UIデザインなど、幅広くビジュアルデザインの経験を積む。2014年からTakramに参加。2014年東京藝術大学大学院美術研究科博士後期課程修了。主なプロジェクトにNHK Eテレの科学教育番組「ミミクリーズ」のアートディレクションなどがある。D&AD Yellow Pencil、グッドデザイン賞ベスト100、2014年日本賞 幼児向けカテゴリー最優秀賞(総務大臣賞)、アメリカ国際フィルム・ビデオ・フェスティバル教育部門最優秀賞(部門1位)など受賞多数。
菅野恵美
Takram ビジネスデザイナー, ディレクター慶應義塾大学総合政策学部在学中、デザインシンキングやデザインリサーチ、スペキュラティブデザイン等を学ぶ。卒業後は株式会社ADKにてストラテジックプランナーとして、ナショナルクライアントからスタートアップ企業まで数十社の多様なカテゴリのマーケティングやブランディングを、国内及びグローバル市場に向けて担当。2019年よりTakramに参加。エンジニアリングやクリエイティブとビジネスを架橋するビジネスデザイナーとして長期成長性や耐久性のあるビジネス創造・支援に取り組む。
佐藤久太
グラフィック&エクスペリエンス デザイナー
慶應義塾大学卒業後、ロサンゼルスのArt Center College of Designへ進学。グラフィックデザインを学ぶ。ハリウッドのモーションデザインスタジオやスタートアップでの経験を経て、2021年より米ナイキのエクスペリエンスデザインスタジオに所属。グローバルキャンペーンのデザインを手掛ける。SXSW 2020 ファイナリスト、CES Best of innovation Award 2020、The One Club 2018 など受賞。
ヨアヒム・ミュラー゠ランセイ
フォントワークス 欧文書体デザイナー,ディレクター
ドイツ出身。スイスのバーゼル・スクール・オブ・デザインでグラフィックデザインを学び、日本を含める各国のタイポグラフィコンペティションで優勝するなど高い評価を受ける。海外複数社の情報デザインとVI(ヴィジュアル・アイデンティティ)を担当。2020年から、フォントワークス社に加わり、欧文書体の書体ディレクターに就任。
3つのキーワード
“energetic” “essential” “advanced”
― 完成した30周年記念ロゴについて、まずは山口さんから、どのようなコンセプトで制作されたのかを解説していただきたいです。
山口 背景からお話しすると、Takramでは今年の1月から、フォントワークス30周年に向けてのブランディングをお手伝いさせてもらっています。フォントワークスの持つどんな部分を伝えていったらよいか、我々は「creative seeker(表現の探究者)」と呼んでいるのですが、表現を探求する姿勢を伝えていくのが重要なんじゃないかという仮説を立てて取り組んでいるところです。ロゴのキックオフは7月頭くらいでしたよね。

菅野 お声がけいただいたのは5月ごろでしたが、本格的に制作がスタートしたのは7月はじめごろですね。
山口 クイックプロジェクトでした(笑)。30周年記念ロゴのプロジェクトも、いかにcreative seekerを表現できるかというところから始まっていきました。デザインを制作していくにあたっては3つのキーワードを設定していて、1つは「energetic」。大胆で勢いがある感じですね。2つ目の「essential」は、シンプルで本質を捉えているような表現。最後は「advanced」で、先進的で新規性がある、可能性を感じるみたいな。この3つをベースに、ヨアヒムさんにも参加していただきながらスタディを重ねていきました。

― 後ほど紹介しますが、ヨアヒムさんがスケッチを描いてくれたり、佐藤さんがシステムから考えてくださったり、さまざまな可能性を検討してくださったと思います。
山口 例えば、advancedを表現するために、AIで生成した文字をブラッシュアップしてヨアヒムさんに見てもらったり、既存の書体を違う表現にしていくシステムを作ったらどうかとか……「どうやったらessentialかな? advancedかな?」みたいなことを話し合っていました。
最終的なロゴは、ヨアヒムさんのラフから正方形や三角形を組み合わせたものを起点にして、正方形のグリッドで作るドローイングシステムみたいなものを作ってみようという案をもとに広がっていったものです。

Takramチームでは、僕のようにグラフィックデザイン的な考え方であったり、早い段階で(佐藤)久太さんにも入ってもらって「こういうシステムだったらできるんじゃないか」というのを考えていき、ヨアヒムさんからタイプフェイスデザインやグラフィックデザインの観点でフィードバックをもらいながら完成させていきました。
“遊び”から生まれる
多様な造形のアイデア
― 続けて制作プロセスについてうかがいます。まずはロゴの出発点として、ヨアヒムさんがたくさんのアイデアラフを出してくださいました。どのように着手されたのですか?
ヨアヒム (30周年記念ロゴのラフは)「play(遊び)」という、とてもシンプルなコンセプトで作り始めました。

私はスイスのバーゼルにある、バウハウスの伝統を受け継いだ学校でグラフィックデザインを学びました。そこではコンセプチュアルに考えることもしますが、私たちはメイカーです。座って考えるというよりも、手を動かします。
10代の頃から地元でデザインをしていましたし、いつも何かを作っていたので、それは理想的なスタートだったように思います。活字のカタログから文字をコピーして、何時間もかけてポスターを手で描いていましたよ(当時、活字はとても高価だったので)。学生のころは紙や粘土、インク、そういったシンプルなもので遊んで(play)いました。抽象的な表現をしたりね。

一方で、”想像(imagine)“はしません。想像力はあまり使いません。多くの人々は想像力(imagination)を創造力(creativity)だと言うけど、それは違う。想像力は個人的な経験に限られています。
ステレオタイプなアーティスト像は、窓の外にただよう雲を眺めているうちに、なんとなくポスターのビジョンが湧いてきて、ささっとスケッチを描いて、それがポスターになる……そんなイメージかもしれない。でも、そうではありません。
ある日スーパーマーケットのレシートを片手に、バスや電車に座って、ロゴを構成する要素について考えます。「そうだな、3や0があり、三角形や丸がある。たくさんのアルファベット、そしてフォントがある……。一つのフォントだけを選びたくないから、フォントを使わないロゴを制作しよう。基本的な図形を使うのがよさそうだ」。そんなふうにラフの制作を始めました。一番上は実際にスーパーマーケットのレシートに描いた最初のスケッチです。



― 手描きのアイデアスケッチから始めて、さらにラフへ展開されていったのですね。
ヨアヒム みんな手描きのスケッチを見るのが好きだよね(笑)。通常、スケッチはスキャンしたりトレースしたりせずに、横に置いておいてIllustratorでラフを描いていきます。それが最もクリーンでシンプルな方法だからです。
はじめは、三角形や数字、丸、あらゆる形を置いた大きなIllustratorファイルを作ります。その中から「なるほど、これとこれは関係しているな」と関連性があるものを見つけて、グループ分けしていく。さらに「この2つは関連しているけど、その間にさらに3つのアイデアが考えられる」といった部分を展開したり、シリーズにまとめたりします。そうやって散らばったアイデアと、シリーズやバリエーションとの間を行ったり来たりしながら作っていきました。
例えば、白抜きの30を使って目新しい形ができないか試してみたり――インターナショナル・タイポグラフィック・スタイルにおけるポジとネガ(図と地)みたいにね。さまざまなアイデアを組み合わせていくのは、レゴブロックで遊ぶ感覚によく似ています。

ロゴを“描く”ための
インタラクティブなドローイングシステム
― ヨアヒムさんのラフからアイデアを広げ、誰でもデザインできるようなドローイングシステムを開発されたとのことですが、どのようなものか佐藤さんから教えていただけますか?
佐藤 ドローイングシステムはProcessingを使って制作しています。Processingとはプログラミング的なアプローチでビジュアルデザインができる開発環境です。これを使うと、例えばカーソルの動きに反応して色がつくとか、Illustratorなどのソフトでは難しいシステムを組むことができます。
はじめは「グリッドでお絵描きができる」という基本的なシステムを作ってみて、それを触りながらチームで考えていきました。クリックしたエリアが赤くなり、そのまま描いたマスが赤くなっていく、というのが一番最初ですね。そこから、角が接しているところを滑らかに連結させたり、フォントワークスのコーポレートロゴから得たインスピレーションを加えて、右上にとんがりをつけてみたらどうだろうと特徴を加えていきました。



こうすることで形に予期しない変化が生まれてきて、描くことのクリエイティビティとサプライズが両方現れるような面白い結果になり、「これならいけそうだね」と次へ進めていくことができました。
山口 ドット絵のミニマルな1ドットから、ひょいっとツノが表れるとフォントワークスのロゴが出来上がる、というところが、このシステムを特徴づけています。
佐藤 ロゴを見て、このツノって動かすとしたらどんな振る舞いをするんだろう。カチカチ動くのか、くにっと動くのか、そんなことも考えたりしながら作っていましたね。
― シンプルなルールの組み合わせで面白い形が生まれる、そのバランスがとてもうまくできているなと思いました。
佐藤 そこはチームでもいろいろ話しました。はじめはドットがコーポレートロゴの形になるのと、角が滑らかにつながるアイデアがあって、そこに「角が丸くなる」「四角が分割される」、そして「グリッドの幅を動かせる」といった要素を加えて……。全て成り立たせるのは難しいんじゃないかという話もあったのですが、結果的に面白いものになったと思います。自動的に反映されるルールと、クリックすることで反映されるルールを設定して、でもそれが同時に起きたらどうなるのか、など30周年記念ロゴを完成させた後も調整を加えているところです。
― このシステムでいろいろな形やマークを作れたら面白そうです。30周年グッズに展開できたりするかも……? 私たちも活用の可能性を考えたいと思います。
30周年から、さらに先へ。
これからのフォントワークス
― 完成したロゴで「Fontworks 30th Anniversary」というテキストの部分には、ヨアヒムさんがデザインした新書体「Yo One」を合わせてくださっています。

ヨアヒム Yo Oneはフォントワークスが制作した最初の欧文書体です。セリフとサンセリフ、コントラストとリニアの軸があって、フレキシブルに選ぶことができます。「コントラスト」はスタイリッシュで、ファッションなどの分野に向いていますし、「リニア」は情報デザインやサインに向いていますね。30周年記念ロゴに使われているのは、その間の「セミ」。エディトリアルにも使いやすいスタイルです。
山口 今回のロゴに使用したのは「Yo One セリフ セミ」のBoldです。Yo Oneは最初にお話しした「energetic、essential、advanced」につながるいろいろな要素が入ったフォントだと思っています。essentialなのはもちろん、セリフの形が特徴的で「F」の中央のセリフが下側にしかついていなかったり、「y」のテイルが短くすぱっと切れていたりとか、energeticなところ、advancedなところも感じる書体です。
― まさに30周年を迎えて最初にリリースされるのが、このYo Oneなので、近いうちに書体の紹介記事もお届けしたいなと考えています。
最後にTakramの皆さんから、30周年を迎えたフォントワークスへの期待などをお聞かせいただけると嬉しいです!
山口 ブランディングを通して一緒にリサーチをさせていただくなかで、面白い取り組みをしている海外のタイプファウンドリーがたくさんあり、我々にとっても学びがありました。フォントワークス社内の方々にも話をうかがうと、「もじと もっと じゆうに」をタグラインに掲げて、皆さんどうすれば文字とより自由な関わり方ができるか考えている。日本語は文字数が多すぎるので、フォントの開発には長い時間がかかってしまいますけど、文字との自由な関わり方、その可能性を率先して広げていってほしいと期待しています。
佐藤 文字ってあらゆるデザインに関係してくることだと思います。デザイナーとしていろいろなフォントを見て、インスピレーションが得られたり、テンションが上がる瞬間がとても楽しくて、そういう書体がたくさん生まれてほしいです。
あとは、たとえデザイナーでなくても日常的に文字を扱っていますけど、そこに意識を向けることはあまりないと思います。今回のロゴ制作も、誰でもインタラクティブに参加できるようにしたいという思いでシステムを作りましたし、そうしたアプローチを続けることで、意識がちょっと変わっていく、美しいものが増えていったりするんじゃないかなと思っています。
菅野 「もじと もっと じゆうに」の自由さって、突拍子もないような自由さではなくて、エッセンシャルなところを保った自由を目指されているのが魅力だと思っています。ドローイングシステムによるロゴ制作も、まとまりなくただ自由に作れるシステムではなくて、自分の意思で格好いい文字ができる、というラインを探りながら2人が作ってくれました。
いつもフォントワークスさんが目指している、本質をついた、でも新しく革新的である……プロフェッショナルな視点から見た自由というところが、今回のロゴからも伝わっていくといいなと思いますし、ぜひそこに着目してほしいです。

― 制作にあたった皆さんの思いも受け取って、これからの5年、10年へとつなげていきます。改めて、フォントワークスの新しさ、挑戦していく気持ちが詰まった30周年記念ロゴを制作いただき、ありがとうございました。
このロゴは、これからフォントワークスのさまざまな活動で皆さんの目に触れる機会があると思いますので、ぜひ注目していただければ幸いです。