UX / Product Design Case Study

IEP Management
Platform

A system that translates complex IEP documents into actionable, trackable workflows for teachers supporting special education students.

UX Designer & Product Strategist
Web App — EdTech
Figma, Framer
WIP — Phase 1 Complete
Student Dashboard Lesson Plan Generator Student IEP View
01 — Background

The Problem Space

🔍 Core Problem

Teachers struggle to track individual IEP goals and progress, leading to inconsistent instructional support and inequitable learning outcomes for students with special needs.

💡 Our Solution

Automatically translate IEP objectives into actionable guidance and reminders — so teachers can better support students without extra planning overhead.

02 — User Research

Who We're Designing For

The primary users are K–8 special education teachers, many of whom did not grow up with technology. This shaped every decision: explicit labels, one-click navigation, and a supportive tone throughout.

USER NEED 01

Reduced Planning Overhead

Teachers spend excessive time manually parsing IEP documents. They need instant, digestible goal breakdowns they can act on.

USER NEED 02

Clear Progress Visibility

Without a centralized system, tracking progress across multiple students is fragmented. Teachers need one source of truth per student.

USER NEED 03

Accessible Interface

Many users are not tech-comfortable. The interface must prioritize clarity over visual flair — usability wins every time.

03 — Design Direction

Visual & UX Principles

Inspired by Khan Academy's clarity, Playground IEP's warmth, and ChatGPT's minimalism — the goal was a platform that feels like a supportive co-teacher, not a cold tool.

Typography

Poppins for headers — rounded, friendly, educational. Nunito Sans for body — warm and readable at all sizes.

Design Principles

Rounded everything. Pastel-based calm contrast. Explicit labels. No hover dropdowns. Large, obvious CTAs. One-click navigation throughout.

04 — Early Planning

Original Concept & Wireframes

Before any high-fidelity screens, the flow was mapped out by hand — sketching the student dashboard grid, the IEP goal view, and the lesson plan generator inputs. These wireframes defined the core layout logic before any visual decisions were made.

Wireframe — Dashboard and IEP view Wireframe — Lesson generator and PDF output
05 — Key Screens

Interface Design

Four screens define the full teacher workflow — from onboarding a student to generating a lesson plan.

Student Dashboard

The central hub showing all students in a class. Each card is large and clearly labeled — tap to enter that student's IEP profile.

  • Grid layout with large touch targets
  • Select Class dropdown for multi-class teachers
  • + card to add a new student inline
  • Consistent avatar colors per student
Student Dashboard

Add Student Form

When a teacher clicks +, they enter student name, grade, and upload the IEP file. The system parses it automatically to build the student's profile.

  • Minimal fields — name, grade, IEP upload
  • IEP parsed on submit to extract goals
  • Teacher approves the profile before it's created
Add Student Form

Lesson Plan Generator

Select one or more students — their IEP context auto-populates the prompt. Upload supplementary files and type specific instructions.

  • Student selector with avatar IDs
  • Upload IEP file for auto-parsing
  • Free-text instruction area
  • Does NOT look like ChatGPT — educational framing throughout
Lesson Plan Generator

Student IEP View

Clicking a student surfaces their full IEP goals — organized by subject (ELA, Math, Speech) with a Switch Student panel on the right.

  • One student shown at a time, no clutter
  • Quick-switch sidebar for class roster
  • Generate Lesson Plans CTA anchored to context
  • Color-coded subject areas
Student IEP View
06 — Feature Architecture

What the Platform Does

Four core feature pillars, each building on the last.

FEATURE 01

IEP Upload & Parsing

Teachers upload a PDF, DOCX, or TXT. The backend scans for Annual Goals and Objectives, tagging each by subject area, skill type, standard, and end date.

FEATURE 02

Student Dashboard

Once profiles are created, teachers see a holistic weekly breakdown with checkboxes to mark progress, an editing feature, and an accommodation checklist.

FEATURE 03

IEP Goal Tracker

Goals are spread over the school year accounting for frequency, timeframe, difficulty, and dependencies. Teachers can adjust at any time.

FEATURE 04

AI Support Assistant

Each weekly goal has a "Generate Materials" button that opens a chat with the student's context pre-loaded — producing worksheets, visual aids, and more.

07 — Data Architecture

Database Schema

A clean relational model: each teacher connects to students, each student has one IEP, and each IEP holds subject-specific goals.

👩‍🏫 Teachers

  • teacher_id (PK)
  • first_name
  • last_name
  • email (required)
  • password (required)
  • department

🎒 Students

  • student_id (PK)
  • first_name
  • last_name
  • grade_level
  • date_of_birth
  • teacher_id (FK)

📄 IEPs

  • iep_id (PK)
  • student_id (FK)
  • ela_goals
  • math_goals
  • general_goals
  • start_date / end_date

🎯 Goal Tracker

  • goal_id (PK)
  • iep_id (FK)
  • subject_area
  • skill_type
  • frequency
  • mastery_date
08 — Reflection

What I Learned

🧠 Designing for Non-Tech Users

Every decision had to be justified by "will a 55-year-old teacher understand this immediately?" It pushed me toward radical clarity — more labels, bigger buttons, zero hover-only interactions.

⚖️ Usability vs. Aesthetics

The design doc's core rule — if usability and beauty conflict, choose usability — forced me to cut several clever UI patterns in favor of predictable, obvious ones.

🏗️ System Before Screens

Mapping the database schema before designing ensured every UI element had a data source. This caught gaps early and made the product feel coherent end-to-end.

🚀 What's Next

Phase 2 includes a generated lesson plan PDF view, parent-facing progress pages, and a live prototype for usability testing with real teachers.