イラストレーター使い方

光沢をもった感じのボタンっぽいモノを、できるだけ簡単にイラストレーターの機能でつくってみました。
ソフトはイラレ9、グラデーションで光沢を表現して透過っぽくします。
こまごました操作はなしで、できるだけ簡単につくります。

デザインに凝れば、さらにいろいろ操作は必要だと思いますが、ここでは超簡単な方法なので、多少シンプルになります。

1.角丸の四角をつくります。ここでは仮に緑色にしました。

2.コピーして、背面もしくは前面にペースト。２回繰り返します。
つまり、３枚の角丸四角が重なった状態です。

3.一番上の角丸を上にずらします。Shift押しながら、図形の真ん中あたりまで上にずらすとちょうどいいと思います。

4.ずらした角丸四角と、そのすぐ下にある角丸を選択。（つまり、２枚選択）

5.パスファインダの「交差」。交差してる部分が残ります。（画像では、解りやすいように白色にかえています）

6.交差した図形を少しだけShiftおしながら下へ。左右の幅を縮める。
（下にずらすのは、一番下の図形が少し見えるようにする為なので、ほんの少しでOK。左右の幅を縮めるのも、下の図形が少し見えるようにする為なので、ほんの少しだけでOK）

7.交差した図形の色をグラデーションで光沢っぽく設定。この設定は、お好みで。
画像では、下の方が緑色で上が白色になるようなグラデーションの設定をしています。

完成です。

グラデーションは、もともとの色から白色に変わる設定が良いかと。

イラレの基本的な機能のみ使っているので、イラレのバージョン低くても透過風なボタンが作れるかと思います。

最近、ホームページの制作でfireworksを使う機会がふえました。
DreamWeaverと一緒に使っています。
パスを交差させたり、合体させたりと共通する部分が多いので、
adobe製品で慣れると、他のadobe製品も使いやすいみたいです。

イラストレーターで作成したイラストの前面に画像を配置。しかし、画像自体に白い背景
が付いているので、背景をなくしたい。

この場合、大きくわけて２通りの方法がよく使われると思います。

●イラストレーター上で、イラストレーターの機能でマスクをかける

●画像編集ソフト（フォトショップ等）で、画像自体にマスクをかけて、イラストレータ
ーに配置する。

今回の場合は、おそらく画像自体にあらかじめマスクをかけた方が良いかと思います。
イラストレーター上でマスクする場合は、単純なパスなら良いのですが、複雑にパスを引

いて、マスクした後、万が一マスクをずらしてしまうミスをした場合面倒です。

この方法は、下記URLにて。

http://irare.seesaa.net/article/45422315.html

単純に画像を丸くマスクしたり、四角や、角丸の四角などでマスクする場合はこの方法で良いかと思います。

次は２つめの方法、画像にマスクをあらかじめかけておく方法。
これなら、画像自体にマスクがもうしてあるので、配置した時点でもう背景はありません。
一応、慣れてない場合、予期せぬ状態で上書き保存して元データをダメにするという事がよくあるので別名保存で画像をもう一つ作成して予備にしておくとよいかも。
フォトショップで説明しますと

１．画像をフォトショップで開く。
２．背景以外（表示したい部分）にパスを引く
３、パスを保存する。
４、クリッピングマスクをする。
５、保存してイラストレーターに配置。

手順はこんな感じです。
パスを引く時に使われるベジェ曲線というものは、慣れてないと扱いにくいと思います。
独特の動きをするので・・。

例としてクマの頭をクリッピングマスクしてみます。


フォトショップで画像を開きました。


パスを頭の輪郭で引いていきます。


パスを引いて最初のパスにゴール。頭がパスで囲まれました。


パスを保存します。パスのパレットの右上の三角マークをクリックすると「パスを保存」が出てくるからクリックします。


パス名は、パス1を選ぶ。「OK」


もう一回パレットの三角マークをクリック。「クリッピングマスク」をクリック。
「パス１」を選んで「OK」

これで、クリッピングマスクができました。
保存、もしくは別名保存。

イラレに配置すると、マスクされてます。

パス引くのが面倒な場合は、色選択という方法で白色部分を選択して、選択範囲を反転さ
せて、選択範囲をパスに変換する方法もありますが、あまりおすすめできません。微妙に
粗いパスになったりするので・・。
上記２つの方法がよく使われますが、方法としては、ほかにもあります。

その他の方法１
マスクではなく、画像の背景を透明にしてGIF画像にする方法。でもGIFなんで実写の写真や色数の多い画像だと汚くなる。単純なイラスト等だったらGIFで良いかと。

その他の方法2

もうひとつ、逆の発想で、画像上で背景を取り、イラレのイラストを画像上にペーストして１枚の画像にしてしまう方法。イラストが大きすぎると画像サイズがおおきくなるデメリットあり。あと、イラレだと拡大が楽だけど、画像だと拡大の際、解像度をきにしなければならなくなる事もデメリット。

画像に関して過去記事のもマスクなど掲載してるので、ご参考までに。
http://irare.seesaa.net/category/3348427-1.html

イラストレーターを使って、文字を打つ場合、フォント数を小さめにしている場合は、あまり目立たないのですが、キャッチコピー、タイトルなど結構大き目のフォント数で文字を打ちたい場合、同じ大きさで文字を打っているにも関わらず何故か文字によって大きさが大きかったり、小さかったりして見える場合があります。それは、文字の高さや、幅が微妙にその文字の作りによって違う事でおこります。
微妙な差なのですが、大きい文字になればなるほど、その差が目立ち、文字の大きさが違って見えます。

パスファインダを使って、２つのオブジェクトを合体させる方法を以前、紹介しました。次はその隣のボタン、左から２番目の「交差」をつかってみます。
交差を使うと、２つのオブジェクトの重なり合った部分だけを残したオブジェクトが出来上がります。
使いかたは簡単
１．重なり合ったオブジェクトを選択
2.パスファインダの左上の２番目、「交差」をクリック
3.出来上がりです。

パスファインダを使うと面倒なオブジェクトの作成がかなり簡単にできたりします。
イラストなどを作成するときに便利です。

だけど、使用した後に、合体前のデータが必要になったりする場合がでてきたりするので、個人的には、合体前をコピーしておいて、パスファインダでもう一個の方を処理しています。
あとで、変更したい部分がでてきた場合は、元のオブジェクトがあった方が便利です。

マスクは、イラストレーター上の画像にかける事が多いのですが（画像にマスクをかける）、
作成した図形などにもかける事ができます。
使いかた次第では、大変便利です。
実用的な方法としては、お店までの地図などを自作で作成する場合があります。
パスで地図を作っていると、道路や川、線路など端っこまでの長さがバラバラで見た目が悪いのですが、全体に四角でマスクをかけると、余分に長い部分が四角い範囲以外見えなくなるので、四角い範囲に収まった見た目のきれいな地図をつくる事ができます。

前回からの続きです。

配置している画像が、同じフォルダにすべて揃っているか確認する。
配置しているはずなのに画像が表示されないということになったら最悪です。
かなり慎重なチェックが必要です。

「すべてを選択」して、「アウトライン化」する。
印刷のときには、アウトラインデータを使います。これは、文字化け防止の意味があります。
自分のパソコンで文字化けしていなくても、印刷所で文字化けして印刷されたらマズイので。
すべてアウトライン化しておく必要があります。

このあと、重要なのが、「別名で保存」で、違う名前で保存すること。
これによって、アウトライン前のデータと、アウトライン化したデータが出来上がります。
上書き保存してしまうと、印刷前ギリギリで修正する緊急事態の時に困ります。
それに、アウトライン前のデータがあれば、次回データに少し修正をいれたモノを印刷する場合の文字の打ちかえ等が楽です。

自分の場合、基本、フォルダに「アウトラインデータ、必要なepsファイル、アウトライン前フォルダ」を入れています。当然アウトライン前フォルダにはアウトライン前データが入っています。

印刷所によっては、「アウトライン前はいらない」とか、PDFで納品するようとか違いがあるので、それぞれ納品の際の条件は各印刷所に確認が必要です。

実際、アウトライン前データは自分で持っていればよくて、印刷所には持っていかない場合のが多いかも・・・。

納品の際は、データの入ったCD-Rや、MOなどと一緒にデータをプているリントアウトしたモノを見本として付けます。大き目の封筒にすべていれて、封筒に、「内容物の説明（この場合CD-R１枚、プリント１枚など」を書いて、マック、ウィンドウズなど自分の使用PC、OS、イラストレーターのバージョン、自社連絡先などもかいておきます。特別な注意事項などある場合も口頭だけでなく、封筒に目立つように書いておきます。

ざっと自分の場合の納品時の注意事項でした。
細かくいえば、注意事項はもっとあるかも。
だいたいこんな感じって程度なので、あくまで、参考までに。