PCゲーマーのWebデザイン備忘録

PCゲーマーのWebデザイン備忘録。東京都内でWEBデザイナーとして働いています。Webデザインやゲームに関することをブログに書いていきます

【Illustrator】線のバリエーション

Illustratorで様々な線を描いていきます。前提として、基準点を真ん中にしておきます。

破線

f:id:game-web-design:20140919131103p:plain

  1. 線のプロパティから、「線端」を「丸型線端」にする。
  2. 線分を0pxに、間隔を線の太さの2倍ぐらいにする。
  3. 多角形を書く場合、「長さを調整しながら、コーナーやパス先端にあわせて整列する」をクリックすると、コーナー部分のずれを修正できます。

破線で私鉄とJRの路線を描く

私鉄

f:id:game-web-design:20140919131554p:plain

  1. 例として線の太さを20pxにします。
  2. 線のプロパティから、「線端」を「バット線端」にする。
  3. 線分を1px、間隔を10pxにする。
  4. 3まで作ったものをコピーして、前面ペーストする。
  5. 破線を解除する。
  6. 線の太さを2pxにする。

JR

f:id:game-web-design:20140919132821p:plain

  1. 例として線の太さを20pxにします。
  2. 1をコピーして前面ペースト
  3. 線の色を白にする。
  4. 線の太さを18pxにする。
  5. 線分を40px、間隔を40pxにする。