こんにちは、あべです。
先日のブログの「up」と「dn」の話が好評だったので回してみました。
わざわざ文章なんて書かなくても回せば伝わるので虚しくなりますね。
回ってます
回す時には、昔ながらのgif makerを使いました。
今時こんな回し方する人は少ないかもしれませんね。
gifとは画像を連続して表示することでアニメーションにすることができる表示形式です。
今回の「up」と「dn」も、20度ずつ回転させた18枚の画像を作ってmakerに入れました。
回してて、話したいことを見つけたので話します。
upとdnはどちらも天地逆さまにしても同じ形をしているにもかかわらず、単純に回した画像を作ってもダメなんです。
upの文字に外接する仮想の四角形を描くとわかりやすいです。
水色が仮想の外接四角形で、縦横の中心（ミドリの線）に据えられています。
「up」と「dn」を表示したのが真ん中と右です。
この状態だといい感じに見えるかもしれませんが、
ガイドラインを外してみるとupはやや上に、dnはやや下にずれているように見えてしまいます。
こんな感じ。
図形を配置する際、少しだけ上にずらして配置すると気持ち良くなる現象はあるのですが、
下にずれているのはダメです。
気にならない人もいるかもしれませんが、気になります。気になりましょう。
そこで、仮想の外接四角形ではなく、「エックスハイト（x-height）」が縦の中心に来るように配置してみます。
エックスハイトとは、アルファベットの小文字のxの高さです。
これは今回の場合uやnの高さと（だいたい）同じです。
なのでuやnの高さの中心をミドリの線に合わせます。
upは外接四角形よりも下に足がはみ出て、上には隙間があります。
dnはその逆です。
（外接四角形の位置は動かしていません）
この状態だと少し気持ち悪いかもしれませんが、ガイドを取ってみればわかります。
こんな感じ。
なんて美しいのでしょうか。
こんな感じで、どちらも上下の中心にあるように見えるようになりました。
イラストレーター上で言えば、
まずはアートボードの中心を通過する水平線（ミドリ）をひき、
（中心を通過する垂直線もひいた方がよりいいですね）
エックスハイトの中心がミドリ線に来るようにし、
単純にupの角を掴んで回す（下図）のではなく、
アウトライン化したupに対して回転ツールを使い、回転の中心をミドリ線の中央においてから回転させよう（下図）、ということです。
ほらね！ 簡単でしょ！
久々に図を使って解説なんてしてみましたがいかがでしたでしょうか。
やっぱり反響があると嬉しいしモチベーションになりますね。
へえと思った人はリツイートお願いします。
お疲れ様でした。
新中野製作所
安倍大智