Grades dashboard and course screen with motion prototype

A demo built for a specific brief. Not client work: the material shown is sample data, so what is on display is the mechanism.

I built a sample grades companion, placeholder name Tally, for a placeholder student: a dashboard that leads with what needs attention (2 missing, 6 due this week), course cards with averages, letter grades and trend lines, and one connected course screen, each on desktop web and a 390 px phone. Every average is computed from 48 sample assignment rows with weighted categories. The interactive prototype, structured like a Figma prototype, shows 5 transitions with durations and easing from one motion spec: the course card grows into the course header, the header returns to its card, filtered rows slide to their new places, and a what-if score counts the projected average up or down. A 16.4 second walkthrough video records the transitions on desktop and phone; 2.44% of its frames are identical to the frame before. Source frames are editable SVG with named layers and live text.