🎓 Web Platform · LMS Redesign

SilidLMS

Redesigning a learning management system that teachers and students use every single day — making it cleaner, calmer, and actually enjoyable to use.

My role

UX/UI Designer

Platform

Web (+ Webflow)

Users

Teachers & Students

Status

Shipped ✓

Major usability problems identified & fixed

Unified icon style across the whole platform

↓

Fewer clicks needed for common tasks

✓

Shipped to real schools & used daily

The problem

It felt like a website from 2010. 😬

Our CEO collected honest feedback from the teachers and students actually using SilidLMS every day. The message was loud and clear: the platform was exhausting to use — not because it lacked features, but because the design got in the way of everything.

🎨

Color chaos

Gray background, bright orange navbar, harsh red accents — all fighting each other. Looking at it felt stressful, like everything was screaming for attention at the same time.

🔡

Text too small to read

Font sizes were inconsistent and often tiny. Teachers spending hours reviewing content had to squint just to get through their work.

🧩

Icon identity crisis

Some icons were flat, some outlined, some illustrated — all mixed together. It looked unfinished, like multiple designers worked on it without ever talking to each other.

📦

Too much on screen at once

Every screen was packed. The dashboard, class cards, and sidebars all crammed in so many elements that users got overwhelmed just trying to find one thing.

🔄

Too many unnecessary steps

Simple tasks like posting to a class feed or creating a schedule required way more clicks than they should. Users got lost in the middle of basic workflows.

The design question

What were we actually trying to solve? 🎯

💬 "How might we reduce visual noise and cognitive overload in SilidLMS — so teachers can focus on teaching and students can focus on learning, instead of fighting the interface?"

Think of it this way: if a teacher has to think about how to use the tool, they can't think about what they're teaching. A good LMS should feel invisible — it should just work, quietly, in the background.

My process

A sprint-inspired approach. 🏃

No formal usability sessions — but I used structured UX methods to make sure every design decision was grounded in real user feedback, not guesswork.

Discover

Collected stakeholder-reported usability issues.

Define

Identified problems in hierarchy, clutter, and navigation.

Research

Benchmarked and studied Canvas, Google Classroom, Notion

Design

Redesigned dashboard and components in Figma.

Review

Stakeholder sign-off before handoff

Ship

Implemented through code for school use.

Before vs After

What actually changed. 🔄

This wasn't just a visual refresh. Every change was tied back to a specific complaint from a real user.

❌ Before — The old SilidLMS

🎨Gray background + bright orange navbar + red accents — visual overload with no clear hierarchy

🔡Tiny, inconsistent font sizes — hard to read after more than a few minutes

🧩Mixed icon styles (flat, outlined, illustrated) — nothing matched anything else

📦Dashboard and class cards crammed full — no breathing room anywhere

🔄Too many clicks for simple tasks — easy to get lost mid-workflow

✓ After — The redesign

🎨Clean white base, orange used only for actions and key highlights — calm and focused

🔡Larger, readable type with clear hierarchy — headings feel like headings, labels feel like labels

🧩One unified icon style across the entire platform — consistent everywhere

📦Decluttered dashboard with only the essential info visible at a glance

🔄Streamlined workflows — fewer clicks, clearer paths, nothing hidden

Key design decisions

The four moves that made the biggest difference. 💡

🎨

Tame the color palette

When everything is colorful, nothing stands out. I kept orange as the one accent color — reserved for buttons, links, and actions only. Everything else became clean and neutral. Less color means more clarity.

🃏

Rethink the class card

The class card is the most-seen element on the dashboard — teachers look at it dozens of times a day. I reorganized it to show the class name, schedule, and quick-action shortcuts front and center.

🗂️

Reorganize the sidebar

The class sidebar had too many items with no grouping logic. I organized related tools (Schedule, Attendance, Grades, Achievements) into logical clusters — so teachers stop hunting and start doing.

🔍

Add smart filter & sort

Teachers with 10+ classes need to find things fast. I designed a Filter modal (by role, teacher, school year, schedule) and Sort options (alphabetical, date, enrollment count) — making the dashboard manageable.

The design

See the redesign in action. 🖥️

Every screen is a direct response to a real user complaint. This is what it looks like when design listens.

Dashboard — class card grid

Dashboard · Clean class card grid with search, filter, and sort

Filter & sort — finding classes fast

Filter · By role, teacher, school year, schedule

Sort · Alphabetical, date created, enrollment count

Inside a class & creating a class

Class page · Feed, reorganized sidebar tools, post editor

Create class · Name, schedule, background image picker

Account settings & dashboard view preferences

My Account · Profile settings + dashboard layout preferences (Classic / Board / Table view)

How we validated the design

How did we know it actually worked? 🧪

We didn't have access to direct user testing sessions — but we used structured UX methods to evaluate the design rigorously before it shipped.

📋

Heuristic Evaluation (Nielsen's 10 Usability Heuristics)

I evaluated every redesigned screen against Nielsen's 10 usability heuristics — checking for system feedback, error prevention, visual hierarchy, and consistency. Issues flagged here were fixed before handoff.

🏫

Stakeholder Review Session

The redesign was reviewed by the internal product team, marketing, and support staff — people who heard user complaints every day. Their feedback confirmed the simplified dashboard directly addressed what users had been raising.

📊

Comparative Benchmarking

I compared the redesign against modern LMS platforms like Google Classroom, Canvas, and Notion — making confident decisions about hierarchy, spacing, and component patterns backed by what works at scale.

The outcome

A platform that finally feels good to use. 🎉

User complaints directly addressed in the redesign

Unified icon set across the entire platform

↓

Significant reduction in steps for key teacher tasks

✓

Stakeholders confirmed improved usability in review

🎓 The real win: Teachers and students now spend less time figuring out how to use the platform — and more time actually teaching and learning. When a tool gets out of the way, the real work can begin.

What's next

Where do we go from here? 🚀

📌 Recommended: Task Efficiency Testing. Now that the redesign is live, the next step is measuring time-to-complete for key LMS tasks — posting an activity, managing a schedule, grading submissions. Running these with real teachers and students will show exactly how much time the new design saves, and where we can still improve.

What I learned

Lessons I'm taking to every project. 📚

🧼

Subtraction is a design skill

The most impactful thing I did wasn't adding features — it was removing visual noise. Every element I took away made what remained more powerful. Less is genuinely more.

🎨

Color has a job to do

When everything is colorful, nothing stands out. Using orange as a single accent — only for actions and highlights — made the whole interface feel intentional and easy to navigate.

👩‍🏫

Daily-use design is a different game

Teachers use SilidLMS for hours every single day. A small frustration in testing becomes huge over weeks. I always ask now: "Would I want to use this 50 times a day?"