Parents' medication butler · refill and dose reminders

Disclaimer: The content shown on this page is all generated by AI models and is for reference only; it does not constitute any guarantee of results. Actual output and Credits consumption are subject to "Usage Details" in the console.

The hardest part of managing medication for your parents isn't "taking it on time" — it's that each medicine can be prescribed for a different duration. Some are only covered by medical insurance for two weeks at a time, others for three, and children have to remember which day each medicine runs out and rush to the hospital before it's gone. Write the real-world pain points together with the desired interface into the prompt, and the model directly produces a single-file web app you can use long-term: check-ins automatically deduct inventory, it accurately computes the run-out date, merges similar refill dates into one hospital trip, and exports a .ics to your phone calendar that rings on time. Call chain: qwen3.8-max → single-file HTML app (medication management + dose check-in + remaining-stock warning + trip merging + .ics export). Key division of labor: all dates and inventory are computed by deterministic JS; the model is only responsible for writing the program, never directly calculating medication-related dates.

Actual output

Walked through with three chronic-disease medications, the single-file app's dual views (both are clickable to try out):

Elder view (default): large fonts, grouped by time slot, tap "Taken" to check in

Family view: run-out date / suggested refill date / merged trip

Click to try it out: Parents' medication butler

Steps: give the feature requirements and the desired interface look together

Send the feature requirements to qwen3.8-max:

Help me build a "parents' medication butler" web app, a single HTML file that works by double-clicking, for me and my dad to use.

Background: My dad takes several chronic-disease medications at the same time and often forgets to take them. The trickier part is that the quantity medical insurance covers per prescription differs for each medicine (some two weeks, some three weeks), so I have to remember when each medicine is about to run out and rush to the hospital before it runs out. I often can't keep track and either run out of medicine or make a wasted trip.

## Feature requirements
1. Medication management: drug name, dose per time, times per day, dosing time slots (morning/noon/evening/bedtime), before/after meals, remaining tablets, maximum tablets covered per insurance prescription; stored in localStorage locally.
2. Automatic calculation (must use precise JS calculation, no estimation): days it can last = floor(remaining tablets ÷ (dose per time × times per day)); projected run-out date = today + days it can last; suggested refill date = run-out date minus 3 days.
3. Trip merging: suggested refill dates within 3 days of each other are merged into one trip, taking the earliest date, e.g. "August 25, suggested one hospital visit to refill: amlodipine, metformin".
4. Daily check-in: grouped by time slot, ticking automatically deducts remaining tablets, no double deduction on the same day.
5. Dual view: the "Elder view" only shows what to take today, with large fonts; the "Family view" shows remaining days, run-out date, and refill trips.
6. Calendar export: split into two .ics files — "medication reminders for the elder" contains only the daily repeating medication events, "my refill reminders" contains only the refill trips; RFC5545 compliant, Asia/Shanghai timezone, no garbled Chinese. The UID of refill events should not contain a date, so that when the refill date changes and you re-import, the calendar updates the same reminder instead of adding a new one.

## Other
- Pure-frontend single file, references no external resources, works well on mobile, data stored locally only and never uploaded
- The page must state: this tool only provides time reminders and offers no medication advice; follow the doctor's prescription and the drug instructions

Appendix: the Design spec section in the prompt (determines how the interface looks, can be copied directly)

## Design spec (please follow strictly, equally important as the features)
Use only this set of color variables, do not introduce other colors:
--bg:#f7f7f5 (solid color, no texture/grid/dot pattern/gradient) --card:#ffffff
--ink:#1c1917 --sub:#6f6a63 --line:#e8e5e0
--accent:#1a56db (the only accent color) --orange:#c2410c (used only for warnings)
- Use only one system-ui sans-serif font family; serif fonts and italics are forbidden site-wide
- Color semantics must be correct: few remaining days = orange warning; plenty of days = neutral gray; do not use green to indicate urgent
- Only one primary button on the whole page (solid blue background); the rest use white background with a thin border; make the view switch a segmented control instead of two large buttons
- Don't stack multiple banners at the top: merge the safety statement and privacy note into one line of small text at the bottom
- Dosing time-slot labels all use the same light-gray background; don't give each slot a different color
- Plenty of whitespace; information laid out vertically as "label on top, value below"; don't cram into dense tables
- Numbers use large font size + font-variant-numeric: tabular-nums; units in small, de-emphasized text
- Overall feel references Linear / Notion: clean, spacious, single accent color, zero decoration

Generating a complete program is a long-output task; thinking and output dominate the consumption, noticeably higher than ordinary Q&A. When tweaking details later, bring the existing code into context for targeted fixes — that's cheaper than rewriting the whole thing and won't break the parts already tuned. The rhythm of using it: One-time — let the model generate the program, enter the medication list, and import the two calendars into your phone for the first time; Daily — the elder opens it and taps "Taken", and the remaining tablets auto-deduct; After each hospital refill — update the remaining tablets and re-export "my refill reminders" once (because the refill date gets recomputed; the calendar updates the same reminder instead of piling up duplicate stale reminders).

View actual output · What it computed for you

[Three preset medications, results computed by the program]

  Medication           Remaining  Daily dose   Lasts   Run-out date  Suggested refill date
  Atorvastatin calcium  10 tablets 1 tablet × 1 time  10 days  Aug 17        Aug 14
  Amlodipine besylate   21 tablets 1 tablet × 1 time  21 days  Aug 28        Aug 25
  Metformin SR          45 tablets 1 tablet × 2 times 22 days  Aug 29        Aug 26

  (45 ÷ 2 = 22.5, floored to 22 days; the dates above each match independent verification)

[Auto-merged into 2 hospital trips instead of 3]

  Aug 14   Go refill: Atorvastatin calcium (insurance max 28 tablets per prescription)
  Aug 25   Refill both at once: Amlodipine besylate, Metformin SR
           8/25 and 8/26 are only 1 day apart → merged into one trip, taking the earlier day, neither medicine runs out

[A check-in triggers the whole chain to recompute]

  Tap "Bedtime · Taken" once → remaining drops from 10 to 9 tablets → lasts 9 days
  → run-out date moves up to Aug 16 → suggested refill date moves up to Aug 13
  → the hospital trip and exported calendar update in sync; it's not a static table

[Export two calendars, each to its own phone]

  Medication reminder-for elder.ics    4 daily repeating reminders, ring 5 minutes before dosing
  Refill reminder-for family.ics       2 refill trips, ring at 9 AM the day before the refill date

  Splitting into two is so that: the elder won't receive "go to the hospital for a refill" that isn't their concern,
  and you won't be bothered by 4 daily medication reminders.

Notes

Consumption: This playbook involves text generation + deep thinking (qwen3.8-max), producing a 37 KB complete app. Generating a complete program is a long-output task; thinking and output dominate consumption, noticeably higher than ordinary Q&A. When tweaking details later, bring the existing code into context for targeted fixes — that's cheaper than rewriting the whole thing and won't break the parts already tuned.
Medical boundary: This playbook only provides time reminders for dosing and refills, and offers no medication advice; drug names, doses, and dosing methods are all subject to the doctor's prescription and the drug instructions, and entered results must be manually reviewed by family. Data is stored only in the browser locally and never uploaded to any server.
Deterministic calculation: A wrong run-out date leads to actually running out of medicine, so the prompt explicitly requires "use precise JS calculation", having the model produce deterministic code rather than directly giving answers — all the dates above are computed by the generated program and each matches independent verification.
How to import the calendar to your phone: Email the .ics to your phone and tap to add it (iPhone supports it natively; on Android, use a mail app to open the attachment — tapping it directly in WeChat often won't open).
Whether the interface looks good depends on whether you said it: The first version only gave feature requirements, and the produced interface had a dark-green title bar with a dot-pattern background and seven or eight colors mixed together; after writing the color, font, hierarchy, and whitespace rules into the prompt and regenerating, the same features yielded the look shown in the image above.

​Actual output

​Steps: give the feature requirements and the desired interface look together

​Notes

Actual output

Steps: give the feature requirements and the desired interface look together

Notes