Cylo product hero shot

Cylo

Cycle and wellness tracking, made simple.

  • Role:

  • UX/UI Design
    Product Strategy
    Design System

  • Category:

  • Health & Wellness App

  • Timeline:

  • 5 to 7 weeks

  • Tools Used:

  • Figma
    Prototyping

Role: UX/UI Design, Product Strategy, Design System

Category: Health & Wellness App

Timeline: Case Study

Tools Used: Figma, Prototyping

Project Overview

Cylo brings cycle tracking, symptom logging, reminders, and wellness insights into one calm app.

Explore the designs ↓

Key Features

  • Cycle, mood, and symptom tracking
  • Hydration and medication reminders
  • Personalized insights and wellness content
  • Customizable light and dark dashboards

Problem Statement

Cycle and wellness tracking is often scattered across apps, making daily logging harder to maintain.

Challenge

Unify cycle and habit tracking in an experience that feels simple, supportive, and easy to use every day.

Design Process

Research

Reviewed leading cycle tracking apps to identify gaps in habit tracking, personalization, and usability.

Research competitive analysis grid comparing features, design, and user experience of top period tracking apps

Finding: Users need flexible tracking without a cluttered interface.

Define & Ideate

Plan a modular dashboard with quick logging, clear cycle visuals, and contextual reminders.

User Flow

Connect onboarding, daily tracking, reminders, and insights in a clear flow.

user flow diagrams mapping out onboarding, tracking, insights, and reminders flows

Design & Prototype

A soft palette, clear type, rounded components, and light and dark themes create a calm, accessible interface.

Design system elements and prototype screens

Key Screens

Onboarding Onboarding screen with cycle tracking and habit selection in light mode
Dashboard Dashboard screen with cycle tracking and habit insights in light mode
Calendar & Reminders Calendar screen with cycle overview and reminder settings in light mode
Content & Insights Content screen with educational resources and insights in light mode
Profile Profile screen with user information and subscription management in light mode
Settings Settings screen with app preferences and account management in light mode
Prototype Prototype screen showing interactive elements and user flows in light mode

Testing

Feedback favored quick logging and visual cues, so I simplified input steps and clarified navigation.

Reflection

A modular dashboard and timely reminders make tracking more flexible. Future work could add deeper insights and personalization.

Cylo Web Platform

The web platform brings Cylo’s cycle and wellness insights to a larger screen, with clear dashboards and easy navigation.

Web dashboard view Web login view Web community view Web articles view

Final Result

Cylo combines cycle tracking, daily habits, and personalized insights in one calm experience.

Back to top ↑

More Projects

Keep exploring a few other case studies and visual design projects.