2014年8月5日火曜日

ぐるんぐるん特設サイトの三角形

6月18日に、Perfume 5th Tour 2014「ぐるんぐるん」特設サイトが開設されました。

特設サイトのスクリーンショットがこちらです。



特設サイトでは、ぐるんぐるんのロゴの、三角形、四角形、五角形にマウスカーソルを置くと、その図形がぐるんぐるんと回転するわけですけれども、みなさんも体験されましたでしょうか。

これらの図形を回転させてみると、三角形の回転だけ、何かギクシャクしてるように感じません?

ファン=デオマは、当初から三角形の回転に違和感を感じておりました。
ただ、Twitterに投稿しても、さっぱり同意は得られなかったわけで…(笑)

それでも、理系のサガか、A型のサガか、一度気になったら、もう気になって気になって仕方がありません。
あまりに気になったので、三角形を回転させつつスクリーンショットを撮ったものがこちら。

左に120℃回転した状態。

そして、右に120℃回転した状態。


3つを見比べると、下の2つは明らかに三角形の位置がおかしいことが分かりますよね?
重心で回転していれば、こんなことにはならないはずなのですが…

当初は、何かの設定ミスが原因で、回転軸が重心からズレてしまっているので、そのうち修正されるものとばかり思っていたのですが、開設以来、現在に至るまで、ずっと修正されることなし。
なかなか修正されないものですから、ひょっとして、実は何か深い意味があるんじゃないかと、思い始めたりして…(わざとぎくしゃくした回転にすることで、『ぐるんぐるん』感を出してるとか)

ただ、その深い意味は分からないまま、とうとう、ぐるんぐるんツアーが始まってしまいました。

この三角形はツアーロゴの一部ですから、会場のスクリーンにも登場するわけです。
それがスクリーン上でも回転していたのですが、その回転は実にスムーズで、重心を軸に回っていることは明らか…
結局、特設サイトの三角形の回転がおかしいのは、狙いでもなんでもなかったようです…(笑)

それで、サイトのソースコードを見て調べてみますと、CSSとかHTMLはほとんど素人なのではっきりとは分かりませんが、どうも、回転処理はプログラムで行われているみたい…
回転軸の設定とかはないようで、図形の中心を軸に回している様子。
本当は三角形の重心を軸に回転させないといけないところを、図形の中心を軸に回転させているため、三角形の重心と図形の中心がズレてる分、回転がギクシャクしている、ってのが真相のようです…

あ~、すっきりした(笑)

0 件のコメント:

コメントを投稿