Music Player

Baut einen browserbasierten Musikplayer mit Web-Audio-API, Equalizer, Playlists und Visualisierung.

Der Prompt

Develop a web-based music player using HTML5, CSS3, and JavaScript with the Web Audio API. Create a modern interface with album art display and visualizations. Implement playlist management with drag-and-drop reordering. Add audio controls including play/pause, skip, seek, volume, and playback speed. Include shuffle and repeat modes with visual indicators. Support multiple audio formats with fallbacks. Implement a 10-band equalizer with presets. Add metadata extraction and display from audio files. Create a responsive design that works on all devices. Include keyboard shortcuts for playback control. Support background playback with media session API integration.

So nutzt du es

Den Prompt-Text kopieren (Button oben) und als System-Prompt bzw. erste Nachricht in ChatGPT, Claude oder einem lokalen Modell einfügen. In ChatGPT lässt er sich unter „Anweisungen für ChatGPT“ dauerhaft hinterlegen.

Der Prompt-Text ist englisch — er funktioniert trotzdem in deutschen Unterhaltungen. Für deutsche Antworten einfach am Ende ergänzen: „Antworte auf Deutsch.“

Im Detail

Ein Feature-Katalog für einen browserbasierten Musikplayer mit Web Audio API: Albumcover-Anzeige, Visualisierungen, Drag-and-Drop-Playlists, 10-Band-Equalizer mit Presets, Metadaten-Extraktion, Media-Session-Integration für Hintergrundwiedergabe und Tastaturkürzel. Der Mehrwert liegt in der Kombination aus UI- und Audio-technischen Anforderungen in einem Prompt, sodass mehr als nur ein simpler Play/Pause-Player entsteht. Realistisch ist der Umfang groß – vor allem Equalizer und Visualisierung über die Web Audio API sind technisch anspruchsvoll, sodass generierter Code meist Nacharbeit braucht. Geeignet für Entwickler, die schnell ein funktionsreiches Player-Grundgerüst prototypen wollen.

Praxis-Tipp

Zuerst nur Grundfunktionen (Play/Pause, Playlist) generieren lassen, Equalizer und Visualisierung danach als separate Anfrage nachreichen.

Lizenz & Quelle

• Lizenz: CC0-1.0 (Public Domain)
• Quelle: awesome-chatgpt-prompts (GitHub)

Lade …