Arbeiten
Akademie der Wissenschaften
Akademie der Wissenschaften
Dev-Handoff abgeschlossen

Ein
Baukasten
 für die ganze Website.

Modulares Seitentyp- und Komponentensystem für den Relaunch einer über Jahre gewachsenen TYPO3-Website, als Subunternehmer für die Digitalagentur Zum Kuckuck aus Würzburg.

Seitentypen
4 Landingpages, Basisseiten
Komponenten
Teaser, Karussell, Akkordeon
Responsive
1280, 800, 375 px
Dev-Handoff
für TYPO3
Kunde
Akademie der Wissenschaften und der Literatur
Ort
Mainz
Rolle
UX/UI Design
Zeitraum
12/2025
Übergabe
Dev-Handoff für TYPO3
Status
Dev-Handoff abgeschlossen
Ausgangslage

Eine über Jahre gewachsene Website mit viel Wissen: Forschung, Projekte, Personen, Veranstaltungen. Der Relaunch sollte alles davon tragen und mit der Akademie mitwachsen.

Konzept

Vier Bereiche, ein Einstieg.

Akademie, Forschung, Aktivitäten, Service: jede Landingpage nach demselben Muster, darunter Basisseiten für alles Weitere.

  • Vier Landingpages
    Akademie, Forschung, Aktivitäten, Service.
  • Ein Muster
    Jede Landingpage gleich aufgebaut.
  • Basisseiten
    Für alles, was darunter kommt.
  • Ein Einstieg
    Die Startseite führt in alle Bereiche.
Design

Ein System statt Einzelseiten.

Wenige Bausteine, frei kombinierbar: Teaser, Karussell, Akkordeon, Personenkarten, Filter-Chips.

  • Teaser
    Inhalte anreißen und weiterführen.
  • Karussell
    Neuigkeiten und Highlights.
  • Akkordeon
    Viel Text, aufgeräumt.
  • Personenkarten
    Gesichter zu Forschung und Gremien.
Projekte-Übersicht mit A bis Z und Filtern
Startseite der Akademie auf dem Handy
Suchen & Finden

Schnell zur richtigen Person.

Personenverzeichnis und Projekte mit A bis Z, Filtern und Suche. Veranstaltungen mit Kalender.

  • A bis Z
    Personen und Projekte alphabetisch.
  • Filter
    Chips zum Eingrenzen.
  • Suche
    Direkt nach Namen suchen.
  • Kalender
    Veranstaltungen nach Datum.
Übergabe

Fertig für TYPO3.

Jede Seite in drei Breiten (1280, 800, 375), Zustände und Abläufe dokumentiert, Dev-Handoff für die Umsetzung im Team der Akademie.

  • Drei Breiten
    1280, 800 und 375 px.
  • Zustände
    Für jede Komponente dokumentiert.
  • Abläufe
    Klickwege Schritt für Schritt.
  • Dev-Handoff
    Fertig für die Umsetzung.
Dokumentierter Ablauf im Veranstaltungskalender
Startseite der Akademie auf dem Handy
Rund um die Seite

Jede Seite aus einem Baukasten.

Startseite

Alle vier Bereiche auf einen Blick.

Startseite der Akademie auf dem Desktop

Landingpage

Akademie, nach festem Muster.

Landingpage Akademie

Neuigkeiten

Aktuelles als Teaser und Karussell.

Neuigkeiten der Akademie

Projekte

Von A bis Z, mit Filter.

Projekte-Übersicht

Personen

Verzeichnis mit Suche.

Personenverzeichnis

Veranstaltungen

Termine mit Kalender.

Veranstaltungsübersicht
Eine Seite, alle Geräte

Desktop und Handy, ein System.

Gleiche Bausteine, auf jedem Bildschirm.

Website der Akademie auf dem Laptop
Website der Akademie auf dem Handy
Ein System
Gleiche Bausteine von 375 bis 1280 px.
Drei Breiten
Desktop, Tablet und Mobil gestaltet.
Dokumentiert
Zustände und Abläufe für die Entwicklung.
Übergeben
Dev-Handoff 12/2025 abgeschlossen.

Ergebnis.
Dev-Handoff im Dezember 2025 abgeschlossen.

4

Landingpages nach einem Muster

3

Breiten pro Seite: Desktop, Tablet, Mobil

12/2025

Dev-Handoff abgeschlossen

Live

Live auf adwmainz.de.

Umgesetzt vom Team der Akademie auf Basis meiner Entwürfe.

Jetzt reden

Lass uns über dein Projekt sprechen.

30 Minuten Video-Call, kostenlos. Schreib mir kurz, worum es geht. Ich melde mich mit einem Termin.