今回は、斜めクリッピングの使い方について紹介します。通常のクリッピングとの違いは、やはりオブジェクトを斜めに切り取ることができる点ですね。さらに、ぼかしもかけられるのでとても便利です。
斜めクリッピングをかける
四角形に斜めクリッピングをかけてみます。ぼかしを0にして、幅を調節します。
幅はプラスの値でクリッピングされ、マイナス値で反転します。図形や背景に斜めクリッピングをかけて幅を2～3程度にすると簡単に直線が引けますね。
角度と中心XY
角度を調節することで、斜めにクリッピングすることができます。
中心XYを移動させることでクリッピングした部分を動かせます。画像にかけてみるとわかりますが、クリッピングする部分が動くので画像自体は動きません。画像を動かす場合は、オブジェクトのXYを使います。
ぼかし
幅を設定してぼかしをかけると、両端をぼかします。幅を0にすることで片側だけぼかすことができます。
両端とも斜めにクリッピングしつつ、片方だけをぼかしたい場合、斜めクリッピングを重ねてかけます。片方はぼかし0、もう片方でぼかすといった感じです。
縁取りに関して
クリッピングと斜めクリッピングで違いが出るのが縁取りや輪郭に関してです。どちらも同じように四角形から上下をクリッピングしています。ここに縁取り系のスクリプトをかけてみます。
結果はこのように、クリッピングは四角形から領域ごと切り取っているためクリッピング後の形で縁取られます。一方斜めクリッピングは、見た目は同じようにみえても領域は四角形のままのため四角形の形で縁取られています。
斜めクリッピングしつつ縁取りをしたい場合は、背景を一回り大きなサイズで斜めクリッピングしてメインの方を重ねるとうまく縁取ることができます。
黒背景に斜めクリッピング
元画像です。
元画像の上に黒背景を置き、その黒背景に斜めクリッピング。幅はマイナス値でぼかしをかけました。このように視線にあわせると画面の見せたい部分を強調することができます。
よく見る画面の黒帯も簡単に作れます。黒背景に斜めクリッピング、幅はマイナス値でぼかし0です。
画像や動画に直接かけてもいいのですが、そうするとオブジェクトを移動させたり、拡大したりしたときに黒帯まで一緒に動いてしまいます。
黒帯は背景で別オブジェクトにしておけば中の画像や動画を動かしても帯は動くことはありません。グループ制御をそのまま使っていると黒帯オブジェクトまでつられて動いてしまうことがあるので、そこは要注意です。
使用例
斜めクリッピングをかけた画像を並べて画面外からX移動させたり、幅を移動させたりと動きをつけてみてもいいですね。
フレームバッファや、同じ画像に斜めクリッピングをかけて拡大するとグリッチなどにも使えます。モノクロとカラーに分けてみたり、境界線に図形を足したり、ピントをあわせるようにぼかしを使ってみてもいいと思います。
中心XYで移動させると動きも出て効果的です。
いかがだったでしょうか。
斜めクリッピング、機会があれば是非使ってみてください。