All MicroEvals
Build a ui (as a single-file .html w/ embedded CSS/JS page) ...
Create MicroEval
Header image for Build a ui (as a single-file .html w/ embedded CSS/JS page) ...

Build a ui (as a single-file .html w/ embedded CSS/JS page) ...

Prompt

Build a ui (as a single-file .html w/ embedded CSS/JS page) that takes in an audio file and SRT file (the SRT file has the entire thing transcribed word-by-word) and displays a UI playing the audio and the SRT caption words in real time in a way that's stimulating and visually pleasing. This modern design system embraces an ultra-minimalist, flat aesthetic built on a crisp, light-themed black and white palette. Every interface element features fully rounded corners (where applicable) to create a friendly, cohesive pill-shaped UI. The system relies on a strong, deliberate layout and exceptional typography leveraging the clean, contemporary feel of Geist, IBM Plex Sans, and Inter to deliver a unified and effortlessly premium user experience.

A system prompt was added to support web rendering

Drag to resize
Drag to resize
Drag to resize
Drag to resize