【第26回】触感のデザイン：ボタンの反応、画面遷移の「気持ちよさ」の作り方

これまでに学んだ技術を使えば、UIを派手に動かすことは簡単です。
しかし、デザイナーが最もこだわるべきは、派手さではなく “触った瞬間の心地よさ（フィードバック）” です。

スマホやゲーム機で、なぜか何度も触りたくなるボタンやメニューがありますよね。
その「気持ちよさ」の正体と言語化、そしてUnityでの作り方を解説します。

「Game Feel（触感）」を構成する3つの要素

ユーザーが画面上のボタンに触れたとき、脳は無意識に「手応え」を期待します。
優れたUXデザインには、必ず以下の3つのフィードバックがセットになっています。

第25回で学んだ DOTween を使い、「ただ切り替わるだけ」のボタンを「極上のボタン」にアップグレードしましょう。

ボタンを押したとき、少しだけ（0.9倍程度）小さくし、離した瞬間に1.1倍まで弾んでから1.0倍に戻る設定にします。

クリックしたとき、一瞬だけ白く光らせ（Flash）、その後ゆっくり元の色に戻るようにします。

第12回で作ったパーティクルを、ボタンが押された瞬間に数粒だけ散らしてみましょう。これが「ご褒美（Juice）」となり、触る楽しさを倍増させます。

ページを切り替えるとき、画面がパッと切り替わるのはユーザーの視線を迷わせる原因になります。デザイナーは「視線の連続性」を意識しましょう。

💡 デザイナーのアドバイス： 画面遷移の時間は 0.2秒〜0.4秒 が黄金律です。0.1秒だと早すぎて変化に気づかず、0.5秒以上だとユーザーは「遅い（重い）」と感じ始めます。

前回のライティング編と同様、UXも料理に例えると分かりやすくなります。

ボタンの反応や遷移は、料理における 「食感」 です。どんなに見た目が豪華な料理（美しいUI）でも、噛んだ時の食感がグニャグニャ（反応が鈍い）だったり、硬すぎたり（動きがカクカク）すると、美味しさは半減してしまいます。

「見た目（UIデザイン）」に「心地よいリズム（UXアニメーション）」という食感を加えることで、初めてユーザーに「満足感」というデザートを提供できるのです。

今回は、Unityで触感（フィードバック）をデザインする方法を学びました。

「動かせる」ようになった次のステップは、「どう動かせば、ユーザーの心が動くか」を考えることです。

次回はいよいよ、あなたのデザインを現実世界へ連れ出す 『AR Foundation 基礎：AR（拡張現実）のデザイン』 に挑戦します。画面の中を飛び出す体験を、一緒に作りましょう！