MBS Mohammed Baobaid
All cases
Case Study
Product UI 6 weeks

Education Management Concept

Learning-platform screens for content, progress, and administration.

A product concept focused on clearer course operations, simple progress visibility, and admin tools that can scale beyond a single cohort.

Laravel Figma Tailwind MySQL
Education Management Concept case study preview
3 User roles
24+ Screens designed
8 User flows
High Prototype fidelity

Role

Prototype lead

Outcome

Mapped the core user flows before implementation decisions were locked.

The Challenge

Education platforms often prioritize content delivery over operational clarity. Instructors and administrators needed a system where managing courses, tracking progress, and handling enrollments felt as intuitive as the learning experience itself.

The Approach

I started with user flow mapping in Figma, identifying the critical paths for three roles: learner, instructor, and admin. From there, I built interactive prototypes in Tailwind that validated the UI patterns before any backend work began. The data model was designed to support multi-cohort scaling from day one.

How it works

User flow mapping

Each role was mapped through its core journey: learners from enrollment to completion, instructors from content creation to grading, and admins from cohort setup to reporting. Edge cases and error states were documented at each decision point.

Prototype-first validation

Before writing any backend code, interactive Tailwind prototypes were built and tested with potential users. This approach caught three major usability issues that would have been expensive to fix after implementation.

Scalable data model

The database schema was designed with future scaling in mind: courses can belong to multiple cohorts, content can be versioned independently of enrollment data, and progress tracking supports both automated and instructor-assessed milestones.

Results

  • Complete user flow maps for three distinct roles
  • Interactive prototype that validated UI decisions before development
  • Data model supporting multi-cohort and multi-course structures
  • Responsive layouts tested across mobile, tablet, and desktop

Key features

01 Course workflow mapping
02 Learner progress views
03 Admin content model
04 Responsive UI prototype

Tech stack

Laravel Figma Tailwind MySQL

Interested in similar work?

I build systems like this for teams that need reliable engineering, clean interfaces, and measurable outcomes.