お花見シーズンもいよいよ終わり、次なる飲み会の口実を考え始めた今日このごろ、いかがお過ごしでしょうか。今回も個人的に感じた素晴らしいサイトの特徴を、いくつかお話したいと思います。
可能性を広げるための挑戦
図1 リニューアルされたトップページ
credit:ネットイヤーグループ株式会社, e*peher
KDDI株式会社のコーポレートサイトのトップページがリニューアルされました。Flash版とHTML版を合わせ、3つのトップページが用意されています。
図2 全面がプロモーションエリアとなるFlash版
Flash版では、画面全体がプロモーションのエリアとなり、マウスポインタを持っていくと、さまざまな情報を持つパネルに自動的に切り替わる仕組みになっています。さらにこの状態からメニューを開くことで、パネルを常に表示することも可能です。
図3 オーソドックスなHTML版
HTML版は、プロモーションのエリアをトップに置き、他の情報を重要度の高い順に配置していくという、コーポレートサイトではよく見る形となっています。
また、2度目以降のウェブサイトへのアクセス時には、ユーザーが最後に選択したトップページの形態が自動的に選択されるようになっています。
裏付けを欠かさないこと
今までにない非常に大胆なインターフェースをコーポレートサイトに採用したということで、ネット上でも意見が飛び交っているこのリニューアルですが、制作に携わったe*peherのオフィシャルBlogでは、このトップページに行き着くまでの過程が、丁寧に説明されています。
クライアントの要望からコンセプトを決定し、ユーザーテストなどによるデータを得た上で、インターフェースに反映するというデザインを決定するまでの過程を知ると、決して思いつきや感覚といったものではなく、しっかりとした裏付けによって、トップページが構築されていることがよく分かります。
このような実際のユーザーの動向をもとに、さまざまな機能を盛り込むことで、コーポレートサイトのトップページやインターフェースについて、新たな考え方・方向性が生まれる可能性は十分にあると思います。
この挑戦的な試みがどのような影響を与えていくのか。今後、さまざまなコーポレートサイトの動向を、しっかりと注意しながら見ていきたいと思います。
最小で最大の効果
図4 ファッションブランドmayumi torioのトップページ
credit:METAPHOR, Inc., tmtr.
デザイナーの鳥尾マユミさんによるファッションブランド、『mayumi torio』のウェブサイトです。サイト内では2008-2009年の秋冬コレクションがフィーチャーされており、素材感とシルエットにこだわって作られた数々のニットウェアが紹介されています。
動きの"ムダ"をなくす
図5 collectionに登場するナビゲーション
このサイトで注目したのは、「collection」の中に登場するナビゲーションです。ニットウェアを紹介する画像のサムネールの上にマウスポインタを重ねると、そのアイテムの写真が画面全体に広がります。
図6 わずかな動きで写真全体を見渡せる
通常、画面全体に広がった画像を動かして見る場合には、それに合わせてマウスも大きく動かさなくてはなりません。しかし、このサイトではナビゲーションとして用意された小さなエリアの中で、マウスポインタを上下に少し動かすだけで、各アイテムの全体を確認できます。さらに、さまざまな視点で撮影されたアイテムの画像も、マウスポインタを同じように左右に少し動かすだけで、スムーズに切り替えられます。
画像を確認するために、マウスを大きく動かすという"ムダ"をさりげなく、しかも美しく解消してみせたこのナビゲーション。どのウェブサイトにも存在するナビゲーションも、まだまだ工夫できる可能性があることを十分に感じさせてくれます。まだ誰も見たことのない、驚くような新しいインターフェースの登場に、これからも期待したいと思います。
トップページも商品カタログ
「シンプルで超合理的なデザイン」というコンセプトで、1年半ぶりにリニューアルされた、ユニクロの公式ウェブサイトです。
図7 オンラインストアもリニューアル
ユニクロ公式サイトのトップページとオンラインストアのトップページを統合し、商品情報とキャンペーン情報を一度に見ることができるという、シンプルで軽快なウェブサイトになっています。
また、今回の日本のリニューアルに伴って、世界各国のユニクロのウェブサイトも同一のデザインに順次リニューアルされていくとのことです。
ユーザーのための導線の変化
Flashが使われていないこと、多くの情報を美しく収めたグリッドレイアウトなど、デザインについても話題になっているこのリニューアルですが、個人的には、多くの情報をトップページに敷き詰めた点に注目しました。
キャンペーン情報を中心としたリニューアル前の構成から一転して、オンラインストアの商品画像を中心にウェブサイトを組み立て直したことで、リニューアルされたトップページは非常に縦に長いものとなりました。そのため、ユーザーの視線が定まりにくいこと、すべての情報を見るために何度もスクロールしなければならないなどの欠点も出てきていると思われます。
しかし、オンラインストアへの導線は、"トップページからプロモーションサイトを経由して、オンラインストアの商品情報へ"という以前の流れから、"トップページから、直接オンラインストアの商品情報へ"と大きく変わっています。その結果、ユーザーが欲しいと思った商品をすぐにオンラインストアで買えるようになるという、上記の欠点を補って余りある効果を生み出しています。
オンラインストアで非常に重要な、"いかにユーザーにスムーズに購入してもらうか"をトップページのリニューアルで実現したこのウェブサイト。ユニクロのように商品の企画・製造・販売を行っている企業のトップページのあり方として定着していくかどうか、今後の推移を見守っていきたいと思います。
というわけで、今回も最後まで読んでいただき、ありがとうございました。それでは次回をおたのしみに。
