Redesigning a L&D Platform

2024

Transforming a cluttered L&D platform into an engaging, user-centric experience.

Project Overview

Role

UI/UX Designer

Duration

3 months (April 2024 - June 2024)

Team

Design Team, Product Manager, Development Team

The Challenge 🎯

The existing HowNow L&D platform homepage was failing to engage users effectively, creating barriers to learning and platform adoption

Key Problems Identified:

  • 78% bounce rate from homepage visitors

  • Cluttered interface with no clear visual hierarchy

  • Poor content discoverability - users couldn't find relevant courses

  • Lack of personalization - no tailored content recommendations

  • Overwhelming information presented without prioritization

Business Impact:

  • Low user engagement and course completion rates

  • Poor first impression affecting platform adoption

  • Increased support tickets for navigation issues

RESEARCH & ANALYSIS

Competitive Analysis

I analyzed leading content platforms to understand engagement strategies:

I analyzed leading content platforms to understand engagement strategies:

User Journey Mapping

Design Process 🎨

1. Requirements Analysis

Collaborated with Product Manager to define:

1. Primary user goals and pain points

2. Business objectives and success metrics

3. Technical constraints and opportunities

Collaborated with Product Manager to define:

1. Primary user goals and pain points

2. Business objectives and success metrics

3. Technical constraints and opportunities

Key Requirements:

📈 Increase engagement through effective content showcasing

📝 Display critical information (tasks, deadlines) prominently

🎯 Maintain brand consistency while modernizing the interface

2. Ideation and Exploration

Layout Concepts for Enhanced User Engagement

3. Design Principles Established

✅ Visual Hierarchy: Guide attention through strategic use of size, color, and spacing

✅ Familiar Patterns: Leverage user expectations from popular platforms

✅ Content Prioritization: Surface the most relevant information first

✅ Progressive Disclosure: Reveal information based on user needs and context

The Solution ✨

Design Strategy

Transform the homepage into an engaging, personalized learning hub that balances content discovery with critical task management.

Transform the homepage into an engaging, personalized learning hub that balances content discovery with critical task management.

Key Design Decisions

1

1

1

Hero Section Redesign

  • Large, visually compelling banner showcasing featured content

  • Personalized recommendations based on user behavior

  • Clear value proposition and call-to-action

Hero Section Redesign

  • Large, visually compelling banner showcasing
    featured content

  • Personalized recommendations based on user
    behavior

  • Clear value proposition and call-to-action

2

Hero Section Redesign

  • Large, visually compelling banner showcasing featured content

  • Personalized recommendations based on user behavior

  • Clear value proposition and call-to-action

3

Visual Design System

  • Modern, clean aesthetic aligned with learning context

  • Consistent component library for scalability

  • Accessible color contrast and typography

4

Responsive Design Approach

  • Desktop: Full hero experience with detailed content cards

  • Tablet: Adapted layout maintaining visual hierarchy

2

2

Information Architecture

  • Prominent task/deadline section for immediate user needs

  • Categorized content sections for easy exploration

  • Quick access to frequently used features

Information Architecture

  • Prominent task/deadline section for immediate user
    needs

  • Categorized content sections for easy exploration

  • Quick access to frequently used features

3

3

Visual Design System

  • Modern, clean aesthetic aligned with learning context

  • Consistent component library for scalability

  • Accessible color contrast and typography

4

4

Responsive Design Approach

  • Desktop: Full hero experience with detailed content cards

  • Tablet: Adapted layout maintaining visual hierarchy

Responsive Design Approach

  • Desktop: Full hero experience with detailed content
    cards

  • Tablet: Adapted layout maintaining visual hierarchy

Result

Expected Impact & Success Metrics 📈

Projected Improvements

  • 50% reduction in bounce rate through improved engagement

  • 30% increase in course discovery and enrollment

  • 25% improvement in task completion rates

  • Enhanced brand perception of the platform

Success Metrics to Track 💯

2

Hero Section Redesign

  • Large, visually compelling banner showcasing featured content

  • Personalized recommendations based on user behavior

  • Clear value proposition and call-to-action

3

Visual Design System

  • Modern, clean aesthetic aligned with learning context

  • Consistent component library for scalability

  • Accessible color contrast and typography

4

Responsive Design Approach

  • Desktop: Full hero experience with detailed content cards

  • Tablet: Adapted layout maintaining visual hierarchy

  • Time spent on homepage

  • Click-through rates on featured content

  • Task completion from dashboard

  • User satisfaction scores

More work

Career Guidance App (Case Study)

Career Guidance App (Case Study)

2023

2023

Development Journey Platform

Development Journey Platform

2024

2024