The Problem

People often forget to drink water regularly, leading to severe dehydration.

More than 500,000 people are hospitalized in the US each year, 2% of which die in the hospital, according to Everyday Health.

That adds up 10,000 people yearly!

User Research

Hydrolink targets a market segment defined by psychographics rather than a particular demographic.

Individuals who value aesthetics and living a premium lifestyle are the primary target audience. Adjacent personas such as fitness enthusiasts and health-conscious consumers may also be attracted to the product, although we anticipate at a smaller respective proportion.

User Interviews

We interviewed 9 people from our circles (family, friends, coworkers and teachers) to gather insights about our product. Here’s what we asked them:

1. Do you drink enough water throughout the day?
2. Do you keep track of your water intake? If so, how?
3. What are your initial thoughts on this idea? Do you have any comments/suggestions?
4. Let’s say we have the product today. How likely would you be willing to buy it, and how much would you be willing to pay for a product like this?

Personas and User Stories

And here are some key insights we uncovered...

A positive reception to the product concept

Emphasis on the need for reminders and ease of use

Budget wasn’t as big of an issue as expected

Our Competition and the Gap

None of our competitors have the customizable aspect.

Hydrolink is uniquely positioned to take advantage of a whitespace in the market. While some competitors already provide similar core features, Hydrolink is a universal lid solution and does not limit the customer by requiring the purchase of a complete water bottle.

LUCY Smart Cap

$129.00

HidrateSpark

$64.99

Water.io

$99.99

• Hydrolink is uniquely positioned to take advantage of a whitespace in the market. While some competitors already provide similar core features, Hydrolink is a universal lid solution and does not limit the customer by requiring the purchase of a complete water bottle. The compatibility with popular brands such as Hydro Flask and YETI makes Hydrolink more versatile and appealing to potential consumers who already own reusable water bottles, as they can make their existing product into a smart one with a simple lid.
• By providing essential features within the smart lid itself, Hydrolink eliminates the need to produce a complete water bottle and can consequently offer the product at a fraction of the price of prevalent water bottle products. At an anticipated price point of $35 per smart lid, Hydrolink is significantly more affordable than existing water bottles on the market. This cost-effective price point makes Hydrolink more accessible to a broader consumer base, providing a reasonable solution in the face of expensive existing options.

My UX Design Process

Armed with the main requirements and user pain points, I got to work on the key aspects of our MVP.

In order to ship within a reasonable time frame with very limited resources, we adopted a mobile-first approach.

Some key constraints

• Reduced complexity with interactions, given our technical constraints frontend-wise.
• Mobile-only screens
• Keep number of screens and their content minimal. Communicate just enough to convey the product’s value.

How Might We's (Key Challenges)

1. How might we present our product to new users?
2. How might we create a smooth sign up experience?
3. How might we integrate an AI chatbot that would put words on the numerical insights presented by Hydrolink?
4. How might we present an overview of our hydration levels as well as key device information in a digestible way to our users?

Low-fi wireframes

Before diving head-first into our mockups, we brainstormed some ideas about the overall functionality of the Hydrolink UI that answer the four questions outlined above.

“Everything Should Be Made as Simple as Possible, But Not Simpler” - Albert Einstein.
The interface is the simplest it can be - as in, conveys everything the user needs to know with as little content on the page as possible.

• Homepage: Hydrolink’s landing page of our web app, the most likely entry point of new customer: this is where they get an overview of what Hydrolink is and its brand.
• Authentication: Login/Sign up forms. User logs in to their Hydrolink account to access their stats.
• Dashboard: once logged in, the user gets an overview of their hydration level (feedback in the form of a notification), a device configuration menu in the form of an accordion. Given the simplicity of the product, I didn’t feel the need to allocate a different page just for “My Hydrolink”, so all the key information (whether modifiable or not) is contained within 1 UI element.
• Ask Hydro AI: our AI Chatbot that gives qualitative insights on your water intake, points you to resources and assists you with configuring your device.

Information Architecture

Public (Not Logged In)

Private (Logged In)

Reflections & Key Takeaways

What I’d do differently next time...

Although were were very tightly constrained by time and other priorities, I learned through the process of designing Hydrolink’s user interface the following:

1. Prioritize native mobile platform over web: for an overall better user and customer experience, this would’ve opened up opportunities for notifications, sounds, haptics, and all kinds of native interactions for iOS and Android users alike. Hydration is something that you monitor multiple times a day, and so just like most of our target users are active and regular users of social media, Hydrolink being added to the list of their most frequently opened apps would make the overall user flow feel better.
2. More user testing! Although we have recognized that the market has a need for a smart water bottle lid, and that preliminary customer interviews have been conducted, further user testing is necessary to evaluate the physical product and the interface’s usability.
3. More documentation. Despite long hours of working on this project in Figma, I found myself not articulating enough about my design decisions, and focusing on creating pixel-perfect mockups rather than taking as many thoughtful design decisions as possible given time constraints.
4. Prioritize designing the onboarding flow. Once we were able to finalize a landing page and a dashboard, we had to shift our focus to the actual flow of connecting a new device to a user’s hydrolink account. Onboarding should have been given more focus.
5. You didn’t fail-you just found 100 ways that didn’t work. From noticing mistakes to uncovering more foundational UX mistakes in my app (such as accessibility & contrast issues), I’m thankful to have constantly asked for feedback from my peers and constantly seeking knowledge to learn about tried and tested UI/UX strategies.

See my other projects...