イラストレーターで立体的なボタン

イラストレーター１０を使用しています。
下記のサイトの右の「全講座の一覧へ」「資料請求」のような
ボタンを作るにはどうすれば良いでしょうか？
立体的なボタンの作り方が載っているサイトを
教えていただければ助かります。
よろしくお願いします。
http://www.u-can.co.jp/index.html

No.3 ベストアンサー 回答者： ohirugohan 回答日時： 2006/01/06 15:30

イラストレータで簡単にできます。

なにも考えずに下記の手順を試してください。

・角丸長方形ツールで『W40H10R2』の四角を書く。
・塗りを『R255G100B20→R255G153B0、角度90の
　グラデーション』に、線を『透明』に設定。
・「パスのオフセット」で『-1、マイター、比4』の
　一回り小さな四角を作る。
・「移動」で『水平-0.6、垂直-0.6』ずらしてコピー。
・一回り小さな四角二つを選択して「パスファインダ」
　『前面のオブジェクトで型抜き』
・できた鉤括弧形のオブジェクトの塗りを
　『R255G200B50→R255G100B20、角度-85のグラデーション』に設定。

これで近いものが出来たと思います。
（構造がわかりやすいようにオブジェクトの間隔や
グラデ幅を多めに取っていますのでそのままではありません）
あとはお好みで色やサイズを調節してください。
美しさを求めるのであれば、「ブレンド」をお勧めしますが
説明が複雑になりますので簡易立体ボタンです。
イラストレータの基本ですので、どうぞ活用なさってください。

※グラデーションの設定、パスのオフセット等のコマンドの場所が
わからないときはイラストレータのヘルプを見てください。

No.2 回答者： softbankHawks 回答日時： 2006/01/06 14:03

例に出されているサイトのような単純なボタンじゃありませんが、

こちらのサイトにきれいなボタンの作り方があります。

AQUA風？ボタン
http://www.detarame.jp/ex-31-40/example37.html

文字は、レイヤーで入れればいいだけです。
あとはドロップシャドウでも何でも好きに出来ます。

上記サイトは「デタラメPhotoshop」という、解説本を出している方のサイトです。
http://www.detarame.jp/
他にも立体的な文字の作り方なども具体的に解説してあります。

でも、適当な素材集などから拾ってきて、それをベースにPhotoshopなどで加工した方が楽かもしれません。

ジャギーを気になさっていますが、GIFにしろPNGにしろ、最終出力は結局ラスターデータになりますから。（ボタンにFLASHを使うというならまた別ですが。）
拡大してみるようなものではありませんので、気にならないと思いますよ。

No.1 回答者： showta 回答日時： 2006/01/06 11:15

WEB製作の仕事していますが

自分たちは、イラストレーターでは
素材加工とかしないですよ
基本的には、フォトショップを使っていますよ
最終段階のGIFの色減しとかWEB用に
簡単にできるようになっています。
レイヤー分けで、同じボタンのベース素材に
いろんな文字を重ねてＯＮ・ＯＦＦすれば、
切り替えて、ボタンを作成しやすいですし
最新のものは、WEB素材作りやすく
プログラムが構成されています。

この回答へのお礼

なるほど、フォトショップですね。
フォトショップで作るとギザギザな感じが出るので
遠慮していたのですが・・・

フォトショップでの参考サイト等ありますでしょうか？

お礼日時：2006/01/06 11:43