Habit Tracking Dashboard
The interface excels in presenting progress metrics clearly with distinct visual grouping and consistent use of icons, making it easy to understand at a glance. However, the design could improve by adding clearer labels and legends for some charts and ensuring contrast for better accessibility.
Public
Design Score
Polish Opportunities
Design Perspectives
0To Review
Recommended Fixes by Impact
0Total
Fixes by Category
3
Color & Contrast4
Content Readability & Clarity4
Visual Consistency, Imagery & Media1
Navigation & Structure0
Conversion & Actions1
Tone, Friendliness & Delight3
Accessibility & Input Ergonomics2
Efficiency & Cognitive Load1
Flow & States Completeness2
Strategic DesignRecommended Fixes by Impact
0Critical
1Major
16Moderate
5Minor
No visible navigation menu or controls
Major
Navigation & Structure
The Problem
The app screen shows progress stats but does not display any visible navigation menu, tabs, or controls to switch to other sections or return to the home screen.
Why it Matters
Users cannot change screens or understand where they are in the app, leading to frustration and possible abandonment.
How to Fix
Add a visible primary navigation menu, such as a tab bar or hamburger menu, to allow users to easily access other parts of the app.
Issue Highlights
Contrast too low for weekday labels
Moderate
Color & Contrast
The Problem
The day-of-week labels (Mon, Tue, Wed, Thu, Fri, Sat, Sun) below the bar chart have low contrast against white background, likely failing WCAG AA for normal text.
Why it Matters
Users with low vision or color deficiencies may struggle to identify these labels, affecting ease of data reading.
How to Fix
Use a darker text color for the weekday labels to meet at least 4.5:1 contrast ratio against the background.
Issue Highlights
Weekly bar chart lacks explanatory legend or units
Moderate
Visual Consistency, Imagery & Media
The Problem
The This Week bar chart uses green bars but does not provide units or a legend explaining what the bar height represents.
Why it Matters
Users may be uncertain about what the bars represent (e.g., minutes, reps, complete/incomplete), hindering clear data interpretation.
How to Fix
Add a label or legend clarifying the unit or metric measured by the bar chart (e.g., 'Hours exercised', 'Tasks completed').
Issue Highlights
No visible labels for daily progress bars
Moderate
Accessibility & Input Ergonomics
The Problem
The weekly and monthly progress bars and charts show graphical data but lack visible text labels or tooltips describing their purpose or values.
Why it Matters
Users relying on screen readers or with cognitive disabilities may miss the context or meaning of these progress indicators.
How to Fix
Add clear visible labels or accessible text for these charts and bars to describe their meaning, e.g. 'This Week Progress: Monday to Sunday'.
Issue Highlights
Low contrast for minor text labels
Moderate
Color & Contrast
The Problem
Text such as 'Keep it up!' below the main heading 'Your Progress' appears to have low contrast against the white background, likely below WCAG AA standard (4.5:1 for normal text).
Why it Matters
Low contrast text is difficult to read, especially for users with visual impairments or in bright environments, reducing content comprehension.
How to Fix
Increase text color contrast by using a darker shade for secondary text to ensure at least 4.5:1 contrast ratio against the background.
Issue Highlights
Low contrast for 'Streak' label text
Moderate
Color & Contrast
The Problem
The 'Streak' label below the flame icon with the number 12 uses orange text on a pale background, likely below WCAG AA contrast requirements.
Why it Matters
Poor contrast makes it difficult for users to read this key metric, impairing understanding of streak status.
How to Fix
Darken the orange text color or increase background darkness to achieve sufficient contrast.
Issue Highlights
Date text below header is too small
Moderate
Content Readability & Clarity
The Problem
The date text 'March 2026 · Keep it up!' below the main header appears small and could be difficult to read for some users, likely below recommended body text size for mobile.
Why it Matters
Important contextual information such as the current month and encouragement is less visible, reducing engagement and clarity.
How to Fix
Increase the font size for the date text to at least 14-16px or equivalent for better readability on mobile.
Issue Highlights
Inconsistent icon styles in Habit Streaks list
Moderate
Visual Consistency, Imagery & Media
The Problem
The icons shown for each habit in the Habit Streaks section vary in style and stroke weight, causing visual inconsistency within the same component set.
Why it Matters
Inconsistent icon styles reduce the perceived polish and coherence of the UI, potentially distracting users and diminishing trust in the product.
How to Fix
Standardize icon styles by using a consistent design approach (e.g., line weight, color palette, and level of detail) for all habit icons.
Issue Highlights
Unlabeled fire emoji icons in multiple places
Moderate
Visual Consistency, Imagery & Media
The Problem
The fire emoji icon appears next to streak numbers and progress bars without textual explanation, potentially confusing some users about its meaning.
Why it Matters
Ambiguous iconography can slow comprehension and cause misinterpretation of important progress data.
How to Fix
Add text labels or tooltips clarifying the meaning of the fire icon (e.g., 'Current Streak').
Issue Highlights
Small icons and text in habit streaks row
Moderate
Accessibility & Input Ergonomics
The Problem
The icons and flame counters in the Habit Streaks section appear small and may be less than 44x44 pixels, requiring precise taps.
Why it Matters
Small tap targets increase user frustration and can lead to errors, especially for users with motor impairments or larger fingers.
How to Fix
Increase the size of icons and tap targets to at least 44x44 pixels around each interactive element.
Issue Highlights
Multiple Habit Streaks with Similar Progress Bars and Flame Icons
Moderate
Efficiency & Cognitive Load
The Problem
The habit streaks section shows several habits each with a progress bar and a flame icon with a number, which may cause users to have to interpret multiple similar data points and decide which to focus on.
Why it Matters
Users can experience cognitive overload trying to decide which habit needs attention most or which streak to prioritize due to repeated and visually similar elements.
How to Fix
Consolidate habit streak information by highlighting only the most critical streaks or by providing an overall streak summary with drill-down details on demand.
Issue Highlights
Missing Call to Action on Progress Screen
Moderate
Flow & States Completeness
The Problem
The screen shows detailed progress metrics and habit streaks but does not provide any clear next step or call to action such as a button to add new habits, review details, or set goals.
Why it Matters
Without a clear next step, users may feel uncertain about what they should do after reviewing their progress, potentially leading to disengagement or abandonment of the app.
How to Fix
Add a prominent button or interactive element guiding users to the next logical action, for example, 'Add New Habit', 'Review Challenges', or 'Set Goals' to encourage continued engagement.
Issue Highlights
Lack of Distinct Visual Hierarchy for Key Metrics
Moderate
Strategic Design
The Problem
The key metrics for 'This Month' (Avg Rate, Streak, Completed) are visually grouped but have very similar styling and weight, making it hard to quickly identify the most important figure at a glance.
Why it Matters
Users may struggle to quickly understand their main progress indicator, decreasing immediate motivation and engagement with the app.
How to Fix
Emphasize the primary metric (e.g., Avg Rate) with stronger visual hierarchy such as a larger font size, bolder weight, or distinct color to help it stand out clearly from secondary metrics.
Issue Highlights
No clear label for March Activity calendar
Moderate
Content Readability & Clarity
The Problem
The calendar block for March Activity lacks explanatory text or a clear legend indicating what the shaded squares represent.
Why it Matters
Without labels or explanation, users might be confused about what the color blocks mean, reducing the usefulness of the data visualization.
How to Fix
Add a concise label or legend to clarify the meaning of the color shading in the calendar.
Issue Highlights
Location context not clearly indicated
Moderate
Orientation Missing (Environment/Role/Location)
The Problem
While the title 'Your Progress' is present, there is no additional contextual cue or breadcrumb indicating the user's current location within the overall app structure or role.
Why it Matters
Users may be unsure if they are viewing a summary, a detailed report, or a different section, reducing confidence and ease of navigation.
How to Fix
Add a subheader, breadcrumb, or highlight active navigation state to clearly communicate the current location within the app.
Issue Highlights
Flame streak number and habit text too close
Moderate
Accessibility & Input Ergonomics
The Problem
In the Habit Streaks list, the flame icon and streak number are positioned close to the habit label text and progress bar, which may cause accidental taps.
Why it Matters
Closely spaced interactive elements increase the chance of tapping the wrong element, causing user errors.
How to Fix
Add more spacing or padding around the flame icon, streak count, and habit labels to create distinct touch areas.
Issue Highlights
March Activity Heatmap Lacks Explainer or Legend
Moderate
Efficiency & Cognitive Load
The Problem
The March activity heatmap shows blocks of various shades of green without any visible legend or explanation.
Why it Matters
Users might forget or be unsure what the different shades represent, forcing them to rely on memory or guesswork, which increases cognitive effort.
How to Fix
Add a clear color legend or tooltip to explain what each shade of green represents in terms of activity level.
Issue Highlights
Misaligned text baseline in This Month metrics
Minor
Visual Consistency, Imagery & Media
The Problem
The numeric values and labels inside the three monthly metrics cards appear slightly vertically misaligned, causing uneven baseline alignment across the set.
Why it Matters
Misalignment reduces visual harmony and can subtly increase cognitive load by making the information harder to scan quickly.
How to Fix
Adjust vertical spacing and baseline alignment for numbers and labels within all cards so they line up consistently.
Issue Highlights
Inconsistent emphasis in 'THIS MONTH' data labels
Minor
Content Readability & Clarity
The Problem
The text labels under 'THIS MONTH' ('Avg Rate', 'Streak', 'Completed') use similar font sizes and weights, which reduces clarity and emphasis of numeric results compared to labels.
Why it Matters
Users may struggle to quickly differentiate between key metrics and their descriptions, slowing comprehension.
How to Fix
Use stronger visual hierarchy by increasing font size or weight for numbers, and lighter styles for labels.
Issue Highlights
No unit clarifications for streak numbers in Habit Streaks
Minor
Content Readability & Clarity
The Problem
The flame icon with numbers (e.g., 12, 7) is used to indicate streaks but lacks explicit textual clarification about the unit of streak (days, weeks, etc.).
Why it Matters
Users might be uncertain about what the streak numbers represent, potentially causing confusion.
How to Fix
Add a short label such as 'days' next to streak numbers or provide a tooltip explanation.
Issue Highlights
Progress Bar Colors Lack Emotional Warmth
Minor
Tone, Friendliness & Delight
The Problem
The use of green and grey tones in the progress bars and charts is very subdued and neutral, which may not fully convey enthusiasm or motivation despite the encouraging context.
Why it Matters
Users may not feel as emotionally engaged or motivated if the visual tone feels too neutral or subdued for a progress-tracking screen that encourages habit-building.
How to Fix
Incorporate warmer or more vibrant accent colors (e.g., brighter greens, yellows, or oranges) in the progress bars to evoke a more positive and motivating emotional tone.
Issue Highlights
Generic Bar Chart Style for Weekly Progress
Minor
Strategic Design
The Problem
The weekly progress bar chart uses uniform green bars without additional contextual cues or highlights for today or best performance days, making it less engaging or instantly informative.
Why it Matters
Users might find the chart less motivating or harder to interpret quickly, limiting its impact as a progress indicator.
How to Fix
Add color accents or visual indicators for the current day or record highs in the weekly chart to enhance readability and engagement.
Issue Highlights