< />

RemisWebDesign

Hippie Cal

Hippie Cal

A mindful nutrition tracker that builds healthy relationships with food

Check Product

Check Product

Check Product

"Hippie Cal is a mobile app for mindful nutrition tracking, designed to feel different from the cold, clinical fitness apps on the market."

"Hippie Cal is a mobile app for mindful nutrition tracking, designed to feel different from the cold, clinical fitness apps on the market."

the challenge

Lost in a Sea of Games

the challenge

Breaking Free

Designing a "non-corporate" calorie tracker that feels human.

How do we build a unique brand from scratch that feels authentic and design a product that truly helps users build a lasting, healthy habit?

How do we build a unique brand from scratch that feels authentic and design a product that truly helps users build a lasting, healthy habit?

Now’s your moment — give the phone a gentle tap!

Now’s your moment — give the phone a gentle tap!

Now’s your moment — give the phone a gentle tap!

my role

From Research to Reality

Role

Product Designer

Deliverables

Brand Identity, Mobile App Design, Onboarding Flow

Timeline

12 weeks

my role

Role

Product Designer

Deliverables

Brand Identity, Mobile App Design, Onboarding Flow

Timeline

12 weeks

I joined a small, agile team (developer, copywriter, marketer) to build a nutrition app with a different philosophy.

Part 01 - The "HIPPIE" Soul

Part 01 - The "HIPPIE" Soul

Logo Design

Creating a friendly, memorable brand mascot

Building an Authentic Brand Identity

Building an Authentic Brand Identity

The visual style needed to feel organic, warm, and trustworthy. We intentionally avoided sharp edges and corporate blues or blacks, opting for a design that feels like a friend, not a corporation.

Screen

430

colums

2

margin

16px

guter

16px

Logo Design

Creating a friendly, memorable brand mascot

The logo was designed to be soft, and friendly, reflecting the app's personal and approachable nature.

Broccoli mascot makes nutrition friendly

Works across light and dark backgrounds

Works across light and dark backgrounds

Character for warmth and authenticity

Typography & Colors

Two typefaces work in harmony: Josefin Sans brings personality to headings with its geometric, slightly quirky character, while Quicksand ensures excellent readability for body text with its friendly, rounded forms.

Headings & Subheadings

Josefin Sans

SemiBold

Track Your Journey

Track Your Journey

Mindful Nutrition

Mindful Nutrition

Daily Goals

Body Text

Quicksand

Regular

Track your meals with ease and build a healthier relationship with food. Our app helps you understand your nutrition without judgment.

Track your meals with ease and build a healthier relationship with food. Our app helps you understand your nutrition without judgment.

Making every calorie count towards your wellness goals.

Making every calorie count towards your wellness goals.

Color System

The color palette follows the 60/30/10 rule—60% neutral warm backgrounds create a calming canvas, 30% dark olive text provides readability without harshness, and 10% vibrant orange accents guide user actions and celebrate progress.

Main Background

#FFEEE0

60% - Primary surface

Secondary Background

#FEF9F4

Supporting areas

Cards & Inputs

#F5F0EA

Elevated surfaces

Primary Text

#494523

30% - Body text

Accent Orange

#F6B476

10% - CTAs & highlights

Button Text

#333333

High contrast text

research analysis

Turning data into action

Part 02: The Counter-Intuitive Onboarding

Part 02: The Counter-Intuitive Onboarding

The biggest UX challenge was user retention. We made a strategic bet.

The Dilemma

Most apps aim for a 30-second onboarding. We challenged this.

A longer, more comprehensive onboarding process, where the user invests time setting up their goals and preferences, creates a stronger psychological commitment. This investment makes them more likely to form a lasting habit.

The Hypothesis

The Solution

The Solution

We designed a detailed, multi-step onboarding flow. It guides the user through every step, gathering crucial data that allows the app to be fully personalized and valuable from the very first session.

Part 03 - Bringing the Brand To Life

Finally, I created a series of high-impact visuals to showcase the app's identity in real-world scenarios and on the App Store.

Finally, I created a series of high-impact visuals to showcase the app's identity in real-world scenarios and on the App Store.

Outcome & Final

Thoughts

Outcome & Final

Thoughts

The final result is a fully-branded, high-fidelity mobile app launched and ready for its first wave of users.

The final result is a fully-branded, high-fidelity mobile app launched and ready for its first wave of users.

Personal Takeaway

This project was a fantastic lesson in challenging common UX assumptions. I learned that a "longer" user flow isn't always a "worse" one, especially if that initial time investment leads to a more personalized, valuable, and habit-forming product.

This project was a fantastic lesson in challenging common UX assumptions. I learned that a "longer" user flow isn't always a "worse" one, especially if that initial time investment leads to a more personalized, valuable, and habit-forming product.

Thanks for reading! :)

Next Project

Next Project

Next Project

Personal Takeaway

< />

RemisWebDesign

remiswebdesign@gmail.com

remiswebdesign@gmail.com

@2025. All rights reserved

My CV