welcome: please sign in
location: "グラデーションの概要"の差分
3と6のリビジョン間の差分 (その間の編集: 3回)
2010-10-22 05:33:12時点のリビジョン3
サイズ: 1787
編集者: masahiko
コメント:
2010-11-10 12:43:26時点のリビジョン6
サイズ: 2448
編集者: masahiko
コメント:
削除された箇所はこのように表示されます。 追加された箇所はこのように表示されます。
行 2: 行 2:
== グラデーションの概要 ==

単色での着色の他に、'''グラデーション'''を用いた着色ができます。
グラデーションには'''線形'''グラデーションと'''放射'''グラデーションがあります。

グラデーションを用いた着色を行ったときは、着色後に'''グラデーションの向きと量の調整'''が必要です。

つまり、次の3つの作業を行うことになります。

 1. グラデーションを作る
 1. グラデーションで着色する
 1. グラデーションの方向を調整する
行 3: 行 15:
サンプル1
行 6: 行 16:
線形と放射の使い分け向きの調整は必ず行うこと。  * 線形と放射の使い分け
 *
向きの調整
は必ず行うこと。
行 8: 行 20:
----
=== サンプル1 ===
線形と放射、向きの調整
 . {{attachment:gradient9.png}}
行 10: 行 26:
線形グラデーション
中心の暗い放射グラデーション
中心の明るい放射グラデーション
2つ重ねたもの
 * 線形グラデーション
 * 中心の暗い放射グラデーション
 * 中心の明るい放射グラデーション
 * 2つ重ねたもの
行 15: 行 31:

サンプル


サンプル2
----
=== サンプル2 ===
行 22: 行 35:
 . {{attachment:gradsample1.png}}
行 24: 行 38:
グラデーションの方向未調整
グラデーションの方向を調整、線の色は黒
グラデーションの方向を調整、線の色はなし
グラデーションの方向を調整、線の色は同系色
 * グラデーションの方向未調整
 * グラデーションの方向を調整、線の色は黒
 * グラデーションの方向を調整、線の色はなし
 * グラデーションの方向を調整、線の色は同系色
行 29: 行 43:

サンプル

補足
----
=== 補足 ===
行 39: 行 51:
1)透明になって後ろのものが透けてみえている。これではだめです。
2)不透明にすると重なりがはっきりします。
3)透明度を使ったグラデーションの例です。
 . 1)透明になって後ろのものが透けてみえている。これではだめです。
 . 2)不透明にすると重なりがはっきりします。
 . 3)透明度を使ったグラデーションの例です。
行 43: 行 55:
サンプル  . {{attachment:gradsample2.png}}
行 47: 行 59:

 . {{attachment:gradient9.png}}
 . {{attachment:gradsample1.png}}
 . {{attachment:gradsample2.png}}

グラデーションの概要

単色での着色の他に、グラデーションを用いた着色ができます。 グラデーションには線形グラデーションと放射グラデーションがあります。

グラデーションを用いた着色を行ったときは、着色後にグラデーションの向きと量の調整が必要です。

つまり、次の3つの作業を行うことになります。

  1. グラデーションを作る
  2. グラデーションで着色する
  3. グラデーションの方向を調整する

グラデーションのサンプル

グラデーションは使い方によって効果が違います。

  • 線形と放射の使い分け
  • 向きの調整

は必ず行うこと。 しっかり調整しましょう。


サンプル1

線形と放射、向きの調整

  • gradient9.png

左から

  • 線形グラデーション
  • 中心の暗い放射グラデーション
  • 中心の明るい放射グラデーション
  • 2つ重ねたもの

です。


サンプル2

線の色をどうするかによっても効果が違います。

  • gradsample1.png

左から

  • グラデーションの方向未調整
  • グラデーションの方向を調整、線の色は黒
  • グラデーションの方向を調整、線の色はなし
  • グラデーションの方向を調整、線の色は同系色

です。


補足

透明度の使い方については後日解説します。 透明度を使うには部品の重なりをマスターする必要があります。 今回は、透明度を使わないグラデーションを練習してください。

下の3つは左から順に

  • 1)透明になって後ろのものが透けてみえている。これではだめです。
  • 2)不透明にすると重なりがはっきりします。
  • 3)透明度を使ったグラデーションの例です。
  • gradsample2.png

3番目の例は、同じ形の部品を同じ位置に重ねて配置し、下の部品は単色で塗っています。そのうえで手前の部品に透明度を使ったグラデーションを指定しています。このグラデーションは中央が白、端が透明の放射グラデーションです。 今回は使いません。

グラデーションの概要 (最終更新日時 2017-11-06 05:20:43 更新者 masahiko)