AI-Powered LMS Tool
Personalised design learning that turns tutor feedback into actionable growth, right inside your design workflow.
Year:
2025
Tools:
Figma, Miro
Category:
Ed-Tech
6 core sections
Home, Projects, Assignment Overview, Feedback, Rubric Alignment, Learning Journey
Cross Integration
Monash ecosystem
Launched from the existing student portal, sitting alongside Moodle, WES, and Library
Problem
Students get feedback from too many places at once — written comments in Moodle, verbal critique in studio sessions, a rubric buried in a unit guide, and their actual work sitting open in a separate Figma tab. None of these talk to each other. A student reads “needs work on visual hierarchy,” has no idea what that maps to on the rubric, no clear path to a resource that would actually help, and no way to link that comment back to the specific frame it refers to.
The feedback loop ends at the comment. It never reaches the work.
Content
Feedback needs a destination, not just a delivery. A comment that names a problem without a path to fixing it is a grade with extra steps.
Students don’t read rubrics — they read scores.
The rubric exists in every unit. Translating “Design Principles in GUI Design: 2/5” into an actual next action is cognitive work most students never do.
The fix lives in the file, not in the LMS.
Feedback about a design screen is useless when it’s three tab-switches away from that screen.
It had to live inside what students already use.
A standalone app nobody opens loses to a portal tile next to Moodle that students click every single day.
Every existing LMS and feedback tool was solving the same question: how do we deliver feedback better? Better formatting, cleaner UI, richer annotations. But feedback isn’t a document problem. It’s a diagnosis problem — and a diagnosis without a treatment plan doesn’t change behaviour.
The real question wasn’t “how do we show feedback more clearly?” It was: “what is the shortest path from a comment to the specific fix, inside the tool where the student is already working?”
Once that became the design brief, the structure followed naturally. Feedback needed to route directly to a rubric gap. That rubric gap needed to generate a learning path. That learning path needed to surface inside the design file — not in a separate browser tab.
Solution
Vision Voice is an AI layer embedded in the Monash student portal that ingests project feedback and rubric criteria and turns them into a structured, sequential learning path — then closes the loop by surfacing that path directly inside Figma, where the student is already working.
The product has six top-level sections: Home, Project Overview, Assignment Overview, Feedback, Rubric Alignment, and Learning Journeys. Each one feeds the next. The dashboard surfaces where you stand. The project view shows what’s been submitted. The feedback tab surfaces what markers said — and lets you listen to it. The rubric tab scores that feedback against real marking criteria. The learning journey turns those gaps into tutorials and exercises. And the Figma plugin takes you back into the file with the fix attached to the frame.
My Role
→ Co-designer across the full project: information architecture, user flows, wireframes, high-fidelity UI, and interactive prototype
→ Owned the Assignment Overview and Figma plugin interaction design end-to-end
→ Contributed to the Feedback, Rubric Alignment, and Learning Journey flows
→ Built and tested the cross-tool handoff between the web app and the Figma plugin touchpoint
Impact
70–80% of users completed core tasks, logging intake and checking progress, without assistance.
Faster task completion was observed against the original app’s flow in side-by-side prototype testing.
Higher perceived usefulness was reported once goal-setting was introduced, based on post-test interviews.
Key Decisions
What we almost did: Build a standalone web app with its own login and URL.
What we did instead: Positioned Vision Voice as a portal tile inside the existing Monash student portal’s app launcher, sitting directly alongside Moodle, WES, Gmail, Library, and Allocate+.
A standalone tool has to earn daily usage from scratch. A portal tile borrows the habit and trust of a system students open every morning. The authentication happens through Monash SSO — students are already logged in before Vision Voice ever loads.
What we almost did: Display feedback comments more clearly, better typography, cleaner layout.
What we did instead: Built a Rubric Alignment view that translates every piece of feedback into a score against the actual unit marking criteria — with a per-category breakdown, an overall score out of 100, and an estimated letter grade.
Written feedback and a final grade tell a student what a marker thought. They don’t tell a student where they lost marks or what they need to improve to change that outcome next time. The rubric comparison table (Criteria / Your Score / Max Score / Status) makes the gap explicit and bounded rather than subjective and vague.
Calling out “Application of design principles in GUI design: 2/5, In progress” is a completely different signal to “needs work on hierarchy.”
What we almost did: Link to a resource library from the feedback screen.
What we did instead: Built a Figma plugin that attaches Vision Voice feedback directly to the frames it refers to — as inline comments on the canvas — and gates the suggested fix behind the matching learning module before the student can act on it.
A learning resource in a separate browser tab gets abandoned the moment the student switches back to Figma. The Figma plugin keeps the feedback co-located with the work. When a student clicks “Inconsistent Colours — please check your colour…” on their own canvas, a Vision Voice panel opens showing the specific feedback from the marker, the key failure modes (Poor Contrast, Overusing Bright or Saturated Colors, Ignoring Colour Harmony), and a “Learning Required First” gate before they can action the suggestion. The button takes them directly into the matching tutorial.
The fix sits exactly where the mistake happened, not three clicks and a context switch away.
Deep Dive
Context
Design students at Monash University submit project work across multiple tools — files in Figma, written briefs via Moodle, presentations in studio. Feedback arrives through whichever channel a given tutor prefers: Moodle comment threads, verbal critique in class, marked PDFs emailed after submission. The rubric — which is the actual basis for the grade — is rarely referenced again after week one. Most students see their grade, read the comments once, and move on without understanding which criteria they underperformed on or what they would need to study to improve.
The result is a feedback loop that closes at the grade and never reopens.
Problem Statement
“How might we create a system that transforms fragmented academic feedback into a clear, actionable, and personalised learning journey — integrated into the tools students already use?”
Feedback Has No Next Step
A comment describes a problem but doesn’t tell a student what to study, practice, or fix to address it.
The Rubric Is Effectively Invisible
Students receive a final grade but rarely see a breakdown of where they lost marks against specific criteria. The rubric exists; connecting it to the feedback they received doesn’t.
The Fix Lives Somewhere Else
Even when a student understands the feedback, acting on it means leaving the LMS, searching for a resource, then navigating back to the file they were working on.
Generic Resources, Specific Problems
Existing resource libraries are unsorted and untargeted. A student with a typography gap has to dig through unrelated material to find what’s relevant to them.
Audio Feedback Is Inaccessible
Research
Phase 01 — Mapping the existing student workflow
We mapped the current feedback experience end-to-end using Miro: from assignment submission through grade receipt, feedback reading, and any subsequent action the student took. The mapping revealed that the journey reliably broke at the same point — after reading feedback, students had no structured path forward. The LMS offered no connection between the comment and any resource that might address it.
Phase 02 — Identifying the category problem
We reviewed existing LMS platforms (Moodle, Canvas, Blackboard) and edtech feedback tools to understand where they stopped. Every one of them solved feedback delivery — better comment UI, richer annotation, inline marking — but none solved feedback routing: what a student does with the comment after reading it. This framing (“delivery vs routing”) became the lens through which every subsequent design decision was evaluated.
Phase 03 — Defining the AI opportunity
Three specific AI applications emerged as genuinely useful rather than decorative: rubric scoring (mapping feedback to criteria automatically), learning path generation (surfacing relevant tutorials and exercises based on identified gaps), and contextual assistance (a chat interface scoped to whatever tutorial the student is currently in, answering questions without requiring them to leave the lesson). All three are represented in the final design.
Design Pillars
Feedback Needs a
Destination
Every piece of feedback routes to a specific, actionable next step. Comments exist to be acted on, not filed.
Score Against Real
Criteria
The rubric is the source of truth. Feedback is always translated into rubric terms so students understand exactly where they stand against what’s being measured.
The Fix Lives Where the Mistake Happened
Learning content surfaces inside the tool the student is already using — not in a separate destination they have to remember to visit.
Earned Action, Not Just Information
Suggested fixes are gated behind the learning that explains them. Students build the underlying understanding before patching the surface symptom.
Features
Dashboard — A personalised home screen showing Active Projects (with module completion progress), Learning Journey progress, Overall Progress percentage, Recent Feedback from markers (surfaced immediately, not buried in a project view), Recommended Focus Areas based on assignment performance, and Key Strengths based on learning history.
Project Overview — A consolidated view of all submitted and in-progress projects, synced directly from Moodle. Each project card shows the unit code, due date, professor name, module completion progress (e.g. 12/15 Modules), and a View Progress CTA. Filters by Subject, Status, and Due Date. A “Sync from Moodle” button keeps the list current without manual entry.
Rubric Alignment — An AI-scored breakdown of the student’s submission against the actual unit marking criteria.
Per-category scores — displayed as card pairs:
Recommended Focus Areas (based on assignment performance):
Key Strengths (based on learning journey):
Detailed Rubric Comparison Table
Generated Learning Journey — An AI-generated curriculum built specifically from the gaps surfaced in the Rubric Alignment view — not a generic resource library.
Tutorials — curated video and PDF content relevant to identified gaps:
Exercises — targeted practice tasks: Colour Palette Creation (Master colour theory and accessibility principles), Typography Hierarchy (Design clear and readable text structures).
AI-generated fix task — “Fix Mobile Navigation: Address the mobile navigation issues identified in the feedback. Implement a functional hamburger menu and ensure proper responsive behaviour.”
An embedded Vision Voice chat assistant sits alongside the video player, scoped specifically to whatever tutorial the student is currently watching — answering questions in context without requiring them to leave the lesson.
Figma Plugin — The final touchpoint in the loop. Vision Voice attaches feedback directly to the frames it refers to inside the student’s Figma file, as inline comment bubbles on the canvas.
Clicking a bubble opens a Vision Voice panel inside Figma showing:
The specific feedback category (e.g. “Colour Theory”)
The marker name and date
The key failure modes identified (Poor Contrast, Overusing Bright or Saturated Colours, Ignoring Colour Harmony), each with a brief explanation
A “Learning Required First” gate: “Please complete the colour theory and accessibility learning modules to better understand how to apply the suggested improvements from this feedback effectively.”
A “Go to Learning Journey” CTA that routes the student directly to the matching tutorial
Gallery
The IA was the hardest problem, not the UI. The temptation early was to collapse Feedback and Rubric Alignment into a single screen — one view that showed both what markers said and how that mapped to the grade. We kept them separate deliberately, because they answer different questions. Feedback is qualitative and personal. Rubric alignment is scored and criteria-driven. Blending them would have muddied both. Getting the information architecture right before touching visual design was what made the rest of the project coherent.
The Figma plugin changed the nature of the product. Without the plugin, Vision Voice is a well-designed LMS with AI features. With it, it becomes a system that closes the loop between feedback and the actual work. That single touchpoint elevated the concept from "better feedback UI" to "redesigned feedback workflow." It's also the most original idea in the project, and the one that would be hardest to replicate by adding a feature to Moodle. In a portfolio context, it's the decision worth explaining at length.
Gating fixes behind learning is intentional friction. The "Learning Required First" mechanic in the Figma plugin will frustrate some students who just want the quick answer. That's the point. An app that lets a student patch a colour contrast issue without understanding why contrast matters produces a fixed frame and an unchanged skill. The gate is a design decision, not a limitation — and it's worth defending directly in an interview rather than downplaying.
