Archive for the 'パソコン・ソフトのカスタマイズ' Category
2010 年 1 月 20 日
カテゴリー: パソコン・ソフトのカスタマイズ |
なんていうの?WEB2.0っぽい半分半分グラデのボタン
こういうボタンよくあるじゃないですか。
WEB2.0風っていうんでしょうか(WEB2.0ってまだ生きてるのかな・・・)
毎回色合いがうまくいかずに、なんだかんだ時間かかったりして作るの苦労してたんですが、Fireworks CS3ですんごく簡単に作れる方法を見つけちゃいました。
(今まではどっかのサイトにあるやつを参考にもってきて、スポイトで何箇所もとりながらやってたんですけどね^^;)
すでに知っている人いたら、戯言なんで、無視したってください(笑)
【作り方】
(1)四角を描く。塗りはとりあえず「基本」でOK。最初からグラデーションになってたら(2)からはじめる。
(2)塗りをグラデーション「線形」にする。とりあえず色は何でもいい。今回の場合、グラデーションの方向は上→下という方向で。
(3)グラデーションの両側の色を感じのグラデーションになるように決める。上を濃い色、下を淡い色にする。
(4)グラデーションの中間を2箇所クリックする(画像のように)。クリックすると自動で色が決定されて2箇所にマーカーがつく。色を選ぶ必要は無い。
マーカーの感覚によって少しづつグラデーションの具合が変わるので、その辺はお好みで。
はっきり境界線を出したい場合は、上の画像くらい開け、はっきりしすぎないように境界線を出したい場合は下の画像くらいに。
(5)右端と左端のマーカーを入れ替える。(画像の赤丸)
(6)真ん中二つのマーカーが重なるくらいに寄せ、ちょうど境界線がはっきり出るところでとめたら出来上がり。
今まで1個のボタン作るのに何分もかかってたのだけど、1分もかからずできあがりました!
なんでもっとこの方法を見つけれなかったんだろう;
もう参考にする画像無くてもいけちゃいます!
早く次のデザインの仕事こねえかな(笑)
ちなみに参考。
グラデーションの作業を楽チンにするエクステンション「Fireworks Gradient Panel」。
グラデーションの方向は、Fireworksのデフォルトでは、なにやら棒(笑)の方向を動かして変えるしかなかったんですが、コレはワンクリックで縦方向・横方向を入れ替えることができます。
一応、Windows版MX・8・CS3では動作確認済み。
難点としては、このエクステンションのウィンドウを開いた状態だと、テキストツールが正しく動かないっつうこと。
使い終わったら、さっさと「Fireworks Gradient Panel」のウィンドウは閉じてしまうこと。
エクステンションの中にはテキストツールに不具合(?)が出るものがいくつかある。
これもそのひとつ。
[Ohter List]

