Case study
HydroSync mobile prototype
A React Native concept for checking hydration trends and keeping an eye on family members from one mobile flow.
The concept
HydroSync explores a simple question: how could a mobile app show personal hydration trends while also making it easy to check on family members?
The prototype was built in React Native with TypeScript and React Navigation.
Main flows
The app includes sign-up and login screens, a personal hydration dashboard, a family-member list, an add-member form, and a call screen.
The dashboard combines a progress ring with a weekly line chart. The family view gives each person a plain status such as hydrated, mildly dehydrated, or severely dehydrated, then exposes a quick route to call them.
Why the navigation mattered
The product serves two related jobs: checking your own trend and checking someone else. I kept those jobs in separate screens and used a small stack navigator rather than forcing every status into one dashboard.
That made the prototype easier to reason about and gave the call action a clear place in the flow.
Current limitations
This is a UI prototype, not a connected health product. The chart uses demonstration data, the login and sign-up screens do not have a real authentication service, and no sensor or backend supplies hydration readings.
Those boundaries are important because health-related interfaces should not imply certainty they do not have.
Next pass
I would start by defining the data contract and consent model before adding more screens. The next technical work would be real authentication, a typed API layer, accessible chart summaries, and clear error states for missing or stale readings.