Grenzenloser Dialog, spielerisch und barrierefrei inszeniert: Wie wir für das Ecumenical Volunteers Programme (EVP) ein flexibles WordPress-Blogsystem geschaffen haben, das Freiwillige weltweit verbindet und die Redaktion effizient entlastet.
Das Ökumenische Freiwilligenprogramm (EVP) der Evangelischen Mission in Solidarität ermöglicht jungen Menschen einen Freiwilligendienst in sozialen, entwicklungspolitischen und kirchlichen Projekten – sowohl im Ausland als auch in Deutschland. Auf dem Blog berichten die Freiwilligen direkt aus ihrem Alltag, teilen ihre Erfahrungen und schaffen so einen authentischen Einblick in den weltweiten Austausch.
Gemeinsam mit dem EVP-Team haben wir die digitale Heimat dieses Programms grundlegend neu gedacht und technisch realisiert. Entstanden ist eine lebendige, barrierefreie WordPress Website, die von den Geschichten der Freiwilligen lebt und Schritt für Schritt mit den Bedürfnissen der Organisation mitwächst.
Das Ökumenische Freiwilligenprogramm – Austausch auf Augenhöhe
Hinter dem EVP steht der Grundgedanke des gemeinsamen Lernens. Der Dienst ist keine Einbahnstraße: Er funktioniert in zwei Richtungen. Junge Erwachsene aus Deutschland reisen im Zuge des Nord-Süd-Austauschs in Partnerländer weltweit. Gleichzeitig kommen junge Engagierte aus dem globalen Süden über den Süd-Nord-Austausch nach Deutschland.
Ziel des digitalen Relaunchs war es, diese zwei Perspektiven visuell greifbar zu machen und den Freiwilligen vor Ort eine intuitive Bühne zu bieten, um ihre Erlebnisse flexibel als Blogbeiträge mit der Community, Unterstützer:innen und Familien zu teilen.
Die Herausforderung: Flexibilität im Content, Sicherheit im Prozess
Die Typografie, die Primärfarbe Orange und das Logo wurden von der Lead-Agentur beigesteuert, wir haben ein vollwertiges barrierefreies Designsystem daraus entwickelt und mit handgemachten Illustrationen belebt. Die technische Aufgabe bestand darin, das visuelle Konzept in ein hochflexibles und gleichzeitig absolut sicheres, einfach zu bedienendes System zu überführen.
Dezentrales Publishing
Freiwillige weltweit sollen von überall direkt Beiträge einreichen können, ohne Zugriff auf kritische Admin-Bereiche der Website zu haben.
Qualität und Kontrolle
Ein sicherer Freigabeprozess für Beiträge und Kommentare war notwendig, um redaktionelle Standards und den Schutz der Freiwilligen zu garantieren.
Unterschiedliche Bildformate
Da die Beiträge direkt von den Smartphones der Freiwilligen aus aller Welt kommen, sollte es keine Vorgabe für Bildformate geben. Hochformat, Querformat und Panorama mussten im Layout ästhetisch und dynamisch harmonieren.
Sich verändernde Anforderungen im Prozess
Der Wunsch bestand darin, kein starres System zu erhalten, sondern die vollen Stärken von WordPress als High-End-CMS auszureizen – modular und skalierbar, sodass zusätzlich zum Blog schrittweise zusätzliche Website-Elemente jederzeit flexibel und nahtlos im laufenden Entwicklungsprozess integriert werden konnten.
Die Lösung: Ein maßgeschneidertes Blocksystem
Als technische Basis haben wir mit dem Gutenberg Editor in WordPress ein maßgeschneidertes Block-System designed und entwickelt. Das erlaubt es dem EVP-Team, zukünftige Layouts und Inhaltselemente eigenständig zusammenzustellen.
Dynamische Bildwelten dank Masonry-Layout
Die unterschiedlichen Bildformate der Originalfotos haben wir mithilfe eines Responsive Masonry Layout umgesetzt. Ähnlich einer Pinnwand fügen sich hoch- und querformatige Bilder nahtlos in ein harmonisches Kachelraster ein. Das Ergebnis ist ein lebendiger, authentischer Magazin-Charakter.
Spezial-Element: Exchange Directions
Das Herzstück des Programms – der Richtungswechsel im Austausch – haben wir visuell durch ein interaktives “Spezial-Element” gelöst: Die intuitive Umschaltung zwischen Süd → Nord und Nord → Süd führt die Nutzer:innen direkt zu den Geschichten und Infos, die für ihre jeweilige Perspektive relevant sind.
Sicherer Login und Redaktions-Workflow
Über einen geschützten Frontend-Login können Freiwillige ihre Texte und Bilder unkompliziert einreichen. Der Clou: Das System stößt im Hintergrund automatisch einen digitalen Freigabe-Prozess für die Redaktion an. Erst nach Prüfung durch das EVP-Team gehen Blogbeiträge und Kommentare live.
Handgemachte Illustrationen und Farbkonzept
Handgemachte Illustrationen und Icons mit einer spielerischen, kreativen Anmutung spiegeln die Lebensfreude des Programms wider. Farblich hinterlegte Headlines mit dynamisch wechselnden Hintergrundfarben strukturieren die Inhalte und eine nahtlos integrierte Newsletter-Anmeldung sorgt zudem für nachhaltige Leserbindung.
Das Ergebnis: Barrierefrei, mobil optimiert, zukunftssicher
Die neue Website des Ökumenischen Freiwilligenprogramms beweist, dass hohe redaktionelle Sicherheit und spielerische Leichtigkeit im Design Hand in Hand gehen können.
Mobile First im Fokus
Da Freiwillige und Leser:innen weltweit primär mit dem Smartphone auf die Inhalte zugreifen, wurde die gesamte Plattform konsequent für mobile Endgeräte optimiert – für extrem schnelle Ladezeiten, selbst bei mobilen Datennetzen im Ausland.
Barrierefreiheit als Standard
Entsprechend unserer gewohnten Qualitätsstandards wurde die Seite barrierearm umgesetzt, um allen Menschen einen einfachen Zugang zu den Geschichten des globalen Austauschs zu ermöglichen.
Wachstumsfähig
Dank des modularen Blocksystems ist die Website perfekt darauf vorbereitet, um neue Module, Infoseiten oder Funktionen erweitert zu werden.
NLDX Leistungen
Technische Konzeption & Beratung
Agiler Projektansatz (“Blog first”) zur schnellen und effizienten Marktreife.
UX/UI Engineering
Implementierung des Responsive Masonry Layouts und Entwicklung des interaktiven Wechsel-Elements (Nord/Süd).
Design
Farbwelt, barrierefreies Designsystem mit UI-Kit und Formularen
Illustration
Handgemachte Illustrationen und Custom Icons
WordPress Custom Development
Umsetzung eines maßgeschneiderten WordPress Themes mit Gutenberg Blocksystem.
Frontend-Publishing & Workflows
Einrichtung des geschützten Login-Bereichs für Freiwillige inklusive redaktionellem Freigabeprozess für Beiträge und Kommentare.
Qualitätsmanagement
Sicherstellung von Barrierefreiheit, Mobile-First-Optimierung und technischer DSGVO-Konformität (z. B. beim Newsletter-Setup).