H&Mウェブサイトの不思議な世界観
09-03-21
posted by
石橋秀仁
すごいハイテクに感じる表現。まったくハイテクではないのに。→H&M 春のファッション
モデルが歩いてます。気になった服をクリックすると・・・
え・・・
？？？？
何事もなかったかのように・・・
なんと、衣服が霧散し、別の衣服が蒸着するような、サイバーな表現です。
実写で着せ替えできるCGI/VFX技術か・・・と思ったけど、よく見たら、違いました。動画と動画を、透明度を変化させながら、つないでいるだけですね。そこで、つなぎ目の途切れ・不自然さを誤魔化すために、一瞬下着になるトランジションを入れているのでしょう。
そういう「誤魔化し」を、むしろ表現効果に転換しており、素晴らしい。
さて、ほかのコンテンツに目を向けてみると、CMが同じ世界観で統一されています。
ただ、ユーザビリティには難あり。この世界観を損ねずに改善できそうな点ですが。
クリックしてもすぐに画面遷移しない（重い）ので、状態遷移に中間状態を入れたほうがよいでしょう。（now loading的な）
また、メニューから「ムービー」を選んだあとに、混乱します。
・・・待っていても動画が始まらない。
この画面が、動画のメニューであることが分かりにくい。動画のタイトルかと思って、しばらく待ってしまいました。もっとボタンであることが分かりやすい見た目にするか、ボタンをプレイヤーの枠の外に置くか。
さておき、このムービープレイヤーの動作はユニークです。「H&M CM」をクリックすると、
赤い球が回転して読み込み中であることを示します。
球が一つ弾け飛んで・・・
枠の後ろからも何か出てきました
枠の裏から出てきたのは動画のコントロールでした。
球は床に転がっています。じつは、この球が動画再生位置を示すスライダーになっています。（ドラッグすると再生位置が変わる）
これに最初は気付きませんでした。ただ、UIデザイン上は問題ないでしょう。べつに操作して見たいようなものでもないし。（このへんの割り切りは、ユーザビリティ原理主義ではなく、もう一つ上のレイヤーで考えないといけませんね。私は、「アリ」と断定できないけど、「ナシではない」と考えます）
UIコントロールまで芸術的なデザインです。単に手が込んでるだけでなく、世界観に沿っているのが素晴らしい。
余談ですが、このスライダーコントロールは、MoMA TimeSphereを彷彿とさせます。
コメント