== グラデーションの例 == 作例を3つ、手順を追って示します。 ---- === 例1 === 線形グラデーションを用いて円筒を表現します。 . {{attachment:sampleg13.png}} {{attachment:sampleg14.png}} もとの図形はこのようになっています。 . {{attachment:sampleg00.png}} 部品を選択し線形グラデーションを指定します。 . {{attachment:sampleg02a.png}} 一見うまくできたように見えますが… . {{attachment:sampleg01.png}} 透明になっていて、下にある図形によって見え方が変わってしまいます。 . {{attachment:sampleg03.png}} グラデーションツールを選びます。 . {{attachment:sampleg51.png}} グラデーションを指定した部品をグラデーションツールで選ぶと、'''選択'''の部分に使用中のグラデーションが表示されます。 . '''左端'''が青みがかった灰色、'''右端'''が透明(チェック表示)になっています。 . {{attachment:sampleg52.png}} 左端の四角を選びました。 . '''色フェーズ'''に、この箇所の色が表示されます。 . チェックの模様が見えないので不透明になっているのがわかります。 . 色の調整はフィルの部分を使って行います。 . {{attachment:sampleg53.png}} 右端の丸を選びました。 . '''色フェーズ'''に、この箇所の色が表示されます。 . チェックの模様が表示されているので、透明になっているのがわかります。 . {{attachment:sampleg54.png}} '''修正が必要です'''。 . '''A(不透明度)'''が左端(0)になっていたのを右端(255)にします。 . 色はホイールの三角内で明るい色を選びます。 . '''色フェーズ'''の表示はチェック模様が見えず、明るい色になりました。 . '''選択'''の部分を見ると、同系色で暗い色と明るい色のグラデーションができたのが分かります。 . {{attachment:sampleg55.png}} 下の色が透けることのないグラデーションになりました。 . {{attachment:sampleg08.png}} 次にグラデーションツールを用いて、グラデーションの向きを調整します。 . 両端をドラッグして位置を調整できます。 . {{attachment:sampleg09.png}} グラデーションの繰り返しで「リフレクト」を使ってみます。 . {{attachment:sampleg56.png}} このようになりました。 . {{attachment:sampleg11.png}} もう一度グラデーションツールを用いて、グラデーションの向きを調整します。 . 明るい方と暗い方を逆にしました。 . {{attachment:sampleg12.png}} 上部の楕円の部分にもグラデーションを指定します。 . グラデーションは同じものを指定します。 . グラデーションの向きは修正が必要です。 . {{attachment:sampleg13.png}} ---- === 例2 === 透明なグラデーションは同じ形の部品に重ねて使います。 . 複製したものにグラデーションを指定し、それらを重ねます。 . ぴったり重ねる方法は後日解説予定。 例1と同じ表現を行うには次のようにします。 . 左はもとの図形で単色で塗られています。 . これに白と透明でできたグラデーションを重ねます。 . 結果、右のようになります。 . {{attachment:sampleg15.png}} グラデーションの左端は、不透明で白にします。 . {{attachment:sampleg57.png}} グラデーションの右端は、透明で白にします。 . {{attachment:sampleg58.png}} ---- === 例3 === 放射状グラデーションを用いて花を表現します。 . {{attachment:sampleg31.png}} もとの図形はこのようになっています。 . {{attachment:sampleg18.png}} 一番手前の花びらを選んで放射状グラデーションを指定します。 . {{attachment:sampleg20a.png}} 透明なグラデーションが作成されます。 . {{attachment:sampleg19.png}} グラデーションツールで選択します。 中央の四角を選び、色を調整します。 . '''A(不透明度)が右端'''になっていることを確認します。 . 色は思った色より、少し濃い目にするとよい。 . {{attachment:sampleg59.png}} 端の丸を選び、色を調整します。 . '''A(不透明度)を右端にします。''' . 色は思った色より、少し明るめにするとよい。 . {{attachment:sampleg60.png}} 下が透けて見えないことを確認します。 . {{attachment:sampleg24.png}} グラデーションの向きを調整します。 . {{attachment:sampleg25.png}} このようになりました。 . {{attachment:sampleg26.png}} 次の花びらを選びます。 . {{attachment:sampleg27.png}} 放射状グラデーションを指定します。 . このような表示になるので、先に使ったグラデーションを選びます。 . {{attachment:sampleg61.png}} グラデーションの向きを調整します。 . {{attachment:sampleg29.png}} 残りの花びらも同様に行います。 . {{attachment:sampleg30.png}} ふち(線)の色を'''なし'''にするとこのようになります。 . {{attachment:sampleg31.png}}