Web関連

パララックスデザインのサイトって使いにくくない?

0

結構こなれてきた感もあって、あちこちで見かけるようになったパララックスですが、正直なところ、扱いにくいな…
なんて思った事はないでしょうか。作るのになかなかの手間が掛かる割に、効果はどうなのか?
ユーザーはどう思っているのか?そこの所を考えていきます。

パララックスの集大成

pararaxyoshida_15062001.pnghttp://www.world-of-swiss.com/ja

スイスの航空会社SWISSのサイトです。
いやー、よく作り込まれています。動画が随所に効果的に配置され、全体的に美しくまとまっている良いサイト。すごいなぁと思うんです。これだけの情報量をまとめて、上手くパララックス上で表現するのって、並大抵の事ではありません。
どんな風に設計して、どんな構成書いたんだろう?と制作風景を見てみたくなります。

ただ、ここで意地悪言ってしまうんですが、これ、パララックスにする必要ないんじゃないですかね。
パララックスにしては情報が多いので、全体が見渡しずらく、目的の物を見つけようと思ったときには、立ち往生してしまいます。
「ちがうんだ!SWISSの世界観を感じてくれよ!航空会社としてのブランディングを…操作性は二の次だ!」という制作側の声が聞こえてきそうです。
そう、話題性も狙っているでしょうし、このコンセプトはありで、パララックスの良い成功例だと思います。
FWAのSITE OF THE DAYとってますし。
ただ、我々が陥ってはいけないのが、そこにユーザー目線があるのかと言う事です。
SWISSカッコイイから、同じようなパララックスデザインのサイトを作りたい…なんてかっこよさ先行でサイトを作ろうとするとまずいと言う事です。

パララックスデザインでサイトを作る理由

pararaxyoshida_15062002.jpg

なぜパララックスを使うのかと言えば、ズバリ!人目を惹きたいからですよね。それ以外の理由はないはずです。
ダイナミックな動きで人目を惹く、そしてその先どうするのか?重要なのはここです。
エフェクトにこだわり抜いて、他にはない動きをするパララックスデザインのサイトを作っても「面白い動きのサイトだったなー」で終わってしまったら何の意味もありません。
昔Flashアニメーションが流行りはじめた頃、Flash、Flash言うクライアントを揶揄して「子猫みたいですよね」と代理店の方が言っていたのを思い出します。とりあえず動く物に飛びつくという…。それではいけないわけです。
きちんとユーザーに何を感じさせたいのか、どんな行動を取らせたいのかを決めて、それに基づいて設計しましょう。

最低限のユーザビリティを

スクロールすれば動きがあるパララックスですが、中にはそのスクロールに気づけないような、不親切なサイトもあります。
一画面で完結しているように見えて、どこもクリックできない。よく見ると、小さく↓の矢印が…
または、スクロールで発動するトリガーが遅く、数回まわして初めて動きがある…と言ったサイトもあります。
せっかくこだわりの動きを作ったのに、ユーザーに気づいてもらえなかったらお終いです。
↓の矢印を上下に動かすアニメーションを付ける、ちょっとだけ自動でスクロールさせるなど、スクロールを促す仕掛けをきちんと付けて、サイトを訪れたユーザーが確実に見てくれるようにしましょう。
また、長大なスクロールを項目毎にショートカットするナビゲーションも必要です。
最近のパララックスサイトにはほとんど付いていますが、これが無いとホイールを延々と回し続けなければなりません。

「パララックスは、ユーザビリティが良くない」という事を念頭に置いて、ユーザーが不自由することなく操作できる仕組みをきちんと設けることが重要です。

0

サイトの骨格、ワイヤーフレームとは前のページ

紙媒体のものから電子○○へ次のページ

ピックアップ記事

  1. 新しい販売形態であるDtoCについて考えてみる
  2. 大手企業も注目するMaaS(Mobility as a Service)とは何か…
  3. AIに求められているものは、実は意外な物だった
  4. 新型コロナウイルスで日本の働き方改革が起こる

関連記事

  1. Web関連

    今さら聞けない「WEBの出来ること(活用メリット)」とは?

    今回は、WEB担当者の方向けではなく、主に他媒体担当者の方へ向けたコラ…

  2. Web関連

    ECサイトの売上を向上させたい 第2回目

    連載第2回目の今回は、「ポイントはひとつ!効果にこだわれ!」について触…

  3. Web関連

    デジタルコンテンツをカード化するサービス conca(コンカ)とは

    ちょっと前の話になりますが、2015年7月7日に、とあるサービスがオー…

  4. Web関連

    Webサイト売上げアップに使える”行動心理学” その3

    さて今回も、「良いUI、特に良いUXを提供しようと考えると、当然利用す…

  5. Web関連

    ウェディングトレンドとマーケティング

    こんにちは。ジューンブライドという言葉がありますが、私は5月・6月と友…

  6. Web関連

    3つの事例から考える共創マーケティングとは?

    昨年より共創マーケティングという言葉を良く聞くようになりました。共(と…

おすすめ記事

最近の記事

  1. 人間拡張×AIで非接触なデジタル化を推進する
  2. ヘルスケアはAI先生にみてもらう時代
  3. withコロナは非接触技術で生活しよう!
  4. デジタル接客+AIで非接触を推進する
  5. 遠隔診療や遠隔医療普及のポイントはAIと5G

アーカイブ

  1. サービス・新技術

    自粛中も暇を作らず楽しく過ごす!今満足できる毎日の過ごし方
  2. Web関連

    新しい販売形態であるDtoCについて考えてみる
  3. Web関連

    採用希望者数を増加させたい
  4. AI関連

    人が対応するのが正しいの?DX(デジタルトランスフォーメーション)へ移行しないと…
  5. Web関連

    WEB制作・システム開発と迷惑メール対策について
PAGE TOP