Photoshopでもそうでなくても良いですが、アウトラインに沿ってグラデーション可能？

質問

画像の作り方の質問です。

Photoshopでもそうでなくても良いですが、アウトラインに沿ってグラデーションさせるようにするにはどう作ればいいでしょうか？
良い例え画像を以前見た記憶ありますが、URLを覚えていないので、ちょっとわかりにくいですが別の画像で説明しますと、
以下のURLの画像で、箱からリボンみたいな細長いオビが何本も出ていますが、このオビの先っぽがだんだん薄くなっています。ちょっと小さくてわかりにくいですが。

http://www.xserver.ne.jp/images/top_present.png

Photoshop CS3、Illustrator CS3あります。
その他のフリーソフトで作成可能ならばそれでもかまいません。
理想はPhotoshopでできたら一番良いです。その他の作業もPhotoshopばかりなので。

例えばPhotoshopでグラデーションツールを使っても、画像のつくりがどうあろうと縦横・上下の四方向にしかグラデーションが流れません。
形状に沿ってグラデーションは流れないですよね。

以上、宜しくお願い致します。

回答No.8

caz04

Photoshopでやるなら、例えば

1.4角形を描き、グラデーションで塗る
2.”編集”→”変形”→”ワープ”で変形する

では意図と違いますか？

お礼

ありがとうございます。

そうですね、デザインは長方形のような単純なものではありません。
色んな形状でつくりたいので、曲げる前のものをつくってそれにグラデをかけ、それを曲げるというのはちょっと無理です。
本来デザインしたい形状に向かって曲げながら近づけていくのは至難の業です。

ありがとうございました。

回答No.7

webtera

Photoshopだけとこだわらず、他の方の説明に有りますように、Illustratorで作成し、Photoshopへドラッグ アンド ドロップで移動し、他と組み合わせて使う方法がいいと思います。
どちらのソフトも思うように使えれば、表現の幅も広がりますよ。

お礼

ありがとうございます。

いえいえPhotoshopにこだわるとか決め付けないでください。
そうでないんですよ。
もしPhotoshopだけでしかもスムーズに完結できればそれば一番です。
なぜならばPhotoshopの方がWeb化しやすいからです。用途がWebなので。

今の作業方法が当たり前と壁をつくってしまうただの作業者でなく、もう少し知恵をもって構造から考える思考訓練をする必要があると思います。

Photoshopでスムーズに完結できないならばIllustratorなど、他のソフトと組み合わせる方法を考えれば良いのですから。

回答No.6

hiroleta

曲線に沿ったグラデーションの方法。
画面に長方形ツールで四角を描く（幅１００ｍｍ・高さ１０ｍｍ・線なし）＞塗りを線形グラデーションに設定（角度９０度又は－９０度）＞仮に、下側を赤、上側を白のグラデーションに設定（どちらかの色を背景と同じ色にする、真ん中が赤で上下を白に設定してもＯＫ）＞オブジェクト＞分割・拡張＞指定にチェック、個数２００個＞ＯＫ＞パスファインダの「分割」＞ブラシパレットの右上の三角をクリック＞新規ブラシ＞新規アートブラシ＞ＯＫ＞そのまま、ＯＫ＞ペンツールで曲線を描く＞ブラシパレット内の登録したブラシをクリック＞線幅を調整＞透明パレットで不透明度を少し下げる。

線の先端をグラデーションにするなら、曲線をアウトライン化して単純に線形グラデーションを線の方向に合わせて設定。

線の先端のグラデーションを透明にするなら。
ペンツールで曲線を描く（線幅・太め、仮に赤ベタ）＞その線を囲む大きさの四角を長方形ツールで線の上に描く＞塗り、白黒のグラデーション・線なし＞全体を選択＞透明パレットの右上の三角をクリック＞不透明マスクを作成＞曲線の周りもグラデーションにするなら、効果＞スタイライズ＞ぼかしを設定。

イラストレーターでの方法なので、理想的ではないかも？

お礼

やってみたのですがメッシュをかけたあとの形状に対してグラデをかけるところでグラデをかけることができませんでした。
やり方がどこか違っているのだと思いますのでまたやってみたいと思います。

ご案内の方法でうまくいけば、イラレだけで完結するやり方であってもPhotoshopへは完成イラレデータをもってきてリサイズしてWeb化するだけなので、これはこれでよいと思います。

ありがとうございました。再度やってみます。

回答No.5

noname#107580

こんにちは！

とりあえず、サンプル画像に似たものを作るとしたら・・

新規の透明レイヤーを作り・・・
＊ソフトブラシでだんだん薄くなるような緩やかな曲線を書きます。
ペンタブがあると作りやすいです。

そのレイヤに【レイヤースタイル】→【光彩(外側)】を適応します。

色を変えて繰り返します。

【＊】はあとからマスクで調整しても良いです。

お礼

なるほどペンタブレットですか。
手で絵がかける場合は案外こちらのほうが早いんでしょうね。

参考になります。
どうもありがとうございました！

回答No.4

tsucu

Illustrator CS3 をお持ちならツールパレットにあるメッシュツールで自由なグラデーションを適用できます。

オブジェクトをメッシュで分割して、各アンカーに個別に色を設定できますので、グラデーションは自在に操れます。

お礼

核アンカーに個別に色を設定できる、これが核のようですね。
ありがとうございます。試してみますね！

回答No.3

ddg67

パス書いてそしてグラデーション掛けるから、曲がらないんです

まっすぐなグラデーション作って、それを曲げれば、希望の方法どーりになります。

ま、どっちにしろ上手くグラデーション描けばいいだけの事ですが(^_^;

お礼

長方形や簡単な線で良いならば後から曲げるので良いか場合もありますが、
デザイン形状はそのように単純なものでないため、グラデーションをかけてからあとから形状を変化させていく、というのは無理だと思います。
パスの精度差があるため、デザイン自体はよくあるようにイラストレーターで製作します。
そしてそれをPhotoshopへもっていき、曲線のグラデーションがかけられると良いなぁと思っております。
Photoshopで無理ならばIllustratorだけで完結させ、完成データをPhotoshopへもっていってウェブ化するという流れでもかまわないと思っております。

どうもありがとうございました。

回答No.2

xxi-chanxx

Photoshopでもそれに近いものもできました。
グラデーションにしたいアウトラインを選択して、それをグラデーションで塗るだけです。
グラデーションは上下左右でけでなく、好きな方向に流れます。
ツールで塗りをグラデーションにして、クリック、グラデーションを流したい方向にドラッグするだけです。

お礼

説明不足で申し訳ないです。

No1さんへ返したお礼に追記しました。

直線でなく曲線グラデをつくりたいと考えております。

ありがとうございました。

補足

> 例えばPhotoshopでグラデーションツールを使っても、画像のつくりがどうあろうと
> 縦横・上下の四方向にしかグラデーションが流れません。

伝え間違いです。要は、直線グラデしか出来ない、ということを言いたかったのです。

回答No.1

SAYKA

パスに沿ってグラデーションというより、先の方に行くと不透明度が低くなるだけのように見えるんだけど・・・・？
これなら終わりの方は不透明度が下がるグラデーションを作成するかレイヤーマスクで透明になるグラデーションをかぶせるとかじゃないかな。

それと、グラデーションツールは　開始点をポイントして終了点までドラッグするとその角度で確定される筈なんだけど・・・？（直線しかできないのは一緒)

お礼

例えがわかりにくくて申し訳ないです。

やりたいことを換言すると、直線ではなく「曲線」のグラデーションをつくりたいということです。

PhotoshopにしろIllustratorにしろ、グラデーションツールを単純に使用すると、
グラデーション方向は360度設定できますが、しかし直線ですね。

どの方向へもグラデ可能ですが、それはあくまで直線。

ウェブページで、グラフィカルな画像にたまに直線グラデーションが使われていまして、
その製作手法を知りたいのです。

早々にお答えいただいてありがとうございました。

補足

> 例えばPhotoshopでグラデーションツールを使っても、画像のつくりがどうあろうと
> 縦横・上下の四方向にしかグラデーションが流れません。

伝え間違いです。要は、直線グラデしか出来ない、ということを言いたかったのです。