『すごい習慣』アプリに仕込んだマイクロインタラクションについて語る

少し前に「すごい習慣」なるiPhoneアプリをリリースしたのですが、ささやかなマイクロインタラクションをいくつか仕込んでいます。

たまに人に見せたりするのですが、「全然気づかなかった!」とよく言われるので(涙)、ここで紹介してみることに。

このアプリでは左上にロボットっぽいキャラがいるのですが(名前はまだない)、実は地味にアニメーションしていたりします。

  • 普段はふわふわと漂っている(よーく見ると上下している)
  • 習慣を達成すると「いいね!」してくれる(サムズアップ)
  • すべての習慣を達成すると スヤスヤと眠りにつく…

気づきにくい箇所なので拡大して動画にしてみました。

なお、これらの動きはFigmaでちまちま作り込んだあとにLottieで組み込んでいます。

Figmaで地味に作り込んでいきます
Figmaで地味に作り込んでいきます

AIで誰もがアプリを作れる時代だからこそ、こうしたマイクロインタラクションの作り込みが大事なはず…。他のアプリでも細か〜いところを作り込んでいたりするので、これから少しずつ紹介していこうと思います。

「すごい習慣」アプリが気になってしまった方は詳細は以下よりぜひどうぞ(宣伝)。

App Store すごい習慣 - ダイエットも筋トレも勉強も記録して目標達成アプリ - App Store DOTINSTALL Co., Ltd.の「すごい習慣 - ダイエットも筋トレも勉強も記録して目標達成」をApp Storeでダウンロードしてください。スクリーンショット、評価とレビュー、ユーザのヒント、「すごい習慣 - ダイエットも筋トレも勉強も記録して目標達成」に似たゲームを見ることなどができます。