Preview image. Unlock full-res
A p5.js-powered class website for IML300 at USC featuring a scrolling list of student names with a vibrant animated color blob that moves through the typography.
Summary
A p5.js-powered class website for IML300 at USC featuring a scrolling list of student names with a vibrant animated color blob that moves through the typography.
Visual description
A vertical list of student names in black sans-serif type scrolls down a light gray background. A soft, multicolored animated blob transitions through purple, blue, green, yellow, orange, and pink as it moves through the typography, creating a dynamic gradient effect that reveals and highlights names. The page header displays the course title and semester at the top, while professor and institutional credits appear at the bottom. The animated blob is the primary visual focus, transforming an otherwise minimal roster into an interactive experience.
Key takeaway
Animate a soft, multicolored blob that moves through a vertical text list to create playful, eye-catching interactivity that energizes a simple typographic layout without adding visual clutter.
Reuse notes
Reach for this as a ui screen reference. Pairs with typographic, minimal directions. Original by Qianqian Ye.
