【デザイン事例】 ロゴタイプをつくる

こんにちは。ユーザベースのデザイナーの廣田（@nacchin777）です。現在は、グループ会社のFORCASとJVR（ジャパンベンチャーリサーチ）のデザイン全般を担当しています。

デザイン全般、、、と、なんともキレのない書き方をしていますが（笑）、「デザインの力でプロダクトの世界観をつくり＆伝え続ける」ことが、FORCAS/JVRのデザイナーのお仕事です。そんなこんなで、UXデザイン、UIデザイン、Webデザイン、ロゴデザイン、グラフィックデザイン、エディトリアルデザインなどなど、幅広くデザインしてます。

今回は、その中のひとつ、ロゴデザインのことを書いてみようと思います。・・・といっても、FORCASのサービスロゴの話ではなく、派生コンテンツのロゴのお話です。

具体的には、こちらの2つのロゴのお話。

SEMINAR & WORKSHOP
SaaS REAL

ちなみに、FORCASのサービス自体のロゴのことは、こちらに書いていますので、よかったらどうぞ。

ロゴタイプのつくり方をざっくりと

具体的なロゴの話に入る前に、ロゴタイプの作り方について、ざっくりと書いておきます。

ロゴって、分解すると、そのブランドを象徴する「シンボルマーク」と、デザインされた文字の「ロゴタイプ」に分かれます。Appleのりんごの図案がシンボルマークで、Appleというデザインされた文字がロゴタイプ、、、てな具合。

ここでは、シンボルマークを除く、ロゴタイプのお話をしますね。また、リサーチとかコンセプトとか、そういうのも今回はしません。色についても、一旦、脇に置いておいておきます。

A. 既存のフォントを使う

既存のフォントで文字組みして、ロゴタイプを作る方法。
コンセプトに沿って、その世界観を感じられるフォントを選んだら、カーニングとかサイズとかをひたすら調整する。既存のフォント１種類とは限らないよ。異なるフォントを混ぜちゃうこともあるよね。

この方法を取っているブランド名を挙げるとしたら、LOUIS VUITTON（Futuraを使用）やDEAN & DELUCA（Copperplate Gothicを使用）など。おそらく、既存のフォントをそのまま使っているんじゃないかなあ。あっ、DEAN & DELUCAの「&」は、Copperplate Gothicそのままじゃないね。

ここで一言。既存のフォントをそのまま使う、、、を侮っちゃいけない。

文字を美しくデザインすること、つまり「タイポグラフィ」。ここは、デザイナーとノンデザイナーを大きく分けるところだと確信してます。デザイナーの中でも、得手不得手でとっても差が出るところだと思うですよねぇ。なので、デザイナーとして一歩先に進みたかったら、タイポグラフィを徹底的に研究＆練習することをお勧めします。もちろん自戒を込めて。

B. 既存のフォントにアレンジを加える

これは、Aの発展した感じのロゴタイプの作り方。
既存のフォントに、ちょっと肉付けしたり、あるいは削ぎ落としたり。少し変形させることもある。既存のフォントをそのまま使うよりも、オリジナリティが出ますよね。

女性ファッション誌のVOGUEは、Didotをベースに少しアレンジを加えたロゴのように見えますね。Didotそのままと比べると、VOGUEは細身な感じ。

C. 既存のフォントは使わずに、ゼロから作る

つまりオリジナル書体。手書きした文字をトレースしてデジタル化してもよし、イラストレーターのアートボードに直接描いてもよし。

こうやって書きましたが、ロゴ作りって、作り方云々よりも、「覚悟を示す」ことだと思うんですよね。「私たちは◯◯です」「◯◯に向かっていきます」を宣言し、それを実直にやり続ける覚悟。覚悟を決めるって、勇気が必要だと思うし、エネルギーも使う。

なので、ロゴを作る時はいつも、このロゴで覚悟を決められるか？を考えていたりします。。。（おっと、まだ脱線しちゃった。笑）

SEMINAR & WORKSHOP

さて、そろそろ本題に。FORCASで作ったロゴの話を。

ひとつめは、セミナーのロゴです。

FORCASでは、週に1-2回、多いときには週に4回も、イベントやセミナーを開催しています。その中でもレギュラー化しているセミナーについては、ロゴを作っています。

このセミナーの一番の目玉は、参加者自身が自社のプロダクトを題材に取り組むワークショップです。ワークショップのテーマは、ABMを実践する上で大切な「ターゲティング」です。

そう、ただ受け身のセミナーではなく、リアルに、自社のターゲティングの課題に取り組むワークショップ。考えて＆アウトプットするセミナーなんです。

そこで、ロゴは、すぐに実践できそうなアイデアやヒントを得て帰ってもらえたら、、、という想いもあって、アイディアが生まれる瞬間をイメージして、ピカッと光る電球をモチーフに加えました。

ロゴといっても、新しい文字を自分で作ったのではなく、既存のフォントを使って文字を組み、そこにちょっとしたエッセンスを加えた簡易的なものです。ロゴタイプとしては、先に紹介したAの作り方ですね。

それでも、それなりに見えるでしょ？笑

このロゴで使ったフォントは、Avenir NextのBoldタイプ。
Avenier（アベニール）は、Frutigerよりもシャープで、Futuraよりも柔らかいデザインで、とても美しく読みやすいフォントです。個人的にも大のお気に入り♪　そして、Avenierのリメイク版であるAvenier Nextは、日本人フォントデザイナーの小林章さんデザインによるものです。

そうそう、Avenirはスターバックスのブランドフォントの一つとしても指定されているみたいですね。ちょっと古いですが、ここの記事で語られています。

私のAvenirお気に入りのポイントは、数字のデザイン。シュッとかっこよく、他のデザインと馴染みやすいので、数字が大きな意味を持つ資料などではよく使っています。こういう場合では、Futuraの数値はちょいと癖がありすぎて、浮いてしまう（気がする）ので。

SaaS REAL

お次は、「SaaS Real」というイベントのロゴ。

SaaS企業で活躍中の経営者やマーケーターなどをゲストに招いて、ここでしか聞けないSaaS経営のリアルストーリーを語り合うイベントです。これまで2回実施しましたが、どちらも大盛況でした。

そんなイベントのロゴは、こちら。

このロゴを作った時の私の頭の中はというと...

この条件をクリアするために、「SaaS」と「Real」の2つのワードを、何らかの方法で区別する必要がある。方法としては...

・色で区別。
・同じフォントのウエイトで区別。
・別々のフォントを使って区別。

今回は、別々のフォントを使ってロゴを考えました。

一つは個性的なフォントで、もう一つはわりとベーシックなフォントを。そして選んだのは、Google Fontsからも入手できるMonotonとRubik。

2つのワードをきちんと区別したいというのが大前提なので、似たようなフォントを2つ選んでも意味がないよね。なので、一つは個性的なフォントを。個性的といっても、カジュアル過ぎず、ビジネスイベントであることは意識してMonotonを選びました。

その後に、もう一つのフォントRubikを選びました。なるべくシンプルで、Monotonと並べた時に、太さの印象が同じもの。Rubikはウェイトの種類がLight、Regular、Medium、Bold、Blackと多いのですが、ロゴではBoldを使用しています。

ちなみに、色で区別するロゴにしなかったのは、このロゴを扱いやすいものにするため。２色のロゴって、背景コントロールが難しいんですよ。

特に、イベントのロゴは、バナー以外にも、プレゼン資料のように、デザイナーが直接関わらないシーンでも使われることもあります。その場合でも、一定のクオリティを出してもらうには、きめ細やかな配慮が必要なロゴはNGってこと。

そういう思惑もあり、フォントの種類でSaaSとRealを区別したロゴをデザインしたのでした。

FORCAS関連では、他にも動画コンテンツの「マーケミニッツ」や、ユーザー会の「THE FUN」などでもロゴを作ったんですが、それについはまた別の記事にまとめようと思います。

別シリーズですが、定番のフォントや気になるフォントをピックアップして、そのロゴを使ったアートワークを作ってます。よかったら覗いてみてくださいな。

ふぉんとずかん｜Naomi HIROTA / デザイナー｜note

コンテンツデザイナー募集中

JVRの開発・運営する「ami」では、「デザインでスタートアップのリアルを伝える、コンテンツデザイナー」を大・大募集中です。お気軽にご連絡ください！

参考書籍

最後に... ロゴ作りに挑戦してみたい方へ。
ちょっと古いものばかりですが、難しく考えず、ロゴ作りを楽しめそうな書籍を2冊ほど紹介しますね。

たのしいロゴづくり -文字の形からの着想と展開

フォントのふしぎ ブランドのロゴはなぜ高そうに見えるのか？