ramen-timer

制作経緯

子どもとラーメンを食べるとき、「あと何秒？」という問いが何度も繰り返される場面がありました。時間の感覚が大人とは違う子どもにとって、「3分」という数字は実感を伴いにくい。ただのカウントダウンではなく、「待つことへの見通し」を視覚的・聴覚的に届けるタイマーが作れないかというところが出発点です。

開発を進めるうちに気づいたのは、発達特性（時間感覚の困難さ、聴覚過敏）のある子どもにとって、一般的なタイマーの UX がかなり不親切だということです。大きな音のアラート、突然の画面切り替え、複雑な操作 UI——これらを取り除き、「見通しがわかる、驚かない」という体験に絞り込むことが設計の核になりました。

概要

子ども向けのタイマーアプリです。PWA としてブラウザから使えるほか、React Native / Expo で iOS / Android にも対応しています。

円グラフ型の大きな進行表示で残り時間を直感的に把握できます。終了直前に予告アニメーションを表示して「もうすぐ終わる」という予兆を伝え、突然のアラートを避けます。聴覚過敏への配慮として音量調整・音なしモードを搭載し、振動フィードバックと光点滅を代替手段として組み合わせています。

技術選定

• React Native / Expo — iOS と Android を単一コードベースで対応。Expo の OTA アップデート機構により、App Store 審査を経ずに UI 修正を届けられる。
• PWA — Web でもそのまま動くよう Service Worker と manifest を整備。インストール不要で試せるオンボーディング的な役割も兼ねる。
• react-native-reanimated — フレームレートに依存しないアニメーションを実現。prefers-reduced-motion 相当の配慮として、設定から動きを抑制するオプションを用意した。
• TypeScript strict — タイマーの開始・一時停止・リセットという状態遷移を型で明示し、状態管理の誤りを早期検出する。

学び

「発達特性への配慮」は特定の人向けの特殊対応ではなく、使いやすさの本質に近いものだ、という実感が得られました。予告アニメーションは「突然終わらない」感覚を届けるために入れたものですが、特性のない子どもにとっても「おお、終わる！」という期待感になっていました。配慮が特定層だけでなく、全員にとって心地よい体験になる事例だと思っています。

音なしモードを検討したとき、最初は「音がなければタイマーとして機能しないのでは」という疑問がありました。しかし「終了を知る方法は音だけではない」と視点を変えることで、振動フィードバックと光点滅の組み合わせで代替できると気づきました。制約を外して考えると設計の幅が広がる、という経験でした。

今後の方向性

ラーメン以外のシーン（歯磨き・宿題など）向けのプリセット追加、子どもが絵を選んで設定できる UI、保護者向けプロファイル（音量・アニメーション強度のデフォルト）の実装を検討しています。TestFlight での先行試験を経てから App Store 公開を目指す予定です。