毎年、Webデザインの業界では、ユニークなトレンドが数多く登場します。
最近で言えば、スプリットデザインやパララックスエフェクトなど、新しく登場したものからここ数年使われているものまで、あらゆるトレンドが登場しています。

しかし、トレンドが登場したからといって、闇雲にそのトレンドに乗っかってしまう前に、一度立ち止まって次のことを考えてみるのが大切です。
「本当にこのデザイントレンドを採用することでユーザーにメリットはあるのか?」
「このデザインは自己満足で終わっていないだろうか?」

もしこの質問を聞いてドキッとしたのであれば、ぜひこの先を読み進めてみてください。
というのも、トレンドを追いかけていった結果、UXが悪化してしまう場合すらあるからです。

今回は、UXを低下させてしまうかもしれない2017年のWebデザイントレンドについて、使用時の注意点とともに確認してみましょう。

使用に注意!UXを低下させてしまうかもしれない2017年のWebデザイントレンド

1. パララックスエフェクト

paralax.jpeg
※ pexels.com

Webデザイントレンドとしてのパララックスエフェクトは数年前から登場していますが、さまざまなオブジェクトが異なるスピードで動くので非常に面白い動きをするので、今でも人気のトレンドのひとつです。
最近では、その名の通り「視差効果」を表現するだけでなく、さまざまなマウスイベントを使ったスクロールエフェクトも登場しているので、こうした効果を取り入れるだけであっという間にユニークなホームページが出来上がります。

しかしながら、こうしたパララックスエフェクトは確かにクールではあるのですが、処理速度があまり早くないデバイスだと、動きが遅くなってもっさりしてしまうというデメリットもあります。
言うまでもないですが、動きが遅くなってしまえば、UXは著しく低下してしまいます。

また、たとえデバイスの処理速度に問題がないとしても、使いすぎは禁物です。
そもそも視差効果は本来そうではないものを立体的に見せているにすぎませんが、ホームページのすべての要素にパララックスエフェクトが使われていたらくどいと感じてしまいます。

あくまでも、パララックスエフェクトの利用範囲はホームページ内の一部に留めておき、デバイスの処理速度を落とすほど重い処理をかけないように心がけましょう。

2. ゴーストボタン

transparent.jpeg
※ pexels.com

ゴーストボタンは、背景が透けて見えることからその名前がつきました。
ゴーストボタン自体は、2015年頃から日本でもよく見られるようになったトレンドで、グラデーションやドロップシャドウなどもなく、外枠も1〜2pxほどで、色も白や黒などのシンプルな作りになっています。
こうしたことから、ゴーストボタンは「クリックしてもらうために、とにかく目立つように」というボタンのデザインとは、根本的に違う作りになっています。

とにかくシンプルで、デザインの邪魔にならないので、ゴーストボタンを併用する場合もあります。
しかし、こうしたメリットは、裏を返せば、シンプルすぎてデザインに馴染んでしまい、ボタンとして認識されない可能性もあるというデメリットを抱えています。

「より目立ったほうがクリックされやすい」という、従来のボタンの考え方とは真逆であるので、ユーザーによってはそもそもボタンであるということが認識できず、どうすればいいのか立ち往生してしまう場合もあります。
場合によってはクリックされないことすらあるという可能性も考慮に入れておいたほうがいいでしょう。

3. ブルータリズム

brutal.jpg
※ pexels.com

2017年上半期には、ブルータリズムと呼ばれる、既存のスタイリッシュで機能的なホームページとは一線を画す、大胆なWebデザイントレンドが登場しました。
ある種のWebデザインにおける前衛芸術のようなものと捉えることができますが、これは一部のデザイナーによる新しい表現方法であるとだけ捉えて、基本的にはブルータリズムを会社のホームページにするようなことは避けたほうがよさそうです。

構図や色使いなど、どれを取っても大胆なブルータリズムですが、ユーザビリティの観点から言えば、お世辞にも使いやすいとは言えないでしょう。
芸術作品がWebの世界まで進出してきたと考えれば面白いですが、闇雲にブルータリズムを取り入れる前に、一度立ち止まって考えてみましょう。

4. デュオトーン

duotone.jpg
※ designers free resources

デュオトーンは、2016年中頃を境に広まってきたWebデザイントレンドです。
2017年になってからは以前ほど見る機会は少なくなってきましたが、それでもデュオトーンを好んで使っているWebデザイナーもいます。

デュオトーンも、ブルータリズムほどではないですが、奇抜で斬新であるために、ホームページのユニークさやオリジナリティを演出することが可能です。
しかし、デュオトーンで使う2色の組み合わせのほとんどは、普段であれば組み合わせないであろう彩度の高い2色(水色とピンク、オレンジと緑など)が選ばれるので、目がチカチカして疲れてしまいます。

だからと言って主張の控えめな2色を選ぶとデュオトーンのよさが失われてしまうので塩梅が難しいですが、ユーザーが不快にならないような組み合わせを選ぶように心がけましょう。

5. マイクロインタラクション

interaction.jpeg
※ pexels.com

マイクロインタラクションは本来、ユーザーの操作に対して「かすかな」フィードバックをアニメーションなどで動きをつけてユーザーに伝えていくものです。
「本来」と述べたのは、そうではないケースも往々にして存在するからです。

マイクロインタラクションを実装する際には、「かすかな」フィードバックが最も望ましいのですが、そうではなく主張の激しい動きをする、もはや「マイクロ」とは言えないインタラクションが行われる場合があります。
例えば、ボタンにマウスカーソルを合わせたときにあまりにも激しく振動したり、ホバーリンクの大きさがあまりにも急激に変化したりといった具合です。

マイクロインタラクションの目的は、ユーザーのアクションに対して「認識していますよ」というフィードバックを示すことです。
その目的を超えて過剰にアピールをすると、ユーザーは目障りに感じてしまうことがあるので、避けましょう。