カルーセルとユーザビリティー

カルーセルとは?

カルーセル[carousel](バナー/パネル/スライド)とは、
複数画像を左右にスライドさせることで表示させる展開(回転)構造を持ったWebコンポーネントです。


スマートフォンが登場した黎明期から、
カルーセルはナレッジと予見が必要な敷居の高い機能であった為、PC/スマフォでの使用には賛否がありました。
特に最終スライドまでの認知は、構造上少なくなっていく傾向は止むを得ません。 read more

UIとアニメーションの関係②

必要最低限の機能は揃っていてもアニメーションが一つもないアプリケーションがあった場合、機能面では問題がなくともUI/UX的には優れているとは言えません。 もしそのようなアニメーションのないアプリが存在した場合、あらゆる動作は唐突で、自分が現在どのページにいるのか?どのページから何を呼び出したのか?など、全ての動作にストレスが生じます。UIにアニメーションを取り入れる事で表示に順序が生まれ、目で追うことのできない唐突な動きを削ることができます。このようにアニメーションはユーザーとOSの対話をスムーズに行うための重要な役割を担っています。

ここまでは前回の記事でご説明した通りですが、アニメーションの役割はOSとの対話をスムーズにするだけではありません。アニメーションを使用して楽しさを演出することで印象に残るUXにする事が可能です。
例えばSNSでハートの形をしたグレーのいいねボタンがあった場合「押した直後にピンク色に切り替わる」場合と「押した直後にハートの周りにキラキラした光が浮かびハートが動きながらピンク色に切り替わる」場合では、後者の方が印象に残りやすくなります。コレはいいねと言うポジティブな動作に合わせたアニメーションだからです。大げさに言うと動作と感情に合わせたアニメーションだからです。
また、アニメーションはユーザーの楽しいという体験に影響を与えるだけではなく、ネガティブな動作のストレスを和らげたり、ポジティブな印象に変えることができます。視覚的に楽しければ、ユーザーは印象深く質の高いUI/UXと判断するでしょう。 read more

シネマグラフ

シネマグラフってご存知ですか?
映画の何かかなと思ってしまうかもしれないのですが、映画の業績表などではないのです。
私も何かわからなかったため、ちょっと調べてみました!!
何らかの形でデザインにも活かせそうなことがありましたので(私の主観ですが)紹介させて頂きます。 read more