文字間隔を調整してデザインの印象を変えてみよう

こんにちは、クリエイティブフレークです。


▲MSゴシックで「チューリップ」と入力



日本語フォントの特徴として、小さい「っ」や「ょ」などの前後は文字の間隔が広いことが多いです。


また、「しょっぱい」など小さな文字が続く場合や、「フ」や「ン」など文字の左側に広くスペースがある場合も文字の間隔が広く見えます。





そこで文字間隔を変える、「カーニング」、「トラッキング」機能を使って、文字やデザインの印象を変えてみましょう。


▲Photoshopで文字を入力




▲文字を全選択して




▲文字ツールの「VA↔」の数値をマイナスに（ここではマイナス200にしてあります）



これを「トラッキング」といい、選択した範囲全体の文字間隔を狭めたり、広くしたりできます。





では、1文字ずつ細かく文字間隔を変えたい場合は、


▲狭く・広くしたい場所にカーソルを合わせ、文字ツールの「VA←」の数値を変更します。



これを「カーニング」といい、1字ずつ文字間隔を変更したいときに使用します。

便利なキーボードショートカットは

Macの場合、alt / option + 矢印キー（右・左）
Windowsの場合、alt + 矢印キー（右・左）





文字間隔が違えば、見え方はこんなにも変わります。





▲同じフォント、同じ色でも、上はシャープな印象があるのに対し、下は優しさのある印象に感じます。



でも、どんな幅にすればいいのかキレイなのか分からない！という方に
カーニングがゲーム感覚で学べるサイト　「KERNTYPE　カーンタイプ」　がオススメです。

初心者の人でも、上級者の人も自分の文字間隔センスが試せるサイトです。

Written by Creative Flake