モリサワの2023新書体「つぶてん」を使ってポップな雰囲気のイベントバナーをデザインしました

モリサワの2023年の新書体、「つぶてん」を早速使ってイベントのバナーを作ってみました。

「つぶてん」とは

明るく元気な印象の見出し用太ゴシック風デザイン書体です。コロコロとした印象のかなに安定感のある漢字を合わせており、可愛らしさの中に真面目さを感じさせます。動画テロップやパッケージ、ポスターの見出しなどで、キャッチーな印象を与えます。

つぶてん | 2023 モリサワ新書体 | 株式会社モリサワ https://www.morisawa.co.jp/topic/upg2023/detail/tsubuten/
引用:モリサワ公式サイト

「つぶてん」はとてもポップな雰囲気の書体です。

ウェイト(太さ)は「H」のみですが、漢字もしっかりセットになっています。

「つぶてん」を使ったデザイン

これを使って作ったのがこちらのイベントのバナーです。

百年(ペンニョン) at 高麗博物館
NOジェノサイドのワッペンをつくって、かたろう!
関東大震災朝鮮人虐殺と植民地主義
ミニレクチャー+ワークショップ

イベントのWebサイト

「つぶてん」を使ったバナー

どんなイベント?

私が参加している百年(ペンニョン)主催のイベントです。

大久保(東京都新宿区)の高麗博物館という場所で、NOジェノサイドの願いを込めたワッペンを作りながら、関東大震災で起きた朝鮮人虐殺事件と植民地主義についてかたりあおう、という内容です。

デザインのコンセプト

シリアスなテーマですが、できるだけ若いお客さんにたくさん参加してほしい、という思いがあったので、ポップなテイストでデザインをしました。

「つぶてん」は、可愛らしさがありながらも、しっかりとしたウエイトの太さで可読性も高いのでイベントのバナーにピッタリだと思いました。

背景のイラストは、様々な形のワッペンのシルエットをグラデーションをかけて入れることで、「多様性」を表現しています。

—–

今後も、色々なデザインで使ってみたいと思います。

MacのOSをCatalinaにアップグレードしたらモリサワフォント(游ゴシック)が表示されないエラー

MacのOSをCatalinaにアップグレードしたところ、モリサワパスポートのフォント(游ゴシック)がインストールされているのに表示されなくなってしまいました。

この症状は、InDesignで起きました。

悪戦苦闘した末、モリサワパスポートのインストーラーを使い、游ゴシックを一旦アンインストール、その後、再度モリサワパスポートを使ってインストールしたところ、正常に表示されるようになりました。

OSのバージョンアップは鬼門ですね。

モリサワパスポートはインストーラーからフォントを削除、追加する際にいちいち再起動をかけないといけないので手間ですが、モリサワフォントはやはりこちらの正規インストーラーで操作するのが良いようです。

合成フォント:エムニュースエム L + Discourse Wide Light

合成フォントの組み合わせ研究。

今回はモリサワパスポート搭載の『エムニュースエム』とAdobe Fontsに搭載の『Discourse Wide』を組み合わせて、未来的な印象のフォントを作成します。

完成見本

漢字・かな

エムニュースエム L

モリサワパスポートに搭載のフォント。

毎日新聞社が新聞の本文組用に開発した字面の大きな文字です。

エムニュースエム L | 書体見本 | モリサワのフォント | 株式会社モリサワ
https://www.morisawa.co.jp/fonts/specimen/1169

数字・アルファベット

Discourse Wide Light

Adobe Creative Cloudを契約していると追加料金無しで様々なフォントを使用できるAdobe Fontsに搭載の欧文フォント。

このフォントのWideというウェイトが近未来感があって使用したかったので、まずこの欧文フォントを選び、欧文フォントから逆算して合う日本語フォントとしてエムニュースエムを使用しました。

Discourse | Adobe Fonts
https://fonts.adobe.com/fonts/discourse

設定画面

illustratorの合成フォント設定画面

半角欧文と半角数字に設定したDiscourse Wideはそのままだとエムニュースエムより小さく見えるので「110%」にサイズを拡大します。

上記の設定で作成した合成フォントの書体見本は以下の様になります。

エムニュースエム L + Discourse Wide Light

和文と欧文のフォントが良い具合に調和したと思います。

このままでも良いのですが、もう少し尖った印象にしたいので文字設定ウインドウで「平体80%」に加工します。

文字設定ウインドウ
エムニュースエム L + Discourse Wide Light(平体80%)

これで完成。

なかなか特徴的な合成フォントになりました。

合成フォントのイメージ・キーワード

  • 未来的
  • シャープ
  • スマート

合成フォントの使用シーン・媒体

  • 雑誌の見出し・本文
  • Webサイトやブログのタイトル・見出し
  • フライヤーの見出し

シャープな印象や未来的な印象にしたい時にオススメの組み合わせです。

気になった方は是非お試しください!


合成フォントやフォントの設定についてさらに詳しく知りたい方に、オススメの一冊!

文字組デザイン講座
雑誌・書籍・ポスターにおける巧みな文字の使い方をリアルな指定紙から解説

Fontset:『こぶりなゴシック + Clear Tone SG』で今風の書体を作る

合成フォント(fontset)の研究です。

ゴシック体で本文を組む時、こぶりなゴシックを使うことが多いです。
完成度の高い書体なのですが、従属の欧数字は細長くて、やや和文のエレメントに合っておらず、古さも感じるので、欧数字だけ別の書体を組み合わせる事が多いです。

今回はこぶりな同様にモリサワパスポートに入っている新ゴ用に用意された欧文書体『Clear Tone SG』と組み合わせて、より洗練された、新しい印象になる合成フォントを作ります。

clear_2

“Fontset:『こぶりなゴシック + Clear Tone SG』で今風の書体を作る” の続きを読む