ディスカッション (11件)
全てのフレームで完璧な一致を目指す。この究極の精度をどう実現するか、技術的なアプローチを探求します。
共感できる部分はあったけど、ポジティブな例も見たかったな。記事のトーンは愚痴っぽくはなかったけど、UI構築について詳しくない自分としては、読後も「North Star(目指すべき指針)」が何なのか、いまいちピンとこなかった。
完璧なフレームだけのUIなら、そりゃもっと気持ちいいだろうね。でも、紹介されてる各クリップを修正して、実際どう見えるべきか提示してほしくなったよ。あと、そもそも「すべて」にモーションが必要なのかな?僕の理解では、モーションはアクションが発生した場所とは別の領域でUIが微妙に変化する場合(トースト通知など)に使うべきものだと思ってる。大半のトランジションは不要で、即座にリフローしてパッと切り替わる方がずっとスッキリするんじゃないかな。
後で完璧なフレームになるくらいなら、今の不完全なフレームのままでいい。UIにおいてレイテンシは最優先されるべき。レイテンシが低ければ体の一部のように感じられて、認知負荷も減るからね。アニメーションは、何百ミリ秒ものレイテンシを追加してしまうから、この点に関しては特に厄介なんだ。
アニメーションがまったくないアプリなんて、使い勝手が最悪だよ。Androidなら開発者オプションでアニメーション倍率を0xにできるから試してみて。一瞬で画面が切り替わるのはかなり違和感があるし、脳が何が起きたのか処理するのに一瞬かかるんだ。その処理時間の方が、アニメーションがある場合より結局遅いんじゃないかな。僕は0.5xに設定してるけど、これで十分。速いし、アプリの開閉動作もちゃんと目で追えるからね。
「良い」アニメーションって、すべてのフレームで完璧に見せるより、動きの中である程度「ズル」をするのが普通じゃないかな。アニメで使われる「スマア(動きを速く見せるための歪んだ中間画)」みたいに、一時停止すると変な形だけど、全体を通してみると動きを自然に見せる、みたいな。
著者が挙げた例の中にひどいアニメーションがあることには同意するけど、記事の前提には納得いかないな。コンピュータグラフィックスは、人間の視覚システムの特性をどう活用するかがすべてなんだ。僕らは静止している時と動いている時で物の見え方が違う。静止画で「間違っている」フレームが、リアルタイムの文脈では最高に見えることは十分あり得る。スクリーンショットを切り出して粗探しをしても、実際の照明環境でユーザーがどう見ているかまでは捉えきれないよ。映画で例えるなら、激しい追跡シーンの各フレームはモーションブラーで変に見えるかもしれないし、広角レンズを使えば歪んで見えることもある。でも、映画館で狙った芸術的効果が得られるなら、それは正しい選択なんだ。
ネガティブな例ばかりじゃなくて、ポジティブな例もいくつかあると良かったな。これだと「とにかくアニメーションを避けるべき」と受け取られかねないけど、著者が本当に言いたかったのはそんなことじゃないと思うんだけど。
解決策の例も載せてほしかったっていうコメントをいくつか見かけたけど、僕も最近これと似たような記事を書いたよ。この記事と同じくアニメーションの問題点も挙げつつ、それをどう改善したかも細かく書いた。興味があれば見てみて。https://www.thisischris.dev/projects/project-6/
いまだにSonomaを使ってるデバイスがあるんだけど、正直言って「どんどん退化してる」としか言いようがない。保存ダイアログは多少揺れるけど、記事にあるほど混沌とはしていないかな。Notesのボタンもペイン間を完璧でシームレスに移動する。Safariのバーにフォーカスを当てたり外したりするとたまにグリッチが発生するけど、カーソルはテキストと完璧に同期してるし、テキストが左に移動し終わってからフェードインするしね。プレビューのバグも最近のせいかな、再現できない。昔のAppleやSony、IBMが細部までこだわっていた頃が恋しいよ。特にAppleはiPhoneのおかげで今の評価を築いたわけだけど、iPhoneは当時のWindows MobileやSymbianに比べて機能面で遅れていたし、決して特別じゃなかった。でも「使い始めて数分で壁に叩きつけたくならない」という点だけは優れていたんだ。今のUIアニメーションは、あの頃のWindows MobileやSymbianの嫌な雰囲気を感じさせるよ。スティーブがOSXのアニメーションをステージで何回もスローモーションで流して喜んでいたのを覚えてる?今の担当者たちが同じものを作ったら、あの時のiPhone 4のアンテナ問題の担当者と同じ運命を辿ることになるだろうね。
いろいろ思うところがある。まず、この議論は根拠が弱い。著者はより優れた代替案も提示していないし、なぜ提示された例がユーザーにとってネガティブなのかも説明できていない。スマアフレームやトランジションのポイントを指摘するだけの中身のない批判に終始しているように見える。あと、「すべてのフレームに意味がなければならない」という主張も現実的じゃない。ウィンドウのリサイズ中にどうやって全フレームを完璧に保つのか、著者に聞いてみたいよ。著者自身も、指摘してるような「欠陥のあるフレーム」を自分ではどうにもできていないんじゃないかな。ブログのヘッダーリンクをクリックしてみてもアニメーションはクリック完了後に動くし、自身のUIプロジェクトを見てもテキストやオブジェクトはコンテナに収まっていない。これだけ高尚な原則を説くなら、まずは自分自身で体現して見せるべきだろう。結局、これは中身のない批判だと思う。もっとまともな記事なら、なぜそれがエンドユーザーにとって悪いのか、どう改善すべきかをしっかり解説しているはずだよ。優れた批判というのは、単に「何が悪いか」だけでなく、「なぜ、どうやって」という中身を伴うべきだ。