スクリーンショットの「ここを拡大！」の表現
この記事内の目次
以前、書いたこちらの記事では、
次のような表現（図版A）に取り組みました。
次のような表現方法（図版B）もあります。
画面全体の中での領域を特定しながら行うズーム表現
Illustratorのパネルのように、パネルそのものが独立していて、移動させることができる場合には、上のような表現で問題ありません。
一方、次のように（図版C）分割表示すると、ウィンドウ全体の中でのおおまかな位置を表現できません。
「図版B」的に表現する場合、“ズーム元”がわかりにくいという点で致命的です（図版D）。
そこで思い付くのが次の表現（図版E）や
このような表現（図版F）。
ある意味、常套手段というか、よく見る手法ですが、次のような問題があります。
- 手間がかかる。図版Fは図版Eと比べるとさらに面倒
- 画面の印象が煩雑になる（ぱっと見た目、ゴチャゴチャします）
- 3箇所をズームしたい場合には、物理的に入りないかも
- 図版Fだと、薄いオレンジ部分で隠れてしまう領域が生じる
ベストプラクティス
現状、最適解として次のような表現を考えました。
- 手間がかからない
- 画面の印象が煩雑にならない
- 「ズーム元」もきちんと表現できる
次のようにはみ出していても、さほど不自然ではありません。
オマケ
白フチっぽい処理には［光彩（外側］効果を使っています。
