ロゴデザインの文字間について

WEBデザインを勉強しています。

今タイトルロゴ（アルファベット7文字程度）をデザインしているのですが、
文字間に微妙なバラつきがあるため
一文字一文字の文字間を調整しようと思うのですが、
法則やポイントなどはあるのでしょうか？
特に「I」の前後が難しいです。。。


使用ソフトはIllustratorCS5です。
よろしくお願いします。

No.4 ベストアンサー 回答者： pen-z 回答日時： 2011/04/25 05:32

Ｉの前後が難しいというご相談ですが、おそらく、そのＩの隣の文字の、その前後にも文字があるのではないですか？その文字の間隔に法則性が無いために、Ｉの前後の間隔が決められないのだと推測されます。

文字を等間隔に配置した場合、見た目の間隔にバラツキを感じるのは目の錯覚と、欧文のタイプフェイスのデザインによるものです。横書きを前提とした欧文の文字は高さは一定なのですが、文字ごとの横幅が違います。そのため、ロゴタイプをデザインする場合には、この錯覚と横幅を考慮に入れて文字を配置します。

具体的に説明していきましょう。まず、その文字をコピー＆ペーストしてアウトラインを作成しましょう。アウトラインにした文字は１文字づつ自由に動かす事ができます。移動はキーボードで操作します。あらかじめ、環境設定の「キー入力」で、移動の大きさを適度な大きさにしておきましょう。

縦のラインで構成されているＩやＨ同士が隣り合う場合と、ＩやＨと曲線で構成されているOやCが隣り合う場合では、見た目の間隔と実際の間隔は違ってきます。これは既に経験されている事でしょう。

これらの異なったラインの文字の配置を見た目の上での間隔を同じにするためには、まず基準となる間隔を設定することが先決となります。基準となるのは、ＩやＨなど縦のラインが隣り合う文字の間隔です。

これを基準として、ＩとOのように縦のラインと曲線が隣り合う組み合わせの間隔、ＩとＹのように縦ラインと斜線が隣り合う間隔、OとCなどのように曲線同士が隣り合う間隔、ＹやWのように斜線同士が隣り合う間隔、CやＺなどの懐のある文字の間隔を決定していきます。

例えば、縦ライン同士の間隔を１とした場合、縦と曲線の組み合わせを0.8、曲線同士の組み合わせを0.7、というように独自の法則を決定してください。この時の法則が、あなたのそのデザインの個性になります。そのデザインを活かすも殺すも、その法則次第となります。

間隔の関係は、概ね、直線同士＞直線と曲線＞直線と斜線＞曲線同士≧斜線同士＞斜線と曲線、のようになります。この関係は、それぞれのタイプフェスによっても変わりますから、それぞれのタイプフェイスのデザインに合わせる事が不可欠です。これらの間隔を決定せずに、終始感覚だけで配置していると、いつまで経っても文字同士のバランスがとれず、ガタガタした感じから逃れられなくなります。

さらに、ＹとＹ、ＹとWなどのように、隣り合う文字の懐が大きく影響する場合もあります。このような場合には、敢えて字間を大きくとったデザインにして懐の影響を小さくしたり、文字同士の一部を重ねたりして処理します。このような処理は、デザインの方向性に大きく作用しますから、何度も試行することが必要になります。

とりあえず、以上の手順で配置してみてください。隣り合う縦のライン同士の部分が無い場合には、そのＩと隣の文字との間隔を基準にしてください。そして、そこから他の部分の間隔を決めていってください。決定した間隔の文字同士は順次グループ化していって、後々までズレが発生しないようにしましょう。

最後に、全ての文字を配置し終えたら、全体のバランスを見ましょう。意図したイメージになっていますか？意図と違って詰まっていると感じたり、スカスカしていると感じたら、再度基準の間隔を調整して、それにつれて他の文字の間隔も調整しましょう。

ある程度煮詰まってきた時に、どうしても違和感を感じる部分が出てくる事もありますが、そのような場合には、思い切って大胆に基準の間隔を変えてみたり、ある程度時間を置いてから再度試みることも効果的です。同じ動作を繰り返していると、どうしても感覚は麻痺してくるものですから。

そして、最後の最後に文字同士のグループ化を解除し、見た目だけでそれぞれの間隔を微調整します。少しづつ、少しづつ、根気のいる作業です。ここで手を抜くと良いロゴデザインはできません。

ロゴデザインは長期間に渡って人目に晒されるものです。見た人が少しでも違和感を感じると、その少しの違和感が時間の経過とともに大きな蓄積となっていきます。その蓄積された違和感は、そのロゴタイプを持つ企業やブランドのイメージに直結しますから、とても大きな問題なのです。ですから、精緻化はあせらず時間をかけて、納得のいくまで確実に行ってください。

追伸：以上はあくまでも既存のタイプフェイスを利用した場合のデザイン手法です。あなたが文字からデザインなさっている場合には、その文字の仕上がり具合が大きく影響します。良いデザインが出来上がる事を祈っています。

No.3 回答者： sunsowl 回答日時： 2011/04/24 19:37

ルールやノウハウはないです。

デザイナーのセンスと勘次第です。
Macの自動字詰めはあてにせず、納得いくまで、自力で丁寧に詰めてください。
アキの間隔違いで、何タイプか作って比べてみてください。
その中で、自分でいい感じと思ったものを採用すればよいでしょう。

No.2 回答者： stereoman 回答日時： 2011/04/24 15:58

文字詰めは、なかなか難しく、

プロでも時間をかけて調整しないと
完璧なロゴを作れません。
（Illustratorの自動詰めは当てになりません。）

基本的には、文字間の空きがきれいに見え、
遠めに目を細めて見て、均一なグレーになるように調節するイメージです。
なんども出力して、遠くに離してみたり、逆さに見てみたりしながら、バランスをとる感じです。

Ｉも難しいと思いますが、
ＣＡとかＬＡとかは文字間が開きすぎるので、文字自体削って変形する場合もあります。
昔のＣＡＢＩＮとかＬＡＲＫとかのロゴがあれば参照してみてください。結構大胆に詰めています。

タイポグラフィの基本的な本を見ると勉強になるかもしれません。
（大町尚友：レタリングエッセンスとか、、）

あまり明確な答えになっていませんが、
参考になれたらうれしいです。

この回答へのお礼

奥が深いですね…今後CA、LAを扱うときは注意してみます。
回答ありがとうございました！！

お礼日時：2011/04/26 22:20

No.1 回答者： goonobaka 回答日時： 2011/04/24 15:56

イラストレターにはカーニング（文字間）を自動で整える機能があります。

法則というか、数学的なルールが知りたいなら、その自動調整後の間隔が、
「一般的に綺麗に見える」と言われている間隔です。

ですが、ご存知のように法則通りに作れば、一番綺麗に見えるわけではないのが
デザインの奥深さです。

とりあえず、自動調にしてみて“違和感”を感じるところを、手動で調整してみてはいかがでしょうか？

ロゴということなら、既存のフォントをそのまま使うわけでもないでしょうから。
手動での調整がセンスの見せどころだとおもいますよ。がんばってください。

参考URL：http://www.be-webdesigner.com/tips/kerning.htm

この回答へのお礼

回答ありがとうございました！！
いろいろと試行錯誤してやってみようと思います。

お礼日時：2011/04/26 22:18