Fontlobers #1 に関するブログ記事
- 「Webデザイナーでも知っているべき、グラフィックデザインとタイポグラフィの常識」生明義秀さん – この記事
- 「Web Typography & Material Honesty」小久保浩大郎さん
- 「キャラクターから考えるフォント」森賢人さん
2014年12月12日に開催された FontLovers #1 から、生明 義秀（あざみ ぎしゅう）さん（ @g_azami ）の講演メモです。
テーマは、「Webデザイナーでも知っているべき、グラフィックデザインとタイポグラフィの常識 」です。
メモは箇条書きで書いております。
（※ もしかすると後日加筆、修正する場合もあるかもしれません。予めご了承ください。）
（※ 小久保さん、森さんのセッションは後日記事としてアップする予定です。）
まずは、寄稿したある記事について。
まずは、この記事をご覧になったことはありますか？ ……
記事: CSSでのフォント指定について考える（2014年） – DTP Transit
Webのデザインという以前に、Font-familyってどうしてたのよ？ そんなんでいいのか！？
ブラウザによって表示が違う。名前つけなくちゃいけない。表示どうなるの？WindowsとMacで入っているフォント違うじゃん。
……そういう事もあって、私（※生明さん）が徹底的に調べて、このブログに寄稿しました。
伝わる情報を「表現」するには、何が必要か？
最終的なフォントの目的 ＝ 伝えたい情報があるから
伝えたい情報をちゃんと読んでもらうために。本来それには何が必要？
- コンセプト（テーマ、ポリシー）
- 理論、技法（セオリー、テクニック）
- ツール（操作方法）
なお、デザインの勉強 = アプリケーションツールの勉強 ……ではない！（もちろん頭の中にあるものを具現化するには、必要な勉強の一部ではあるが）
今日の話は 2. の理論、技法について話します。
グラフィックデザインの4大原則 = 要素間における相対的な関係性の理論
グラフィックデザインの4大原則 = 要素間における相対的な関係性の理論
- 近接
- 整列
- 反復
- コントラスト
フィールドに対するアプローチ
デザイナーは「なんとな〜〜く」で要素を配置しない。
アートボードの中の位置の関係性を追求して、配置する場所を探す。
クライアントさん等とかに『どうしてその位置なんですか？』と言われた時に、答えられるようにできなければならない。理由がある。ビジネスである以上『なんとなく』という答えはできない。
近接
隙間がほとんど等間隔で配置されている…… (NG)
隙間に差を付ける。
近づけるということは離すということ。
何ミリ・何文字空ければいいの？ → 実は決まっていない。隙間が空けばいい。ホワイトスペースという。
整列
真ん中に揃えるのが安心する…… (NG)
左揃え、右揃え、中央揃え。
中央揃えなんて滅多に使わない。左揃えがほとんど。
「見えない線」はデザインの命。
中央揃えはシンメトリー = 安心・安定感・威厳を感じさせるから、ついつい素人さんは使いがち。
反復
近接関係の感覚のリズムは、必ず同じリズムの感覚で。
反復で整えるのは、最初に説明した3要素の「コンセプト」を体現させることにもつながる重要なことである。
イレギュラーを極力さける。（もしやるなら大胆にやる）
コントラスト
見出しを大きくする。フォントウェイトも高める。
文字のサイズや色に、「差」をつける = コントラスト
各要素のアプローチ
（※ 生明さんがデモで4要素（反復を除く）の実例を見せました。以下は何を書いているのか文脈がわかりにくいかもしれませんが、メモをそのまま出します。）
近接
文字間（カーニング）を開く。縮める。
整列
右揃えの例
コントラスト （※ 見せる順番を変更）
要素別に異なるフォントウェイトを組み合わせる。
フォントサイズ
反復
一度出ているキャラクター（要素）を、別の形で再利用する。
何かを増やす場合、既存のものを複製して盛り込むと、4要素のルール的にもつながりが持てて、いい感じになる。
書体について
だいたい4種類におさまる。
- serif（セリフ体／明朝体）
- sans-serif（サンセリフ体／ゴシック体）
- script（スクリプト体／行書体）
- （上記以外） decorative デコラティブ系。デザイン書体。その他。
こんな使い方はよくない。（※ 下記リンクのURLは生明さんの紹介ではなく筆者が後から探したものです。）
- 納豆を餌にして育てた鶏の卵のラベル
- 裁判の結果を裁判所の外で発表する横断幕の書体
コンセプトにかなうフォントを使用しよう。
フォントのキャラクター
同じ種類で異なる書体は、混在させない方がよい。
全く違い種類のフォントや、異なるウエイトを組み合わせて、コントラストの効果を狙う。
感想
主にフォントの書体とテキストレイアウトについての基礎的なところのお話だったと思いました。
基礎ではあるものの、こういうところこそ非常に大事であり忘れてはいけないポイントなので、良い復習になったと思いました。
そしてこういったものは、決してセンスや才能とかではなく、覚えようと思えば誰でも覚えられるロジカルなものでもあると思います。たとえ肩書き的に「デザイナー」と名乗るつもりがなかったとしても、覚えておいて損は無いものだろうと思いました。