UX Case Study — EdTech / SaaS

Redesigning the
LMS Admin
Experience

Squadra LMS
Dashboard · Course Creation · Course List
Desktop + Mobile
UX Research · Product Design · Design System
Scroll to explore
01
Project Overview

Where complexity
meets opportunity

Learning Management Systems are powerful — but most are designed around capability, not clarity. Squadra aimed to fix that: redesigning the admin experience from the ground up so the tool gets out of the way and lets people do their best work.

01
The Problem
LMS admin interfaces are overwhelming, fragmented, and slow — with poor hierarchy, no task guidance, and weak visibility into what matters most.
02
The Objective
Design a responsive, focused admin experience across three critical workflows: Dashboard, Course Creation, and Course List management.
03
The North Star
Reduce cognitive load so admins can focus on outcomes — not on navigating the system. Efficiency, visibility, and confidence by design.
02
Research & Discovery

Understanding the
real problem

Before sketching a single wireframe, we committed to understanding the actual problem. Research ran in two parallel tracks — qualitative depth and quantitative breadth.

User Interviews Contextual Inquiry Surveys Analytics Review Competitor Analysis Heuristic Evaluation

Overwhelming Forms

30+ fields on a single course creation page with no logical grouping, no progress indication, and no auto-save.

Dashboard Blindness

KPIs buried 4–5 clicks deep. Admins couldn't answer basic questions about course performance without significant navigation.

Navigation Maze

Deep nested menus with inconsistent labels. Users frequently backtracked or relied on browser history to navigate.

Search Dead Ends

Course lists had no compound filtering, no saved views, and search was limited to exact-match title queries only.

"I spend half my time just trying to find where things are. Creating a course should take 10 minutes — it takes me 45."

— LMS Admin, User Research Interview
03
Target Users

Designing for two distinct mental models

Two user personas emerged — each with different success criteria. Balancing power with simplicity required designing a system that could serve both without compromise.

👤

Primary — LMS Admin

Speed + Control

Manages hundreds of courses, users, and reports. Works at high volume daily. Values efficiency above all — any friction compounds across hundreds of tasks.

Core Needs
Bulk Actions Fast Navigation Data Visibility Keyboard Shortcuts
✏️

Secondary — Course Creator

Simplicity + Guidance

Creates content periodically, not daily. Benefits from progressive disclosure and step-by-step flows. Easily overwhelmed by information-dense interfaces.

Core Needs
Clear Structure Auto-Save Progress Cues Inline Guidance
04
Competitor Analysis

Finding the
white space

We analyzed three leading LMS platforms — identifying what to learn from, what to avoid, and where the gap in the market was widest.

Platform Strengths Weaknesses Squadra Opportunity
Moodle Highly Powerful Steep Learning Curve Simplify without losing capability
Teachable Easy Onboarding Limited for Admins Add depth while keeping clarity
Coursera Structured Content Rigid Workflows Flexibility with guided structure

The opportunity was clear: combine Moodle's power, Teachable's simplicity, and Coursera's structure — in a single, cohesive admin experience that respects users' time.

05
User Journey

Mapping the core
admin flow

Every stage of the primary admin journey was analyzed for friction, cognitive load, and opportunities to accelerate task completion.

  1. 1 Login
  2. 2 Dashboard
  3. 3 Review Activity
  4. 4 Create Course
  5. 5 Add Content
  6. 6 Publish
  7. 7 Manage Courses
06
UX Strategy

Four principles,
one direction

These principles became our shared design language — guiding every decision from information architecture to micro-interaction behavior.

Simplicity

  • Progressive disclosure over all-at-once
  • Remove non-essential options
  • One primary action per screen state
  • Guided creation flows

Efficiency

  • Fewer clicks to common tasks
  • Bulk actions for high-volume work
  • Persistent access to key functions
  • Auto-save everywhere

Visibility

  • Surface key metrics immediately
  • Real-time feedback on every action
  • Persistent status indicators
  • Clear empty and error states

Consistency

  • Shared component system
  • Predictable interaction patterns
  • Unified terminology throughout
  • Reduced learning curve
07
UI Screens

The three screens
that change everything

Each screen solves a specific, well-defined problem. Every design decision has a rationale rooted in research findings.

A

Dashboard

Replaced information overload with a scannable command center. KPI cards, activity feed, and quick actions — visible without a single scroll. Admins can assess the state of their platform in under 10 seconds.

KPI Cards Activity Feed Quick Actions Real-time Status
Squadra Dashboard UI Screen
Dashboard — Desktop View Web Screen
B

Course Creation

The single biggest source of drop-off — a monolithic 30-field form — replaced with a five-step guided wizard. Each step has a single focus, reducing cognitive load dramatically. Auto-save means nothing is ever lost.

Step-by-Step Wizard Auto-Save Drag & Drop Content Progress Indicator Inline Validation
Squadra Add New Course UI Screen
Course Creation — Step-by-Step Flow Web Screen
C

Course List

Admins managing large catalogs need to find, filter, and act on courses at speed. The redesigned list combines advanced multi-dimensional filtering with bulk selection — turning a passive list into an active management surface.

Advanced Filters Full-text Search Bulk Actions Sortable Columns Saved Views
Squadra Course List UI Screen
Course List — Management View Web Screen
08
Responsive Design

Designed for
every context

Usage data showed 23% of admin access coming from mobile. Both experiences were designed intentionally — not as afterthoughts. Desktop for power, mobile for speed.

🖥 Desktop

Persistent sidebar navigation. Multi-column data tables. Hover states and keyboard shortcuts for power users. Full filter panel visible by default.

📱 Mobile

Collapsible bottom navigation. Card-based layouts replacing data tables. Sticky primary actions accessible with thumbs. Simplified filter drawer on demand.

Squadra Mobile Dashboard
Dashboard — Mobile
Squadra Mobile Course List
Course List — Mobile
09
Design System

A unified visual
foundation

Consistency doesn't happen by accident. Every visual decision — from color to typography to component behavior — was documented and systematized to enable scalable, coherent growth.

Primary Green
#018270
Deep Forest
#081D13
Mint Tint
#E6F4F2
Body Gray
#4E5954
Colour Palette Foundation
Archivo Display / Headings
Design for focus
700 / Tight hierarchy / Bold product moments
IBM Plex Sans Body / Interface
Clarity, rhythm, and readable UI copy.
400-600 / UI labels, paragraphs, metadata
Typography Foundation
Squadra UI Components
Components UI Library
Squadra Illustration System
Illustrations Visual Language
10
Usability Systems

Designed to prevent
failure, not just recover

Great admin UX is invisible — until something goes wrong. Feedback systems were built to prevent errors and communicate status at every stage of every workflow.

Inline Validation

Field-level errors appear on blur, not on submit. Required fields are indicated upfront — not flagged after a failed attempt.

Feedback States

Every action has a loading, success, and error state. Toast notifications confirm actions without interrupting the user's flow.

Empty States

Designed as opportunities, not dead ends. Empty course lists prompt creation; empty search results suggest alternative filter combinations.

Confirmation Dialogs

Destructive actions (delete, unpublish) require secondary confirmation. All non-destructive actions are undoable within 5 seconds.

11
Success Metrics

Measuring what matters

Design decisions were validated against measurable outcomes. Four metrics defined success across the redesigned experience.

↓40%
Task Completion
Time Reduction
↓60%
Form Error
Rate Reduction
↓35%
Course Creation
Drop-off Reduction
85+
Target SUS Score
(Excellent Tier)
12
Outcomes & Impact

What changed

The redesign produced measurable improvements across every targeted workflow — validated through usability testing with 12 participants across both user types.

Faster Workflows

Course creation time dropped from an average of 45 minutes to 18 minutes — a 60% reduction validated in usability testing.

Better Navigation

Navigation-related errors dropped by 72% in testing. Users found their target in fewer clicks on every measured flow.

Reduced Frustration

SUS score improved from 52 (poor) to 88 (excellent) — a jump of 36 points, moving Squadra from below average to industry-leading.

Higher Completion

Task completion rate rose from 61% to 94% on core flows — a 33-point increase that directly reduces support burden.

13
Key Takeaways

What this project taught us