WEBアプリ

薬の次回の時間がわかるアプリ

Claude Code React TypeScript Vite Tailwind CSS Firebase API Docker/ GitHub
TARGET
ターゲット
・決まった時間・間隔で薬を飲む必要がある人と、その家族 ・飲み忘れを防ぎたい高齢の方など
PURPOSE
目的
・痛み止めのように「何時間おき」といった間隔の指定がある薬を、間隔を守って飲めるようにするため ・守れないと体に影響が出ることや、飲む時間を忘れてしまう家族がいたことが背景にある
DURATION
製作期間
1週間
TECH
使用技術
Claude Code / React / TypeScript / Vite / Tailwind CSS / Firebase / API / Docker/ GitHub
DESIGN
デザインの意図
病院では高齢の患者が多く、同じような需要があると考えた。 そのため項目は必要最低限にしぼり、操作をできるだけシンプルにした。 初めてでも迷わないよう、最初の画面に操作手順を置いている。

制作エピソード

制作に関するエピソード

「飲む時間を守れるようにしたかった」

痛み止めのように「何時間おきに飲む」と決まっている薬があります。この間隔を守れないと体に別の影響が出ることもあり、飲む時間を忘れてしまう家族もいました。大切なことなので、次に飲める時間をカウントできるアプリを作りたいと思いました。

「元看護師の視点で、必要な項目を絞った」

病院では高齢の患者が多く、同じような場面での需要があると感じていました。元看護師として現場で見てきた感覚をもとに、本当に必要な項目だけに絞り、操作をシンプルにすることを意識しました。

薬の名前は、入力するだけでなく予測変換でも選べるようにし、あわせて添付文書を検索できるリンクも設置しました。調べながら記録できるようにしています。

それでも「使い方が分かりにくい」という声があったため、最初の画面に操作手順を置きました。初めて使う人でも迷わないようにしています。

「初めてのログイン機能設置」

カウントした時間と薬の名前が履歴に残るような機能、薬の副作用が出た場合や、体調の変化などを記録できるようなメモ機能を入れたいと思っていました。

履歴を残すアプリを使ったことがなかったので初めての試みでした。
ブラウザでの保存機能に加えて、Firebaseを使ってGoogleアカウントでログインして履歴を残せるようにしました。どれも勉強になりました。

「通知機能はアプリ化のときに」

飲む時間の通知機能を入れたかったのですが、ブラウザでの実現が難しく苦労しました。

画面を開いている状態でないと通知が来ないため、今後アプリ化できたときに付ける予定です。

作品一覧へ戻る