Liquid Glass Hydration

Water Reminder App UI Template

Dewdrop is a hydration-tracking app design with a frosted liquid-glass look, built for founders and designers shipping a water reminder product.

Dieses Template nutzen

Water reminder app home screen with a living-glass vessel filled to 58 percent and Log Water button

Water reminder app log-a-drink sheet with drink type cards and portion stepper

Water reminder app reminders screen with interval, time window, and sip pace selector

Screens erkunden

Sehen Sie das water reminder-Mobile-App-Design in der Vorschau, vollständig editierbar in Sleek.

InsightsScreen 4

HistoryScreen 5

ProfileScreen 6

Über Water Reminder App

Dewdrop is a water reminder app UI built around a "Liquid Glass Hydration" aesthetic: a soft mist-white base, deep-aqua ink, and a cyan-to-teal gradient reserved for water fills and primary actions. Surfaces read as frosted-glass panels floating over a faint water wash, with wide tonal capsule buttons and a floating pill dock at the bottom. The signature is a tall living-glass vessel on the home screen that fills with cyan water as intake is logged, with a percentage floating inside.

The template ships six connected screens that form a complete hydration flow: a Today home with the living glass at 58% and a "Log Water" button, a Log a Drink sheet for choosing water, coffee, herbal tea, or sparkling with portion steppers, a Smart Nudges schedule for reminder intervals and sip pace, an Insights view with a goal ring and hydration-by-hour bars, a History screen with weekly bars and a 12-day streak, and a Profile with weight goal, daily goal, units, and Apple Health sync.

Use it in Sleek and make it yours: restyle the palette, edit any screen with AI by describing the change, and add the flows your product needs. Then export it to code, copy it into Figma, or hand a prompt to an AI agent to build it for real, a far faster start than a blank canvas.

Enthaltene Screens

Today

A home screen with the oversized "1,450 / 2,500 ml" intake number above a living-glass vessel filled to 58%, plus a cyan-to-teal "Log Water" capsule. The at-a-glance daily progress that keeps users sipping.

Log a Drink

A sheet asking "What are you sipping on?" with drink cards for Water, Coffee, Herbal Tea, and Sparkling, each tagged with a hydration multiplier, plus a portion stepper and a "Confirm Log" button. Makes logging any drink quick and accurate.

Smart Nudges

A reminder schedule with an Active Hours toggle, interval (every 90 min) and time window controls, a Sip Pace selector (Chilled, Steady, Intense), and a timeline of upcoming nudges. The heart of the water reminder experience.

Insights

A "Your Insights" view with a hydration goal ring at 58%, logged and remaining figures, and a hydration-by-hour bar chart. Surfaces patterns like drinking most before noon.

History

A trends screen with a 12-day streak badge, a 2,180 ml daily average, weekly bars for the last 7 days, and a monthly report link. Shows long-term hydration habits at a glance.

Profile

A profile with the user's name and Premium tier, a health profile for weight goal, daily goal, and units, plus Apple Health sync and reminder sound settings. Where users tune their hydration targets.

Wichtige Features

Liquid Glass Hydration aesthetic: mist white, deep aqua, cyan-to-teal fills
Signature living-glass vessel that fills as intake is logged
Frosted-glass panels with soft 28px corners and no hard shadows
Floating pill navigation dock with a glowing active icon
Drink logger with hydration multipliers and portion steppers
Smart reminder scheduling with interval, window, and sip-pace controls
Insights goal ring and hydration-by-hour bar chart
History view with weekly bars, daily average, and streak badge

Für wen es ist

Founders validating a hydration or water-tracking app MVP

Product designers needing a polished water reminder UI starting point

Indie developers building a wellness or habit-tracking app

Health-tech teams prototyping a daily-intake experience

Was Sie bauen können

Launch an MVP for a water reminder or hydration app
Mock up screens for an investor or stakeholder pitch
Hand a consistent hydration UI off to developers
Explore a redesign of an existing wellness tracker

So nutzen Sie dieses Template

1
Template öffnen
Stöbern Sie in den Screens und sehen Sie das komplette Design in der Vorschau, um zu prüfen, ob es zu Ihrer Idee passt.
2
Dieses Template nutzen
Öffnen Sie mit einem Klick Ihre eigene, vollständig editierbare Kopie in Sleek.
3
Mit KI bearbeiten
Palette umstylen, Layouts ändern und Screens hinzufügen oder entfernen – einfach indem Sie beschreiben, was Sie wollen.
4
Exportieren und launchen
Exportieren Sie Ihr Design oder geben Sie es an Entwickler weiter, und bauen Sie weiter Richtung Launch.

Ihre Fragen, unsere Antworten. Alles, was Sie vor dem Start wissen sollten.

How do I build a water reminder app from this template?

Click "Use this template" to open it in Sleek as your own editable project, then shape it by describing the changes you want: restyle the palette, edit any screen, and add the flows your product needs. You start from six complete screens instead of a blank canvas, so you reach a working water reminder app UI far faster.

What screens are included in this water reminder app UI template?

Six connected screens: Today with the living-glass vessel, a Log a Drink sheet, a Smart Nudges reminder schedule, an Insights view with a goal ring, a History trends screen, and a Profile. Together they cover the core flow of a real hydration app, from logging a drink to tracking streaks.

Can I customize the hydration tracking UI?

Yes. Use the template in Sleek and edit any screen by chatting with the AI: change the cyan-to-teal palette, adjust the living-glass vessel, swap drink types, or rework the reminder schedule. There's no manual redraw; you describe the change and it's applied.

Is this water reminder app template free to use?

You can open and explore the design for free, then use it in your own Sleek project to build on it. Editing and exporting follow Sleek's standard plans.

Can I export the design to code or Figma?

Yes. Sleek exports your design as code, copies straight into Figma with no plugin, or hands you a ready-made prompt that an AI agent like Claude Code or Cursor can use to build it into a real, working app.

Does the template support logging drinks other than water?

It does. The Log a Drink sheet includes Water, Coffee, Herbal Tea, and Sparkling, each with a hydration multiplier and a portion stepper. You can add or rename drink types in Sleek to fit your product.

Ihre Frage ist nicht dabei? Schreiben Sie an support@sleek.design.