
A demo built for a specific brief. Not client work: the material shown is sample data, so what is on display is the mechanism.
Grades dashboard and course screen with motion prototype, animated preview
I built a grades companion for Tally, a fictional product, and a fictional 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 fictional 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.

Grades dashboard and course screen with motion prototype 1

Grades dashboard and course screen with motion prototype 2

Grades dashboard and course screen with motion prototype 3
0 likes · 2 views · Sep 23, 2026
A new design direction for a student grades companion: attention-first dashboard, connected course screen, web and phone layouts, and a prototype whose transitions each have a stated purpose.