{"id":10195,"date":"2026-02-20T20:04:55","date_gmt":"2026-02-20T19:04:55","guid":{"rendered":"https:\/\/anb030.de\/a\/?p=10195"},"modified":"2026-02-27T12:32:32","modified_gmt":"2026-02-27T11:32:32","slug":"hoerspielwerk-webapp","status":"publish","type":"post","link":"https:\/\/anb030.de\/a\/hoerspielwerk-webapp\/","title":{"rendered":"Das H\u00f6rspielwerk: Wie aus einer famili\u00e4ren Idee unser digitales Archiv entstand"},"content":{"rendered":"\n
\"Titelbild:<\/figure>\n\n\n\n

Dieser Blogartikel widmet sich einem Thema, das urspr\u00fcnglich vor allem f\u00fcr uns als Familie gedacht war. Er k\u00f6nnte jedoch auch f\u00fcr den einen oder die andere von euch interessant sein. Die Idee zu unserem Archiv entstand aus einem ganz pragmatischen Problem: Da Apple Music keine M\u00f6glichkeit bietet, geh\u00f6rte H\u00f6rspiele sichtbar zu markieren, wurde der Wunsch nach einer eigenen L\u00f6sung immer gr\u00f6\u00dfer. In diesem Sinne: Willkommen im Artikel!<\/p>\n\n\n\n\n\n\n\n

Im Mittelpunkt steht die bereits bestehende Sammlung, die seit Mai 2023 existiert und seither stetig gewachsen ist. Es geht dabei vor allem um die Neugestaltung des pers\u00f6nlichen H\u00f6rspiel-Archivs. Ende 2025 gab es daher einen entscheidenden Wendepunkt. Nach etwa drei Monaten gelegentlicher Arbeit wurde das alte, extrem pflegeaufwendige WordPress-Archiv St\u00fcck f\u00fcr St\u00fcck in ein v\u00f6llig neues Datenbank-Projekt \u00fcberf\u00fchrt. Das Ziel war ein modernes Design und System, das dem heutigen H\u00f6rspielgenuss gerecht wird, \u00fcbersichtlicher ist, sich leichter pflegen l\u00e4sst und optisch ansprechender ist. So entstand mit viel Liebe zum Detail und einer gesunden Portion \u201eMonk-Syndrom\u201c das neue Archiv namens \u201eH\u00f6rspielwerk<\/a><\/strong>\u201c. Wer das Projekt gerne mitnutzen und komfortabel als Web-App verwenden m\u00f6chte, findet daf\u00fcr ein eigenes, stylisches App-Icon. Ein freundliches Erdm\u00e4nnchen mit Kopfh\u00f6rern symbolisiert unsere famili\u00e4re Leidenschaft f\u00fcr H\u00f6rspiele und dient zugleich als sympathischer Wegweiser auf dem Home-Bildschirm.<\/p>\n\n\n\n

<\/p>\n\n\n

\n
\"Screenshot:<\/figure>\n<\/div>\n\n\n

<\/p>\n\n\n\n

Die Geburtsstunde des Projekts \u2013 Ordnung im Streaming-Chaos<\/h2>\n\n\n\n

Wie in der Einleitung zum Blogartikel bereits erw\u00e4hnt, war der Ausl\u00f6ser f\u00fcr das Projekt der einfache Wunsch, nie wieder ein Abenteuer doppelt zu h\u00f6ren und den \u00dcberblick \u00fcber komplexe Serien-Kollektionen zu behalten. Zwar bietet Apple Music eine riesige Auswahl, aber keine komfortable M\u00f6glichkeit, die komplette Albensammlung einer Serie auf einen Blick zu erfassen \u2013 geschweige denn eine Liste, in der man auf Anhieb sieht, welche Folgen bereits geh\u00f6rt wurden. Dieses Navigationsproblem l\u00f6st das H\u00f6rspielwerk jedoch durch intelligente Verkn\u00fcpfungen. So gelangt man direkt zur H\u00f6rspiel-Kategorie oder zur Serien\u00fcbersicht in der Apple-Music-App. Das Ganze wird durch eine handgepflegte Stammdaten-Datei bewerkstelligt, die im Hintergrund die verschiedenen F\u00e4den zusammenf\u00fchrt und so wird letztendlich mit Hilfe einer weiteren Datei namens Geh\u00f6rt das ganze Projekt<\/a><\/strong> auf der Hauptseite ordentlich dargestellt. So ist ein strukturiertes System entstanden, das f\u00fcr Ordnung im Streaming-Chaos sorgt und daf\u00fcr, dass jede Folge genau dort zu finden ist, wo man sie erwartet.<\/p>\n\n\n\n

<\/p>\n\n\n

\n
\"Screenshot:<\/figure>\n<\/div>\n\n\n

<\/p>\n\n\n\n

Die technischen Grenzen \u2013 die realen H\u00fcrden des Projekts<\/h2>\n\n\n\n

Doch auch unser Projekt \u201eH\u00f6rspielwerk<\/a><\/strong>\u201d ist nicht frei von H\u00fcrden. Apple fasst verschiedene Serien h\u00e4ufig unter einem einzigen H\u00f6rspiel-Titel mit mehreren Folgen zusammen. Diese Struktur l\u00e4sst sich von au\u00dfen kaum sauber aufl\u00f6sen. Selbst mit dem eigenen Archiv st\u00f6\u00dft man so oft an Grenzen. Hinzu kommt, dass Apple keine frei zug\u00e4ngliche Schnittstelle (Web-API) anbietet. Wer auf die Daten zugreifen m\u00f6chte, muss als iOS-App-Entwickler mit Developer-Account arbeiten, um Apples MusicKit-Framework nutzen und entsprechend implementieren zu k\u00f6nnen. Daher ist das H\u00f6rspielwerk im Gro\u00dfen und Ganzen ein liebevoll handgepflegtes Projekt. Sollte sich jedoch ein App-Entwickler angesprochen f\u00fchlen und Lust haben, meine Idee als echte App umzusetzen, darf er mich gerne kontaktieren. <\/p>\n\n\n\n

Das technische Fundament \u2013 der Maschinenraum des H\u00f6rspielwerks<\/h2>\n\n\n\n

Hinter der sauberen Design-Oberfl\u00e4che werkelt ein solides PHP-Backend, das auf eine effiziente Datenverwaltung setzt. Anstelle einer klassischen SQL-Datenbank werden Informationen in schlanken JavaScript Object Notation Dateien wie \u201egehoert-Datei\u201d f\u00fcr bereits geh\u00f6rte Folgen oder \u201eupnext-Datei\u201d f\u00fcr bald verf\u00fcgbare Folgen gespeichert. Das macht das System extrem schnell und wartungsfreundlich. F\u00fcr den Adminbereich gibt es acht Sicherheitsmerkmale. Darunter ist zum Beispiel ein Verzeichnisschutz via .htaccess zum Schutz der Rohdaten. Zusammen bilden sie einen Schutzmechanismus gegen Angriffe. Die weiteren sieben Sicherheitsmerkmale werden selbstverst\u00e4ndlich nicht preisgegeben. \u00dcber die separate LogIn-Seite k\u00f6nnen so die Stammdaten mit diversen integrierten Bearbeitungsfunktionen gepflegt werden. <\/p>\n\n\n\n

Das Admin-Backend verf\u00fcgt \u00fcber ein dynamisches Serien-Management mit automatischer ID-Generierung. Dabei werden Seriennamen in saubere, systemkonforme Schl\u00fcssel f\u00fcr Datens\u00e4tze und Bilddateien umgewandelt. Beim Anlegen einer Serie werden Cover-Uploads direkt validiert, umbenannt und mit dem Datensatz verkn\u00fcpft. Die integrierte L\u00f6sch-Logik arbeitet kaskadierend: Beim Entfernen einer Serie werden die Stammdaten, das physische Cover-Bild sowie s\u00e4mtliche zugeh\u00f6rigen Eintr\u00e4ge in der Historie und im Radar simultan gel\u00f6scht. Diese strikte Datenhygiene verhindert verwaiste \u201eUnbekannt\u201c-Eintr\u00e4ge und sorgt in Kombination mit einem Sicherheitsfilter im Frontend f\u00fcr ein stets konsistentes und fehlerfreies Archiv.<\/p>\n\n\n\n

Damit das Erlebnis auf jedem Endger\u00e4t im Frontend \u00fcberzeugt, wurde die Seite vollst\u00e4ndig responsiv und \u201eiOS Web-App Ready\u201c programmiert. Ein intelligentes Grid-System passt das Layout automatisch an, von der einspaltigen Smartphone-Ansicht bis zur zweispaltigen Tablet-\u00dcbersicht. Dank technischer Raffinessen wie dem Smart-Release-Radar f\u00fcr bald verf\u00fcgbare Folgen und einer automatischen Backup-Funktion bleibt das Archiv stets aktuell und sicher. Zus\u00e4tzliche Funktionen wie die Smart History sorgen f\u00fcr \u00dcbersichtlichkeit: Standardm\u00e4\u00dfig werden pro Serie nur die letzten drei Folgen angezeigt. Eine vollst\u00e4ndige Darstellung pro Serie l\u00e4sst sich bei Bedarf bequem per Dropdown-Men\u00fc aktivieren. <\/p>\n\n\n\n

Das System wird durch Smart Analytics erg\u00e4nzt, eine automatisierte Berechnung der durchschnittlichen Ver\u00f6ffentlichungszyklen pro Folge. Das Archiv analysiert dazu die historischen V\u00d6-Abst\u00e4nde der Datenbank und ermittelt das typische Ver\u00f6ffentlichungsintervall in Tagen und Monaten. Eine eigene Schriftart f\u00fcr den Seitentitel sowie durch Ber\u00fchrung vergr\u00f6\u00dferbare Coverbilder sorgen f\u00fcr eine visuelle Tiefe, die perfekt mit der modernen HTML 5 Webtechnologie harmoniert. Es ist also eine technische Hommage an das klassische H\u00f6rspiel, kombiniert mit moderner Webentwicklung und einem dezenten Berliner Einschlag, der dem Projekt meine ganz pers\u00f6nliche Note verleiht.<\/p>\n\n\n\n

<\/p>\n\n\n\n

\u24d8 Wenn ihr Interesse an den Skripten f\u00fcr das Frontend bzw. Backend habt, k\u00f6nnt ihr mich gerne \u00fcber die bekannten Kan\u00e4le kontaktieren.<\/p>\n\n\n\n

<\/p>\n\n\n

\n
\"Zur<\/a><\/figure>\n<\/div>\n\n\n

<\/p>\n\n\n\n

Audio Zusammenfassung (via NotebookLM)<\/h2>\n\n\n\n

Ich bin ein \u201eEin-Personen-Betrieb\u201c, arbeite hauptberuflich im Gesundheitswesen und betreibe diese Seite als Hobbyprojekt in meiner Freizeit. Wenn Ihnen meine Arbeit gef\u00e4llt (die Beitr\u00e4ge, die Hintergrundbilder, mein allgemeines Auftreten \u2026 einfach alles), so d\u00fcrfen Sie gerne in Erw\u00e4gung ziehen, mir eine kleine Spende f\u00fcr zum Beispiel einen Caf\u00e9 \u2615\ufe0f per PayPal.com<\/a><\/strong> zukommen zu lassen! Ihre Beteiligung ist unglaublich wertvoll und tr\u00e4gt viel zur Unterst\u00fctzung und Erhalt dieser werbefreien Seite bei!<\/p>\n\n\n\n

<\/p>\n\n\n\n

\n
\"PayPal Unterst\u00fctzen<\/a><\/div>\n<\/div>\n\n\n\n
<\/div>\n\n\n\n
\n \"Author\n

Andr\u00e9 K. ist der Autor dieses Blogartikels. <\/p>\n<\/div>\n","protected":false},"excerpt":{"rendered":"

Dieser Blogartikel widmet sich einem Thema, das urspr\u00fcnglich vor allem f\u00fcr uns als Familie gedacht war. Er k\u00f6nnte jedoch auch f\u00fcr den einen oder die andere von euch interessant sein. Die Idee zu unserem Archiv entstand aus einem ganz pragmatischen Problem: Da Apple Music keine M\u00f6glichkeit bietet, geh\u00f6rte H\u00f6rspiele sichtbar zu markieren, wurde der Wunsch […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[488,387,480],"tags":[392,494,435,388,390,389,459,391,456],"class_list":["post-10195","post","type-post","status-publish","format-standard","hentry","category-ipad","category-iphone_ios","category-streaming","tag-app","tag-apple-music","tag-geheimtipp","tag-ios","tag-ipad","tag-iphone","tag-musik","tag-safari","tag-webapp","gallery-content-unit"],"_links":{"self":[{"href":"https:\/\/anb030.de\/a\/wp-json\/wp\/v2\/posts\/10195","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/anb030.de\/a\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/anb030.de\/a\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/anb030.de\/a\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/anb030.de\/a\/wp-json\/wp\/v2\/comments?post=10195"}],"version-history":[{"count":53,"href":"https:\/\/anb030.de\/a\/wp-json\/wp\/v2\/posts\/10195\/revisions"}],"predecessor-version":[{"id":10265,"href":"https:\/\/anb030.de\/a\/wp-json\/wp\/v2\/posts\/10195\/revisions\/10265"}],"wp:attachment":[{"href":"https:\/\/anb030.de\/a\/wp-json\/wp\/v2\/media?parent=10195"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/anb030.de\/a\/wp-json\/wp\/v2\/categories?post=10195"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/anb030.de\/a\/wp-json\/wp\/v2\/tags?post=10195"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}