Web関連

善し悪しが2分されるパララックスデザインってどう思います?

0

企業や組織が運営するサイトにおいては致命傷にもなりかねないパララックスデザイン。
「視覚効果はバツグン」といった言葉に踊らされ、安易に導入すると痛い目にあう気がするのは
私だけでしょうか・・・
最初に申し上げておきますが、決してパララックス否定派ではございません。。。
逆に、なかなかこっている面白いサイトだな、と見るたびに感心してしまうほうの人間なのですが、やはりターゲットユーザーのニーズや利用シーンを検討して導入することが大切ですね、
というお話ができればと思っています。
インパクト性の高いパララックスデザイン。読ませるより見せる(魅せる)要素が強い表現法
ですが、見せるよさと、読ませる良さを共存させることはできるのでしょうか・・・

そもそもパララックスってなに?

パララックスデザインが出始めたのは2-3年前くらいからでしょうか。
ものの本によりますと、そもそも「パララックス」という言葉は、写真をあつかう方々が使っていたことばのようで、直訳すると「視差」といいます。
視差?
カメラのレンズから測る被写体の位置と、ファインダーから覗いた被写体の位置とでは、微妙な
差異が生じますよね。この差のことを視差というと教えてもらいました。
で、、、Webでの視差って?
Webでは、遠近感のある画像や、スクロールをすることで展開されるさまざまな動き、
モーションを使ってダイナミックに見せていく手法のことを言います。
でも、かっこいいとかだけではないのです。ストーリー性を持たせることで疑似体験を
提供できる手法でもあります!

メリットとデメリットを考えてみよう!

やはり何と言っても、その最大の魅力は表現力でしょう!
テキスト中心の表現とはくらべものにならないくらい視覚的に訴えかけてくるパララックスでは、商品やサービスが持つイメージをストレートに伝えていくことができます。
また、みなさんそうだと思いますが、知らず知らずのうちにページの最後までスクロールして
しまっていませんか?「最後までみせちゃう」のもメリットですね。
何気なく最後まで見てしまうパララックスでは、そのモーションやエフェクトが鍵を握っていますが、テキスト表現では伝えずらい世界観やストーリーという部分も訴求していけます。
一方、エフェクトが多い分、ページの読み込み速度には気を付けたいところです。
スクロールというトリガーで表現が変わりますので、スマホやタブレットでも不具合がでないかの確認もしておきましよう。

 

パララックスとUI/UX

ユーザーの想像を超えるイメージ展開も可能なパララックス。ユーザーの想像を超えるということは、ユーザーが期待する動きとは異なったモーションを展開するということにもつながります。
クリックする前にどのようなコンテンツに遷移するのかが分かったほうが(想像できたほうが)
より使い勝手が向上する(ユーザーのストレスは軽減する)一般的なWebサイトのコンテンツ展開とは異なります。
サイトを構築していくにあたり、ユーザーニーズを把握して伝えたい要素を洗い出していくというステップに変わりはありませんが、「伝えたい要素」の見せ方には最低限のサジェストがあったほうが使い勝手は担保されます。
たとえば、スクロールした際、画面が上下に動くのか左右に動くのか。多くは上下に動きますので、もしみなさんのサイトが左右の動きをするようでしたら、ユーザーがスクロールする前にそのことに気づくようなボタン設置やアナウンスが分かったほうが親切です。UIの検討ですね。
パララックスでは、「えっ、こんな動きするの!」というポジティブな共感と「分かりずらいな」というネガティブな感情は表裏一体だと思っていただければと思います。
ユーザーの年齢やWeb利用頻度などにも関わってくる課題になりますので、ペルソナをしっかりと立てて設計には十分な時間をかけていくことをオススメします。
あまりにもやりすぎてしまうとネガティブなイメージを与えてしまいかねず、UXの低下につながる恐れもあるので気を付けてださいね。

パララックスデザインのあれこれ

世界観やストーリー性を伝えやすいパララックス。
多くのサイトがありますが、私が好きな車ではどのようなものがあるのか見てみました!
自動車業界では結構な割合でパララックス化が進んでいるようです。
国内ではトヨタや日産、マツダという主要メーカーも採用していますし、海外組ではフェラーリやポルシェなども展開に積極的です。
車やクルーザー、ファッションやスポーツという嗜好性が高いものや、躍動感を伝えたいものを
中心に今後も増え続けていくのだと思います。
みなさんのサービスでもご検討されてはいかがでしょうか。

 

関連するサービス

ホームページ制作

0

デザイナーが押さえておきたいweb配色パターン前のページ

SNSマーケティング次のページ

ピックアップ記事

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

関連記事

  1. Web関連

    ARを活用したビジネス

    スマートフォンが登場してから、急速にスマートフォン用のアプリが増えまし…

  2. Web関連

    これを見ればわかる「Copyright」まとめ

    サイトを見ていると必ずと言って良いほど表記されているコピーライト、「ど…

  3. SEO関連

    グーグルアルゴリズムとSEO

    先日、「Japan IT Week春」の展示会に参加しました。昨年…

  4. Web関連

    納期が短いWebデザイン制作の時って何を考えますか?

    納期が短ければ短いほどスケジュールはパツパツで、人によっては大慌てする…

  5. Web関連

    ホームページ制作会社が紹介するweb業界のシームレス化

    シームレス化と聞いて、どのようなものか説明できる方はなかなかいらっしゃ…

  6. Web関連

    マーケ担当必見!国内ECマーケティングオートメーション(MA)事例

    マーケティングオートメーションという言葉はご存知でしょうか?O…

おすすめ記事

最近の記事

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

アーカイブ

  1. AI関連

    【人工知能(AI)×コールセンター】人工知能で顧客満足度向上と業務効率化を同時に…
  2. Web関連

    WordPressの管理画面を使いやすくカスタマイズ!
  3. AI関連

    最近、家電量販店で見かける「AI家電」ってどんなもの?
  4. Web関連

    webデザイナーなら知っておくべきwebフォントの使い方
  5. Web関連

    ついに来たか!Web制作者”だけ”が歓喜するお話し
PAGE TOP