アニメーションの言語化

アニメーション研究会を開く。フロントエンドエンジニアのチャンカツくんの呼びかけがきっかけで、10名程度の小さい規模のアンカンファレンス形式の勉強会だ。UIデザインの文脈に限らず、幅広くアニメーションのことを深掘りしていきたい。もちろん個人的な目的はUIデザインにどう還元できるかなんだけど、たとえば映像作品やゲームのアニメーションからも参考にできることはたくさんあるだろうし、いろんな人の持っているアニメーションに対する印象や哲学を共有できたらいいなと思っている。

なぜ、いま、アニメーションなのか

今まで様々なWebサイトやWebアプリケーションにアニメーションを施してきた。インタラクションに始まり、雰囲気づくりや賑やかしのアニメーション、カルーセルUIなどの機能に依存するアニメーション、ユーザーの視線をジャックするためのアニメーションなど。言われるがまま実装したこともあるし、考えに考え抜いて実装したこともある。理由や目的は様々だったし、枚挙に暇がない。

ただ、いろいろやってきた自負はあっても、体系的にアニメーションの効果についてまとめたことがない。なにかしらの経験や参照に基づいてその時その時で、行き当たりばったりで実装してきたので、まったく今更ではあるけれど、きちんとまとめるチャンスだと思った。

アニメーションをテキストにコンバートする

もうひとつの目的は、アニメーションの言語化を身につけること。Webアクセシビリティエンジニアをしているので、もっぱら興味はそこだ。アニメーションを言語化できれば、視覚的な情報を得られないユーザーにも同じ効果を提供できるかもしれない。画像の代替テキストをつける動機と同じだ。アニメーションをテキストにコンバートしたい。

アニメーションの言語化にあたって大切なのは、アニメーションの目的がきちんと言語化できているかどうかだ。その言語化ができていれば、つまりそれがそのままアニメーションの言語化になるはず。目的が言語化できていれば、アニメーション以外の方法での実装を検討できる(それはテキストかもしれないし、あるいは音や振動かもしれない)。

アニメーションをメリット・デメリット

アニメーションの効果はデメリットを知ることも必要だ。WCAGにはアニメーションに対する制約になりうる達成基準がある(達成基準2.2達成基準2.3など)。特定のユーザーにとって問題となる実装を避けるための達成基準だ。つまりこれらに説明される条件を満たすアニメーションはユーザーにとって問題がでてくる可能性がある。

WCAGで言及されていることに限らず、心理的にどう作用するのかだったり、文化習慣によって捉え方が変わる可能性など、様々な角度からアニメーションのメリット・デメリットを知りたい。

メリット・デメリット両方を把握した上で、目的に対して本当に有効なのかどうかバランスを取りながら採用するか判断できるようになりたい。

いろんな目的で参加してほしい

僕としてはかなり明確な目的をもって開催するんだけど、実際はかな〜りゆるゆるで進めるつもり。主観の意見も歓迎だし、「GIFアニメが好きだ!これがオススメ!」でも全然構わない。みんなで楽しく情報共有や意見交換ができる中で、僕はゆっくりアニメーションについて言語化する方法を探っていこうと思う。

この記事が気に入ったら、サポートをしてみませんか?気軽にクリエイターを支援できます。

4

平尾ゆうてん

本名: 平尾優典。福岡のWebアクセシビリティ/フロントエンドエンジニア。㈱ディーゼロ。所謂ホームページ屋さん。Webにインクルーシブな未来を夢見てる人。 BurgerEditor/jaco.js/markuplint開発者。
コメントを投稿するには、 ログイン または 会員登録 をする必要があります。