Moodle re-design
Project Overview
The Moodle Redesign project was driven by the need to transform an outdated learning management system into an intuitive, student-centered experience. While Moodle is widely used across institutions like Griffith College, students often struggle with confusing layouts, poor visual hierarchy, and fragmented workflows.
Our goal was to simplify navigation, integrate productivity tools, and enhance overall engagement creating a unified, frictionless learning environment for both students and educators.
Problem Statement / challenge
Moodle’s interface was functionally robust but emotionally flat and visually outdated.
Students described their experience as “disorganized” and “difficult to navigate,” relying on external apps like Notion, Todoist, and Slack to manage coursework, communication, and deadlines.
We set out to fix that by making Moodle a one-stop platform for productivity, collaboration, and learning.
Core Problems Identified:
- Problem 1: Students can’t easily find essential features.
- Solution: A unified, consistent design system with “how-to” tutorials.
- Problem 2: Assignment workflows are unclear.
- Solution: A visual calendar showing upcoming deadlines.
- Problem 3: Students rely on multiple external tools.
- Solution: Integrated task management, note-taking, and group chat.
Resarch and Discoery
Conducted interviews and surveys with 15+ students and 3 lecturers at Griffith College to understand their frustrations and daily interactions with Moodle.
Key Insights:
- Students wanted faster access to assignments, grades, and deadlines.
- Lecturers needed a clearer content upload and notification system.
- The interface felt “dated” and “uninspiring,” discouraging frequent use.
“I only log in when I absolutely have to. It’s not easy to find what I need.” Student Interview, Week 1
Competitive analysis
Compared Moodle with other LMS platforms like Canvas, Blackboard Ultra, and Google Classroom.
We also studied Notion, Todoist, and Slack focusing on how they foster organization, real-time communication, and task management.
These insights guided our key design goals:
- Task & note integration for academic management.
- Study group spaces inspired by Slack channels.
- Visual calendar to clearly show deadlines and schedules.
Findings:
- Competitors offered cleaner, minimal dashboards and better visual hierarchy.
- Moodle’s strength was customization, but it sacrificed simplicity.
- Opportunity: blend Moodle’s robust back-end with a refined, intuitive front-end.
Persona
Name: Sarah O’Neill
Age: 21
Role: Undergraduate Student
Goals:
- Quickly check upcoming deadlines and grades
- Access lecture materials without extra navigation
- Stay motivated and organized through a clear dashboard
Frustrations:
- Information overload on homepage
- Inconsistent layouts across courses
- Difficulty finding notifications or uploaded files
Information Architecture
The redesign focused on streamlining the user journey and reducing cognitive load.
Old Structure → New Flow:
- Dashboard: Simplified overview (Courses, Deadlines, Grades)
- Course Page: Modular layout with progress tracking
- Notifications: Centralized feed for all updates
- Resources: Reorganized into clear tabs (Materials, Assignments, Forums)
Design Solution / Approach
The design direction was inspired by clarity, accessibility, and modern academic minimalism.
Each visual decision emphasized functionality without losing warmth.
Visual Language:
- Color Palette: Muted whites, light neutrals, and accent blues for calmness and contrast
- Typography: Sans-serif typeface for legibility across devices
- Layout: Clean card-based structure with plenty of whitespace
- Tone: Professional yet friendly, avoiding the institutional “coldness” of older LMS designs
Accessibility:
- Increased color contrast for readability
- Large clickable areas for touch navigation
- Keyboard-friendly tab navigation for inclusive design
Design Development
Wireframes & Prototypes
Low-fidelity wireframes were created in Figma to map core pages like theDashboard, Course, Assignment, and Forum and tested with student users.
Iterative feedback led to simplified course layouts and consistent content hierarchies.
Prototypes
.png)
-1.png)
-1.png)
.png)
Usability Testing
Five rounds of usability testing were conducted with Griffith College students.
Results:
✅ 90% of users found the redesigned dashboard clearer and easier to navigate
✅ Average time to locate assignments decreased by 40%
✅ Students described the new interface as “simple,” “modern,” and “less stressful”
Feedback from lecturers highlighted improved clarity in assignment upload flows and student tracking.
Final Outcome
The redesigned Moodle experience successfully transforms a complex, outdated LMS into a clean, structured, and human-centered platform.
Improvements Achieved:
- Simplified navigation hierarchy
- Consistent design system across all modules
- Visual and emotional appeal improved through color and typography
- Enhanced accessibility and mobile usability
Impact
The Moodle redesign demonstrates how UX design can transform digital education by humanizing structure and focusing on what truly matters helping learners learn better.
It repositions Moodle as not just a tool for coursework, but a digital space for connection, productivity, and growth.
Reflection & Learnings
Through this project, I learned how UX design bridges functionality and emotion. Translating academic structure into digital clarity required balancing usability with visual calm.
I also recognized how motion, hierarchy, and simplicity drive engagement in learning platforms.
Next Steps:
- Build a working prototype with live user testing.
- Develop a responsive mobile version.
- Explore integrations with Google Calendar and Slack-style collaboration.
