さて問題です。下の2つの背景画像で、端がめくれ上がっているのはどっちでしょう？
「表現手法としてどちらが優れているか？」という問題ですと、人によって答えは違うかもしれません。上の画像は紙の折れ曲がっている部分に影の表現がありませんが、下の画像にはそれがあります。しかし2つの画像を見比べてみると、下の画像の折り曲げ部分に、何か違和感を感じるかもしれません。それはなぜかというと、下の画像の折れ曲がっている部分の寸法は、折り返した部分が紙に密着している寸法になっているからです。そして上の画像は影などの効果は何も付けていない手抜きですが、紙が密着せずに浮いている寸法になっています。
幾何学的観点から結論を言うと、下の画像は折った部分が下に密着していて、上の画像は折った部分が斜めに浮いている状態です。今回はベクターグラフィックのソフトを使ってこの画像を作りましたが、上のような状態を意図して、下のようにただ単に反転操作を使っている人は多いのじゃありませんか？ 円形部分だとあまり目立たないですが、長方形を折ると違いは一目瞭然です。
回転という一手間と、回転は一発勝負
さて、どうやって上のような画像を作るかというと、反転する折り目の線を、水平か垂直にする方法です。つまり、元の画像を回転させます。回転させて、水平か垂直の線に対して反転操作し、上下方向か左右方向に大きさを小さくし、浮き上がっている状態にするのです。
この浮き上がった状態を作ってから、また逆回転させると元の向きに戻ります。ただし、折り目の線に合わせる回転と、元に戻す回転は、できる限り一発できめないといけません。間違って別の角度に回転して、それを戻すためにあれこれと、何度もあっちやこっちに回転させていると、入力数値の上では元に戻っているのに、実際にはわずかに斜めになってしまうことがあります。
実は一番上の2つの画像は、完全には水平にはなっていません。わかりやすくするために、枠つきで並べたのが下の2つです。
外側に全然違う色のボーダーを表示すると、隙間の部分がわかりやすいと思います。そして、きちんと水平に作れたものが、下の2つです。ピンク色の枠線と隙間の部分を見ると、隙間は一様になっているのがわると思います。
紙の端がめくれているような表現は、いろんなところで使える表現ですが、ちょっとしたことで見た目が変わってきます。みなさんも、一手間かけてみてはいかがでしょうか。
