challenge · v0

Music Player

One prompt. One attempt per model. No retries, no edits. This is the text, section by section, and verbatim at the bottom.

The entries

Challenge results

Every public run, including failed entries. Correctness is a review label, separate from preference. Archived entries are outside the arena.

the brief

Build a beautifully designed web music player for the supplied four-track EP.

The player should make browsing, playing, and switching songs feel effortless. Choose your own visual identity, layout, typography, colors, and interaction style.

Version
v0
Attempts
1
Requirements
4
Words
317
01

Required Experience

Show all four tracks and clearly identify the selected track.

Implement play/pause, previous/next, seeking, elapsed time, duration, and volume. Selecting a different track starts it. Only one track may play at a time. When a track ends, advance to the next; stop when the final track finishes unless the user has enabled an optional repeat mode.

Start with the first track selected and playback paused. Do not autoplay on page load.

Keep controls synchronized with actual audio playback. Handle loading and playback errors clearly. Do not invent durations or display a simulated waveform as actual audio data.

02

Design Quality

Prioritize typography, spacing, hierarchy, and a cohesive visual identity. Make the player comfortable to use on desktop and mobile, with accessible labels, keyboard-operable controls, visible focus, and readable contrast.

Use motion purposefully and respect reduced-motion preferences.

You may add features that meaningfully improve the listening experience. Prioritize a cohesive, polished player over the number of features. Additional features receive no credit unless they work and improve usability.

03

Delivery

Return one complete HTML file with embedded CSS and JavaScript. Use no external libraries or fonts. Only the supplied audio and artwork URLs may be loaded; they are served from the same origin as your page, so use the paths exactly as given.

Do not identify your model or provider. Do not ask follow-up questions.

Return only the HTML, without Markdown fences or explanation.

04

Ep And Assets

Tree City by TreeCityWes

  1. 01Tree City — audio /assets/v2/01.mp3 — artwork /assets/v2/01.jpg
  2. 02Dirty Code — audio /assets/v2/02.mp3 — artwork /assets/v2/02.jpg
  3. 03Hashing in the Garden — audio /assets/v2/03.mp3 — artwork /assets/v2/03.jpg
  4. 04RubberDuckin' — audio /assets/v2/04.mp3 — artwork /assets/v2/04.jpg
Exact text · what every model receivedshow
MUSIC PLAYER — benchmaxx.ing prompt v0

Build a beautifully designed web music player for the supplied four-track EP.

The player should make browsing, playing, and switching songs feel effortless. Choose your own visual identity, layout, typography, colors, and interaction style.

REQUIRED EXPERIENCE

Show all four tracks and clearly identify the selected track.

Implement play/pause, previous/next, seeking, elapsed time, duration, and volume. Selecting a different track starts it. Only one track may play at a time. When a track ends, advance to the next; stop when the final track finishes unless the user has enabled an optional repeat mode.

Start with the first track selected and playback paused. Do not autoplay on page load.

Keep controls synchronized with actual audio playback. Handle loading and playback errors clearly. Do not invent durations or display a simulated waveform as actual audio data.

DESIGN QUALITY

Prioritize typography, spacing, hierarchy, and a cohesive visual identity. Make the player comfortable to use on desktop and mobile, with accessible labels, keyboard-operable controls, visible focus, and readable contrast.

Use motion purposefully and respect reduced-motion preferences.

You may add features that meaningfully improve the listening experience. Prioritize a cohesive, polished player over the number of features. Additional features receive no credit unless they work and improve usability.

DELIVERY

Return one complete HTML file with embedded CSS and JavaScript. Use no external libraries or fonts. Only the supplied audio and artwork URLs may be loaded; they are served from the same origin as your page, so use the paths exactly as given.

Do not identify your model or provider. Do not ask follow-up questions.

Return only the HTML, without Markdown fences or explanation.

EP AND ASSETS

Tree City by TreeCityWes

1. Tree City — audio /assets/v2/01.mp3 — artwork /assets/v2/01.jpg
2. Dirty Code — audio /assets/v2/02.mp3 — artwork /assets/v2/02.jpg
3. Hashing in the Garden — audio /assets/v2/03.mp3 — artwork /assets/v2/03.jpg
4. RubberDuckin' — audio /assets/v2/04.mp3 — artwork /assets/v2/04.jpg

Results on the leaderboard. Scoring on methodology.