親の薬の管理を手伝ったことがある方なら分かると思うのですが、「今日の薬を飲んだかどうか」の確認って、思いのほか大変です。薬の種類が多いほど混乱しやすいし、飲んだかどうかの記憶があいまいになることも珍しくありません。
市販のアプリを探してみても、使い勝手がいまいちだったり、余計な機能が多すぎたりして、シンプルなものがなかなか見つかりませんでした。そこで Rork を使って自分で作ってみたところ、思ったよりずっと実用的なものができたので、その手順を共有します。
今回作るアプリの完成形はこうなります。
- 薬の登録（名前・服用タイミング・服用量）
- 今日の服用チェック（飲んだ/まだ）
- リマインダー通知（朝・昼・夜など指定した時間に通知）
- 服用履歴の記録
iOS・Android 両対応で動くものを、コードを書かずに実装します。
まず「薬の登録画面」から作り始める
Rork を開いて新しいプロジェクトを作ります。プロジェクト名は「服薬管理」でも「Medication Tracker」でも何でも大丈夫です。
最初のプロンプトはできるだけ具体的に書くのがポイントです。
薬の服用管理アプリを作ってください。
画面構成:
- ホーム画面: 今日服用すべき薬の一覧（飲んだ/まだのチェックボックス付き）
- 薬の登録画面: 薬名・服用タイミング（朝/昼/夜/就寝前）・1回の服用量を登録できる
- 履歴画面: 過去の服用記録をカレンダーまたはリスト表示
デザイン: シンプルで見やすいもの。高齢者でも使いやすいよう文字は大きめに
データ保存: ローカルに保存（AsyncStorage使用）
最初から完璧を求めず、まずは動くものを作ることを優先します。後から細かく調整できます。
「飲んだ」チェックのロジックを調整する
Rork が生成したコードを Companion アプリで確認してみると、チェックを入れると即座に一覧から消えてしまうことがあります。これは UX として少し問題があります。消えるのではなく、チェック済みとして残しておいた方が「飲み忘れた薬がないか確認できる」からです。
この部分を修正するプロンプトを追加します。
ホーム画面の修正をお願いします。
現在: チェックを入れた薬が一覧から消える
修正後: チェックを入れた薬は打ち消し線と薄いグレー表示で残す
追加: 「今日の服用をリセット」ボタンを追加（翌日の分を確認するため）
日付が変わったら自動的に全チェックがリセットされるようにしてください。
「日付が変わったら自動リセット」の部分は、Rork が AsyncStorage に最終起動日を保存するコードを生成してくれます。実際に生成されたコードを見ると、こんな処理が入っています。
// アプリ起動時に前回の日付を確認し、日付が変わっていたらチェックをリセット
const checkDateReset = async () => {
const lastDate = await AsyncStorage.getItem('lastOpenDate');
const today = new Date().toDateString();
if (lastDate \!== today) {
// 日付が変わっていたらチェック状態をリセット
await AsyncStorage.setItem('medicationChecks', JSON.stringify({}));
await AsyncStorage.setItem('lastOpenDate', today);
}
};シンプルですが、この処理があるかないかで使いやすさが大きく変わります。Rork はこういったロジックをプロンプトで伝えると、ちゃんと実装してくれます。
ローカルストレージの活用については、Rorkアプリのデータ保存 — AsyncStorage・MMKV・SQLiteの使い分けガイドが参考になります。
リマインダー通知を実装する
これが今回の実装の中で一番「おっ」となった部分です。Expo のローカル通知機能を使えば、指定した時間に通知を送ることができます。
薬の服用リマインダー機能を追加してください。
仕様:
- 薬ごとに通知時間を設定できる（例: 朝8時、昼12時、夜21時）
- 毎日指定した時間に通知が届く
- 通知のタップでアプリが開く
- 通知のオン/オフを薬ごとに切り替えられる
使用ライブラリ: expo-notifications
注意点として、iOS でローカル通知を使うには、ユーザーに通知の許可を求める必要があります。Rork が生成するコードには通常この処理も含まれていますが、念のため確認してください。
// 通知許可リクエスト（アプリ初回起動時に実行）
const requestPermissions = async () => {
const { status } = await Notifications.requestPermissionsAsync();
if (status \!== 'granted') {
Alert.alert(
'通知が許可されていません',
'薬のリマインダーを受け取るには、設定から通知を許可してください。'
);
return false;
}
return true;
};実機でのテストは Rork Companion アプリを使った実機テストガイド を参考にしてください。通知はシミュレーターでは動作しないため、実機でのテストが必須です。
ローカル通知の詳細な実装については、Expo ローカル通知の完全ガイドで丁寧に解説しています。
服用履歴をカレンダー表示にする
履歴画面を作るとき、最初はリスト形式で作ってもらいました。でも使ってみると「今月どれくらいちゃんと飲めているか」が一目で分からないので、カレンダー表示に切り替えました。
履歴画面をカレンダー形式に変更してください。
要件:
- 月カレンダーを表示
- 全ての薬を飲んだ日: 緑のマーク
- 一部だけ飲んだ日: 黄色のマーク
- 全く飲まなかった日: 赤のマーク
- 記録がない日: マークなし
- カレンダーの日付をタップすると、その日の詳細（何の薬をいつ飲んだか）が表示される
Rork は react-native-calendars を使ったカレンダーを生成してくれることが多いです。このライブラリは Expo プロジェクトと相性がいいので、追加の設定なしで動くことがほとんどです。
カレンダーのマーク色が変わるだけで、モチベーションがかなり変わります。「今月は一日も赤にしたくない」という気持ちが自然と生まれるのが面白いところです。ゲーミフィケーションって、こういう小さなところから始まるんだな、と実感しました。
薬の種類が増えたときの工夫
実際に親に使わせてみると、薬が6〜7種類になってきて、一覧が長くなりすぎる問題が出てきました。そこで「タイミング別タブ」を追加しました。
ホーム画面にタブを追加してください。
タブ: 「すべて」「朝」「昼」「夜」「就寝前」
各タブには、そのタイミングの薬だけが表示される
現在時刻に最も近いタイミングのタブを自動で選択して表示する
「現在時刻に最も近いタイミングを自動選択」の部分がなかなか気が利いています。朝9時にアプリを開いたら「朝」タブが最初に表示される、という動作になるので、迷わずに使えます。
アプリをテストするときのチェックリスト
実機でのテストで確認してほしいポイントをまとめます。
基本動作
- 薬を登録して一覧に表示されるか
- チェックを入れると打ち消し線が表示されるか
- アプリを閉じて再度開いてもデータが残っているか
- 日付をまたいだらチェックがリセットされるか（日付を変えてテスト）
通知
- 指定した時間に通知が届くか（実機のみ）
- 通知をタップするとアプリが開くか
- 通知をオフにした薬は通知が来ないか
データの整合性
- 薬を削除したとき、関連する通知も削除されているか
- アプリを再インストールしてもデータが消えないか（AsyncStorage は基本的に残る）
アプリを削除・再インストールしてもデータが消えてほしくない場合は、Supabase などのクラウドバックエンドと組み合わせることを検討してください。ただし、服薬記録という個人情報を扱うので、プライバシーポリシーの整備も忘れずに。
実際に家族に使ってもらった感想
親に実際に使ってもらったところ、一番好評だったのが「チェックした薬に打ち消し線が残る」という部分でした。「これで飲んだかどうか分からなくなることがなくなった」と言っていました。
想定外の要望として出てきたのが「薬の写真を登録したい」という意見です。薬の名前だけでは見分けがつかないことがあるので、薬のパッケージ写真を登録できるようにしました。これも Rork へのプロンプト1つで追加できました。
薬の登録画面に写真追加機能を付けてください。
カメラロールから選択するか、カメラで撮影できるようにしてください。
写真はサムネイルとして薬の一覧に表示してください。
こういった「使っているうちに出てくる要望」に即座に対応できるのが、Rork を使ったアプリ開発の最大の強みだと思います。自分で作っているから、自分の家族の使い方に合わせて細かくカスタマイズできます。
次のステップ
今回作ったのはシンプルな個人用アプリですが、これをベースに発展させる方向性はいくつかあります。
まず、同じような課題を持っている人向けにApp Storeで公開する選択肢があります。服薬管理アプリはニーズが安定しているジャンルです。公開を考えている場合は、Rorkアプリの習慣化を助けるデザイン — ハビットトラッカーの実装から学ぶUXの考え方も参考になります。
次に、家族間で服薬状況を共有したい場合は、Supabase などのバックエンドを組み合わせてリアルタイム共有機能を追加できます。「お父さん、今日の薬飲んだ？」という確認連絡が不要になります。
今日すぐできることとしては、まず自分の服薬管理（サプリメントでも）に使えるアプリを作ってみてください。実際に自分で使うことで、「こうしたい」という改善アイデアが次々と出てきます。それが良いアプリを作る一番の近道です。
薬の管理という、地味だけど大切な課題に対して、自分専用のツールを自分で作れる。Rork を使ったアプリ開発の醍醐味はこういうところにあると思います。