IT系女子ログ

Webデザイナーのエッセイ。デザイン、コーディングで気になることをあれこれ考える。

いまさらHelvetica入門

f:id:tosssaurus:20171126174810p:plain

欧文フォントの王様と呼ばれるHelvetica(ヘルベチカ)。

今年で60周年を祝う特設サイトを見て、しびれました。

60th Anniversary Helvetica Typeface

 

かっこいい。

Helveticaを使うからかっこよくなるのか、Helveticaを使う人がかっこいいものを作れる人なのか、Helveticaのことをいまさら調べてみました。

 

 

Helveticaってどんなフォント?

f:id:tosssaurus:20171127004040p:plain

Helveticaは、世界中で最も使われていると言われている書体です。Helveticaとはラテン語でスイスのこと。

飾り気は少ないけれど力強さがあり、美しい細部のディティールを持っているのでロゴや見出し用によく使われます。
一方で、文字が小さく長く続いても可読性のあることから、本文用にも使える万能フォントとして知られています。

 

Helvetica50周年を記念して制作されたドキュメンタリー映画の予告が、Youtubeで見れたのでご紹介。

Amazon.com: Helvetica: Erik Spiekermann, Matthew Carter, Massimo Vignelli, Michael Bierut

 

Helveticaの落ち着いた佇まいから、色んな言語と相性が良く、グローバル企業のロゴや公共機関のサインなど世界中で多数使われています。

私には、「THE・優等生」ってイメージがあります。

 

Helveticaを使ったデザイン 

Webサイト

BRAUN(ブラウン)公式サイト

BRAUNの時計のほうのサイト。

参考にしてビジュアル作ってみました。
結構文字つめつめ。

f:id:tosssaurus:20171127000519j:plain

 

 

Exposure Exhibition 

ニュージーランドのMassey Universityの卒業制作展のサイト?(IT系女子ログ訳)

かっこいい!!!

参考にしてビジュアル作ってみました。
白黒反転させてみる。おもしろい。

f:id:tosssaurus:20171126233847j:plain

 

 

Top 10 Helvetica Alternatives for 2017 · Typewolf

海外のフォントブログで有名なTypewolfの、Heleveticaを使ったサイトTOP10。

他にもたくさん探せます。
Helvetica Font Combinations & Free Alternatives · Typewolf

和文との組み合わせは想像するしかないけど、海外ならではの余白の取り方や配色など、すごく参考になる。

 

Instagramから気になった作品

“Not Sorry”ってことでしょうか? Sorryだけでも美しい。

 

書体が整っているからか、互い違いに配置するのもすごく綺麗です。
横線も合いますね。 

 

 

@theletteristがシェアした投稿 -

骨格が太いので型押しと相性良さそうです。

 

カネゴンがキマって見える。図鑑や辞書にも似合う。

 

 

 

 

Franzyskahさん(@franzyskah)がシェアした投稿 -

 

Helveticaのデザイン考察

Helveticaを主体としたデザインをたくさん探して気づいた点です。

  • Boldがよく使われてる
  • 文字は詰め気味なのが多い
  • 行間も狭め
  • 配色は中間色寄りのトーンが多い
  • コントラストの強い配色がほとんど
  • グラデーションはほぼ使われない
  • パターンとの組み合わせもあまり見かけなかった
  • 斜めの配置も少なからず見かける
  • 太めの横線とよく合う
  • 縦線はあまり使われない(読みづらい?)
  • 写真を使うときはなじみ重視?

 

スイススタイルが多い

力強さのある書体だからか、インパクトのある大きさで使われたり、サイズや配色でコントラストをつけているデザインがとても多かったです。

スイスを背景に持つことからか、スイススタイルのデザインがよく合うのでしょうか。

 

Helveticaの読み物

さらに詳しく知るためにいろいろ記事を読んでいて、面白かったものをご紹介します。

 

IBMが新しいHelveticaをリデザインする?

IBM’s Quest To Design The “New Helvetica”

 

一番わかりやすかったHelveticaの記事。

フォントから考える(3) 世界の“普通”をつくったHelvetica (1) | マイナビニュース

 

HelveticaとArial

Arialは、Helveticaとよく似ていることから代替えフォントとして使われてきたけど、ところどころ個性があります。

これも深く知るとおもしろいです。

 

HelveticaとArialを重ねて比較した図。

http://ragbag.tumblr.com/post/187708731/arial-helvetica-on-friday-i-hosted-a-screening
 
 

» 身近な書体: Arial Toshi Omagari

 

どっちがHelveticaかを選んでいくゲームがありました。

Ironic Sans: So you think you can tell Arial from Helvetica? Quiz

 

 

Helveticaをもっと楽しむ

Helvaticaのデザインを集めた本。

 

Helvetica: Homage to a Typeface

Helvetica: Homage to a Typeface

 

 

 

50周年を記念して制作されたDVD。

ヘルベチカ ~世界を魅了する書 [DVD]

ヘルベチカ ~世界を魅了する書 [DVD]

 

 

毎日違ったフォントの日めくりカレンダー。Helveticaがいつ出てくるのか、楽しみ。

Typodarium 2018: The Gold Standard in Type. Tages-Abreisskalender mit 366 frischen Fonts von 366 Designern aus 41 Laendern

Typodarium 2018: The Gold Standard in Type. Tages-Abreisskalender mit 366 frischen Fonts von 366 Designern aus 41 Laendern

 

Helveticaは美しいので、制作意欲をくすぐりますね。

美しさを台無しにしないようにと思うと緊張しますが、ウェイトやシリーズも豊富でいろいろ試しがいもあるので、もう少し勉強してみようと思います。