PROFILE: MAKING PROGRESS FEEL REAL

PROFILE: MAKING PROGRESS FEEL REAL

Users often go through lessons and exercises every day — but that effort can feel invisible over time. The Profile page is designed to make that effort visible, trackable, and meaningful.

Users often go through lessons and exercises every day — but that effort can feel invisible over time. The Profile page is designed to make that effort visible, trackable, and meaningful.

A Quick Glance at the Journey

A Quick Glance at the Journey

Right at the top, users get an instant sense of:

  • how long they’ve been learning

  • how many lessons they’ve completed

  • their current level/tier

  • streak and XP

Right at the top, users get an instant sense of:

  • how long they’ve been learning

  • how many lessons they’ve completed

  • their current level/tier

  • streak and XP

answering a simple but important question: “How far have I come?”, without needing to dig into details.

answering a simple but important question: “How far have I come?”, without needing to dig into details.

Progress That Shows Consistency, Not Just Numbers

Progress That Shows Consistency, Not Just Numbers

The progress chart is where things become more reflective.

Each bar represents a user’s daily learning activity — a combined signal based on: lessons completed, practice sessions and review activity - instead of showing raw time or just XP because if it doesn’t guide the user, it shouldn’t be there

The progress chart is where things become more reflective.

Each bar represents a user’s daily learning activity — a combined signal based on: lessons completed, practice sessions and review activity - instead of showing raw time or just XP because if it doesn’t guide the user, it shouldn’t be there

Thus keeping the focus is on: how consistently the user is showing up

Thus keeping the focus is on: how consistently the user is showing up

Weekly & Monthly — Thoughtful, not Overloaded

Weekly & Monthly — Thoughtful, not Overloaded

The chart provides two clear views:

  • Weekly view → for quick reflection

  • Monthly view → for a broader pattern

Allowing users to view previous week/month, making it easy to look back without overcomplicating things.

The chart provides two clear views:

  • Weekly view → for quick reflection

  • Monthly view → for a broader pattern

Allowing users to view previous week/month, making it easy to look back without overcomplicating things.

While designing this, a few things came up that needed clarity.

While designing this, a few things came up that needed clarity.

Do we really need “Today” or custom filters?

Do we really need “Today” or custom filters?

Should the week be rolling (always last 7 days) or fixed (Mon–Sun)?

Should the week be rolling (always last 7 days) or fixed (Mon–Sun)?

1. Do we really need “Today” or custom filters?


1. Do we really need “Today” or custom filters?


I initially explored adding more granular filters like:

I initially explored adding more granular filters like:

  • Today

  • Last 7 days

  • Custom range

which felt like giving more control. But then a simple question came up:

What would “Today” even show? Just one bar. No comparison. No pattern.

  • Today

  • Last 7 days

  • Custom range

which felt like giving more control. But then a simple question came up:

What would “Today” even show? Just one bar. No comparison. No pattern.

It would end up looking sparse and underwhelming, making users go: "…okay? 😐"

So instead of isolating “Today,” users can naturally see it within the weekly chart itself — where it actually has context, avoiding splitting the same information into multiple places and keeps the experience clean.

And “custom range”?...it only

It would end up looking sparse and underwhelming, making users go: "…okay? 😐"

So instead of isolating “Today,” users can naturally see it within the weekly chart itself — where it actually has context, avoiding splitting the same information into multiple places and keeps the experience clean.

And “custom range”?...it only

  • adds complexity

  • increases cognitive load

  • turns a simple habit tool into an analysis tool

So what I intentionally avoided:

❌ “Today” → redundant (already visible in week)

❌ “Custom” → too complex for this use case

Limiting the views to weekly and monthly keeps the experience simple and centered around habit-building rather than data analysis.

  • adds complexity

  • increases cognitive load

  • turns a simple habit tool into an analysis tool

So what I intentionally avoided:

❌ “Today” → redundant (already visible in week)

❌ “Custom” → too complex for this use case

Limiting the views to weekly and monthly keeps the experience simple and centered around habit-building rather than data analysis.

2. Should the week be rolling or fixed?


2. Should the week be rolling or fixed?


Another decision was: Rolling 7 days (always last 7 days) vs Fixed week (Mon–Sun). Rolling days feel “live,” but something felt off.

Another decision was: Rolling 7 days (always last 7 days) vs Fixed week (Mon–Sun). Rolling days feel “live,” but something felt off.

User don't usually think: “I practiced 5 out of the last 7 rolling days”

They think: “I practiced 5 days this week”

User don't usually think: “I practiced 5 out of the last 7 rolling days”

They think: “I practiced 5 days this week”

So I went with a fixed weekly structure, And this made sense because:

The goal was NOT building an analytics tool, but building a habit-based learning app

To still allow reflection, users can switch between This Week and Last Week. So choosing a fixed weekly structure is better, because users naturally think in weekly cycles when building habits. To support reflection, I added the ability to view the previous week.

So I went with a fixed weekly structure, And this made sense because:

The goal was NOT building an analytics tool, but building a habit-based learning app

To still allow reflection, users can switch between This Week and Last Week. So choosing a fixed weekly structure is better, because users naturally think in weekly cycles when building habits. To support reflection, I added the ability to view the previous week.

Achievements That Reinforce Progress

Achievements That Reinforce Progress

The achievements section highlights what users have earned along the way:

The achievements section highlights what users have earned along the way:

  • streak milestones

  • activity-based rewards

  • learning progress markers

These act as small but meaningful nudges - reminding users that their effort is paying off. This page isn’t about showing more data — it’s about showing the right data.

  • Progress is simplified into meaningful signals

  • Consistency is prioritized over raw metrics

  • Decisions reduce clutter instead of adding features

As progress should feel clear, motivating, and effortless to understand.

  • streak milestones

  • activity-based rewards

  • learning progress markers

These act as small but meaningful nudges - reminding users that their effort is paying off. This page isn’t about showing more data — it’s about showing the right data.

  • Progress is simplified into meaningful signals

  • Consistency is prioritized over raw metrics

  • Decisions reduce clutter instead of adding features

As progress should feel clear, motivating, and effortless to understand.

Create a free website with Framer, the website builder loved by startups, designers and agencies.