Project Overview

Project Overview

Background

Background

HowNow’s homepage is the primary entry point for learners, but over time it became crowded with features and content, making it harder for users to understand what to do next.


This directly affected engagement and feature adoption.

HowNow’s homepage is the primary entry point for learners, but over time it became crowded with features and content, making it harder for users to understand what to do next.


This directly affected engagement and feature adoption.

Challenge

Challenge

Increase learner engagement and reduce homepage bounce
This impacted ARR directly

Increase learner engagement and reduce homepage bounce
This impacted ARR directly

Objective

Objective

Increase learner engagement and reduce homepage bounce
Deeper content interaction and improve platform value

Increase learner engagement and reduce homepage bounce
Deeper content interaction and improve platform value

Improve feature adoption from the homepage
Increase visibility and key modules and tools

Improve feature adoption from the homepage
Increase visibility and key modules and tools

Reduce cognitive overload and decision fatigue

Enable faster decision-making and clearer next actions

Reduce cognitive overload and decision fatigue

Enable faster decision-making and clearer next actions

AI meets learning

AI meets learning

About the learning platform

About the learning platform

About the learning platform

Project Overview

Background

HowNow’s homepage is the primary entry point for learners, but over time it became crowded with features and content, making it harder for users to understand what to do next.


This directly affected engagement and feature adoption.

Challenge

Increase learner engagement and reduce homepage bounce
This impacted ARR directly

Objective

Increase learner engagement and reduce homepage bounce
Deeper content interaction and improve platform value

Improve feature adoption from the homepage
Increase visibility and key modules and tools

Reduce cognitive overload and decision fatigue

Enable faster decision-making and clearer next actions

Context

Context

Starting Point

Starting Point

Starting Point

Initial Problem

Learners visited the homepage but did not meaningfully engage with content.

Engagement

% homepage visits with no interaction
Below Target

Continuation

% of users not resuming learning
Low continuation from homepage

Drop-off

High bounce rate from homepage entry
Users leaving without starting learning

Feature Adoption

Low usage of key modules
Mandatory sections underutilised

Old Homepage Screen

Old Homepage Screen

Content Details Screen

Content Details Screen

Initial Pemise

Objective

Objective

User's perspective

Reduce cognitive overload and guide clear next actions

Reduce cognitive overload and guide clear next actions

Business

Drive higher content interaction and retention

Drive higher content interaction and retention

Tech

Work within existing components and platform architecture

Work within existing components and platform architecture

Phase 1

Phase 1

Diagnosis & Opportunity Framing

Diagnosis & Opportunity
Framing

Diagnosis & Opportunity Framing

Before defining solutions, I examined both behavioural data and stakeholder insights to diagnose where the homepage
was failing to guide engagement. This helped frame the opportunity clearly before moving into structural exploration.

Before defining solutions, I examined both behavioural data and stakeholder insights to diagnose where the homepage was failing to guide engagement. This helped frame the opportunity clearly before moving into structural exploration.

  1. Perfomance Signals

  1. Perfomance Signals

  1. Perfomance Signals

To understand the homepage problem, I first reviewed engagement data and behavioural metrics.

I focused on:

  1. Homepage bounce rate

  2. Click-through to learning content

  3. Interaction with in-progress modules

  4. Feature adoption from homepage sections

  5. Scroll depth behaviour

Key Insights:

  • Users visited but did not engage deeply

  • In-progress learning was not being resumed

  • Personalised sections had lower interaction

  • Most engagement happened above the first fold

  • The homepage was not effectively guiding action

  1. Stakeholder & Customer Inputs

To complement the data, I spoke with the PM and Customer Success team to understand recurring learner concerns.

Whar I learned:

  • Learners felt overwhelmed by too many options.

  • Users struggled to identify what was relevant to them.

  • Admin-promoted content was often missed.

  • Feature awareness was lower than expected.

The homepage was functioning more as a content
catalogue than a guided entry point.

  1. Stakeholder & Customer Inputs

  1. Stakeholder &
    Customer Inputs

To complement the data, I spoke with the PM and Customer Success team to understand recurring learner concerns.

Whar I learned:

  • Learners felt overwhelmed by too many options.

  • Users struggled to identify what was relevant to them.

  • Admin-promoted content was often missed.

  • Feature awareness was lower than expected.

The homepage was functioning more as a content
catalogue than a guided entry point.

  1. Heuristic Review

I conducted a structured evaluation of the existing homepage focusing on hierarchy, clarity, and cognitive load.

Observations:

  • Multiple modules competing for attention.

  • Weak visual priority between sections.

  • Inconsistent spacing and density across modules.

  • Lack of strong directional cues for “next action”.

Key Insight:

The issue was not lack of content, it was lack of prioritisation and guidance.

  1. Heuristic Review

  1. Heuristic Review

I conducted a structured evaluation of the existing homepage focusing on hierarchy, clarity, and cognitive load.

Observations:

  • Multiple modules competing for attention.

  • Weak visual priority between sections.

  • Inconsistent spacing and density across modules.

  • Lack of strong directional cues for “next action”.

Key Insight:

The issue was not lack of content, it was lack of prioritisation and guidance.

Framing Hypotheses

Framing Hypotheses

Framing Hypotheses

Based on these findings, I defined two guiding hypotheses:

Hypothesis 1

If we prioritise personalised and in-progress learning at the top of the homepage, engagement will increase.

If we prioritise personalised and
in-progress learning at the top of the homepage, engagement will increase.

Hypothesis 2

If we reduce visual clutter and clarify hierarchy, users will decide faster and resume learning more often.

Phase 2

Phase 2

Direction Exploration & Validation

Direction Exploration &
Validation

Direction Exploration & Validation

Engagement Strategy Review

Engagement Strategy Review

To better understand how large content platforms drive consistent engagement, I reviewed products like Netflix, YouTube, and Apple TV. I focused on how they prioritise in-progress content, surface personalised recommendations, and structure content in a way that reduces decision fatigue.


These learnings informed the structural direction of the homepage redesign.

What I focused on

Common behaviours across
all three

Common behaviours across
all three

01. Prioritise in-progress content at the top

01. Prioritise in-progress content
at the top

02. Surface personalised recommendations early

02. Surface personalised
recommendations early

03. Use content "rails" to reduce decision fatigue

03. Use content "rails" to reduce
decision fatigue

04. Create visual hierarchy through intentional
grouping

04. Create visual hierarchy
through intentional grouping

04. Create visual hierarchy through intentional grouping

Key Insight

Key Insight

High-performing content platforms
share one truth

High-performing content platforms
share one truth

High-performing content platforms share one truth

- Guide users toward continuation first

- Guide users toward
continuation first

- Guide users toward continuation
first

- Surface relevance before exploration

- Surface relevance before
exploration

- Surface relevance before
exploration

- Reduce choice overload via structured grouping

- Reduce choice overload
via structured grouping

- Reduce choice overload via
structured grouping

- Balance discovery with clarity of purpose

- Balance discovery with
clarity of purpose

- Balance discovery with clarity
of purpose

Concept Exploration

Concept Exploration

Based on the performance signals, stakeholder insights, and learnings from high-engagement content platforms,
I explored multiple structural directions to test how the homepage could better support engagement and clarity.

Concept A

Dashboard-First

Dashboard-First

What it solves

  • Prioritised personal task and progress

  • Clean, administrative interface

Limitations

  • Still required users to actively decide what to engage with

  • Did not prioritise in-progress or personalised content strongly enough

Rejected: Improved organisation but did not significantly support engagement momentum.

Hypothesis: If we organise content into clear categories, users will feel less overwhelmed and navigate more confidently.

Hypothesis: If we organise content into clear categories, users will feel less overwhelmed and navigate more confidently.

Hypothesis: If we prioritise personalised and in-progress content at the top, users will engage faster and resume learning more often.

Concept B

Content-Discovery Focus

Content-Discovery Focus

What it solves

  • Large hero section with featured content

  • Emphasis on content exploration

Limitations

  • Risked reducing visibility of mandatory/admin-driven modules

  • Could make the experience feel algorithm-heavy and less structured

Rejected: Partially validated, strong for engagement but risky for business visibility.

Hypothesis: If we prioritise personalised and in-progress content at the top, users will engage faster and resume learning more often.

Hypothesis: If we prioritise personalised and in-progress content at the top, users will engage faster and resume learning more often.

Concept C

Balanced Engagement

Balanced Engagement

✅ Hero section with personalised
recommendations

✅ Hero section with personalised recommendations

✅ Clear information hierarchy

✅ Strategic placement of critical user data

✅ Optimal balance of discovery and
personalization

✅ Optimal balance of discovery and personalization

The key trade-off was balancing strong personalisation with maintaining visibility of mandatory, business-critical content.

Hypothesis: If we prioritise personalised and in-progress content while maintaining structured sections, we can balance engagement and business needs.

Hypothesis: If we prioritise personalised and in-progress content while maintaining structured sections, we can balance engagement and business needs.

Selected

Hypothesis: If we prioritise personalised and in-progress content while maintaining structured sections, we can balance engagement and business needs.

Concept A

Dashboard-First

What it solves

  • Prioritised personal task and progress

  • Clean, administrative interface

Limitations

  • Still required users to actively decide what to engage with

  • Did not prioritise in-progress or personalised content strongly enough

Rejected: Improved organisation but did not significantly support engagement momentum.

Hypothesis: If we organise content into clear categories, users will feel less overwhelmed and navigate more confidently.

Direction Validation

Direction Validation

After selecting the hybrid model, I validated the direction against both business priorities and technical feasibility to confirm it could drive engagement while remaining viable within existing system constraints.

From Business Alignment 💰

  • Needed to increase engagement and feature adoption

  • Mandatory content had to remain visible

  • Homepage had to support overall platform value

The Hybrid model supported both engagement and
business visibility.

From Technical Feasibility 💻

  • Worked within existing component library

  • Did not require backend restructuring

  • Allowed modular layout adjustments

Engineering review confirmed feasibility within
current system constraints.

Selected Direction

Selected Direction

We selected the Hybrid model because it best balanced engagement goals, business visibility, and technical feasibility.

✅ Reduced cognitive overload through clearer
hierarchy

✅ Reduced cognitive overload
through clearer hierarchy

✅ Prioritised in-progress and personalised content

✅ Prioritised in-progress and
personalised content

✅ Maintained visibility of mandatory and
business-driven modules

✅ Maintained visibility of
mandatory and business
driven modules

✅ Maintained visibility of
mandatory and
business-driven modules

✅ Aligned with existing system and technical
constraints

✅ Aligned with existing system
and technical constraints

Phase 3

Phase 3

Visual Design Exploration

Visual Design Exploration

Visual Design
Exploration

Design Principles

Design Principles

Based on the selected hybrid direction, I defined three execution principles:

  1. Clarity First

  1. Clarity First

The hero section establishes the purpose of the platform instantly. No clutter, no confusion.

The hero section establishes the purpose of the platform instantly. No clutter, no confusion.

  1. Personalization First

  1. Personalization First

Recommendations and “Continue Learning” blocks adapt based on user behavior. This keeps the platform feeling relevant.

Recommendations and “Continue Learning” blocks adapt based on user behavior. This keeps the platform feeling relevant.

  1. Predictability First

Horizontal scrollable sections, clean cards, and logical categories help users skim and act quickly.

  1. Predictability First

  1. Predictability First

Horizontal scrollable sections, clean cards, and logical categories help users skim and act quickly.

Horizontal scrollable sections, clean cards, and logical categories help users skim and act quickly.

Wireframe Exploration

Wireframe Exploration

Next, I moved into wireframing to translate the strategy into a clear structural layout.

The focus at this stage was on hierarchy and flow, deciding what appears first and how to surface personalised and
in-progress learning without overwhelming the page. I explored multiple structural variations to test different prioritisation models, spacing systems, and grouping logic to ensure the homepage felt guided rather than cluttered.

Next, I moved into wireframing to translate the strategy into a clear structural layout.

The focus at this stage was on hierarchy and flow, deciding what appears first and how to surface personalised and in-progress learning without overwhelming the page. I explored multiple structural variations to test different prioritisation models, spacing systems, and grouping logic to ensure the homepage felt guided rather than cluttered.

Internal Validation & Alignment

Internal Validation & Alignment

Before moving to final UI, I reviewed the wireframes with the Product Manager and engineering team.

We aligned on engagement priorities, feature visibility, and technical feasibility. Based on feedback, I adjusted module hierarchy, simplified grouping, and ensured the layout could be built using existing components and data structures.

This step helped reduce implementation risk and strengthened alignment across product and engineering.

Usability Testing

Before moving to high-fidelity designs, I conducted an unmoderated usability test using Maze with 6 active platform users. Each session lasted around 7 minutes and focused on validating layout and content hierarchy decisions.

Participants were given 3 key tasks:

  1. Resume an in-progress course

  2. Find a mandatory task

  3. Discover new content relevant to their role

Key changes based on findings:

Moved in-progress content higher.
4 out of 6 users missed it in its original position

Reduced banner prominence after it consistently distracted users from key actions

Repositioned mandatory modules after users overlooked them on first scroll

Design System & Visual Foundations

Design System & Visual Foundations

The homepage redesign required evolving existing components rather than rebuilding from scratch.

I updated content cards to improve hierarchy and scannability, introduced a more structured banner system to guide attention, and standardised spacing to create a clearer visual rhythm across modules. Typography and contrast were refined to improve accessibility and readability.

All updates were aligned with the existing design system to ensure consistency and engineering feasibility.

New Homepage

New Homepage

New Homepage

Content Details Screen

Content Details Screen

Content Details Screen

Impact & Results 📈

Impact & Results 📈

Impact & Results 📈

Following the homepage redesign, we observed measurable improvements in user engagement and interaction patterns, validating the design direction.

Project Improvement

Project Improvement

50%

reduction in bounce rate through improved engagement

50%

reduction in bounce rate through improved engagement

30%

increase in course discovery and enrollment

30%

increase in course discovery and enrollment

25%

improvement in task completion rates

25%

improvement in task completion rates

Enhanced brand perception

of the platform

Enhanced brand perception

of the platform

✨ Reflection

✨ Reflection

✨ Reflection

This redesign went beyond a visual refresh and required rethinking how the homepage supports learning goals, content discovery, and long-term scalability. Framing the homepage as a core engagement surface helped us align design decisions with both user needs and business objectives.

One of the key challenges was balancing visibility and simplicity. Reducing visual noise meant making intentional trade-offs about what content to surface, while still supporting quick actions and deeper exploration. Close collaboration with engineering helped ensure that design intent translated effectively within technical constraints.

If this project were to continue, I would explore deeper personalisation and adaptive homepage states based on user behaviour and learning intent to further improve relevance and engagement.

Have a project idea in mind? Let’s chat about how we can bring it to life— virtually, from anywhere in the world!

Book a short call

Back to top

Back