最近「動かしすぎないUI」を意識してるお話

こんにちは。かずです。

自分の感覚ですが、「動きのあるサイト＝良いサイト」的な考え方が結構ありました。

・派手なアニメーション
・スクロール演出
・ふわっと出るUI
・パララックス

などなど。
実装していて楽しいですし、見た目の印象も結構変わるので、つい色々入れたくなります。
でも最近は、「動かしすぎないUI」のほうを意識することが増えてきました。

動きが多いと疲れる

アニメーションって、うまく使うとかなり気持ちいいです。
ただ、量が増えると逆に疲れることもあります。

・スクロールのたびに動く
・全部フェードする
・hoverの反応が強い
・表示がワンテンポ遅れる

こういう演出は単体で見ると良くても、積み重なると結構うっとうしいというか、閲覧に対するノイズになる気がします。
特に、情報量が多いサイトだと「見せる」より「読みやすい」のほうが大事な場面も多くありますよね。

動く理由があるかを考える

最近は、「とりあえずで動かす」を減らしました。
例えば

・視線誘導したい
・状態変化を伝えたい
・押せることを分かりやすくしたい

みたいに、意味がある動きだけ残す感じです。
逆に

・とりあえずのフェード
・とりあえずのtransition

みたいなのは、以前より減った気がします。

シンプルなUIのほうが長く使いやすい

運用が長く続けば続くほど落ち着いたUIの強さを感じます。
動きが複雑になるほど、

・修正しづらい
・追加実装で破綻しやすい
・パフォーマンス影響が出る
・更新時に違和感が出る場合がある

といった事も増えてきます。
もちろん演出が強いほうが合うサイトもありますが、コーポレートサイトや採用サイトだと、最近は特に「読みやすさ」や「ストレスの少なさ」のほうが大事だなと感じています。

ちょっと気持ちいいくらいが好き

個人的には最近の実装では以下の感じを意識しています。

・ホバーで少し変わる
・ふわっと0.3秒くらいで出る
・スクロール時に軽く動く

このくらいの、控えめなUIが好きです。
ユーザーに「アニメーションしてる！」と思わせるより、なんか使いやすいくらいのほうが自然でいい気がしています。

まとめ

前までは動かせることが楽しくてついつい色々やっちゃってましたが、最近では「どれだけ動かせるか」より、「どれだけ自然に使えるか」を考えるようになりました。

動きって足し算はしやすいんですが、引き算のほうが難しいですね。
目立つUIより、疲れないUIを意識していこうかなと思う今日この頃のお話でした。

それでは！