Im Rahmen des Moduls „Screendesign“ bestand unsere Aufgabe darin, für das Projekt 2024 den redaktionellen Bereich des Cranach Digital Archive neu zu gestalten. Ziel war es, ein modernes und zeitgemäßes Design- und Interaktionskonzept zu entwickeln, das durch eine klare, verständliche und zugleich spannende, aber unaufdringliche Designsprache überzeugt. Dafür sollte zunächst das bestehende Design des Archivs analysiert und darauf aufbauend ein neues Konzept erarbeitet werden.
Zu Beginn des Gestaltungsprozesses habe ich verschiedene Museumswebseiten analysiert, um einen umfassenden Überblick und Inspirationen für mein Designkonzept zu gewinnen. Ziel war es, eine Plattform zu entwickeln, die barrierefrei für alle Nutzer zugänglich ist und Informationen bereitstellt. Das Design der Startseite orientierte sich stark an den Farben und dem Stil des Cranach Digital Archives. Der Header wurde mit den bekannten Navigationspunkten und dem CGA-Logo gestaltet. Eine Suchleiste ermöglicht es den Nutzern, schnell nach spezifischen Seiten oder Inhalten zu suchen. Zusätzlich wurde ein deutsch-/englischsprachiges Navigationselement integriert, um die Barrierefreiheit weiter zu erhöhen. Eine benutzerfreundliche Menüleiste bietet zwei spezielle Icons für Menschen mit Seheinschränkungen. Diese ermöglichen es, die Schriftgröße je nach Bedarf anzupassen. Ein ergänzendes Erklärvideo in Gebärdensprache hilft Nutzern mit Höreinschränkungen, die Inhalte der Website besser zu verstehen. Sowohl auf der Startseite als auch auf den weiteren Seiten, wurde der Inhalt auf das Wesentliche reduziert. Die Content-Items werden als abgerundete Karten dargestellt, die mit einem „Mehr erfahren“-Button versehen sind. Einfache Klick- sowie Drag-and-Drop-Funktionen ermöglichen es den Nutzern, schnell und intuitiv auf die Inhalte zuzugreifen. Durch Anklicken öffnet sich eine detaillierte Ansicht mit einer kurzen Beschreibung und weiterführenden Informationen. Ein Dunkelmodus ist ebenfalls verfügbar, um die Lesbarkeit bei schlechten Lichtverhältnissen zu verbessern und den individuellen Vorlieben der Nutzer entgegenzukommen. Die Inhalte und Bilder sind abwechselnd links und rechts angeordnet. Diese dynamische Darstellung sorgt nicht nur für eine ansprechende Optik, sondern unterstützt auch die Leseführung und bietet dem Nutzer eine angenehme Abwechslung beim Durchscrollen der Seite.
Auf der Partnerseite des „Cranach Digital Archive“ wurde das Logo der Technischen Hochschule Köln ganz oben in die Mitte gesetzt. Direkt darunter befindet sich der dazugehörige Text. Diese Anordnung sorgt dafür, dass das Logo sofort ins Auge fällt und die Informationen dazu direkt verfügbar sind. So können die Nutzer schnell erkennen, welche Rolle die Hochschule im Projekt spielt. Die klare Struktur der Seite hilft dabei, sich leicht zu orientieren und wichtige Informationen auf einen Blick zu erfassen. Diese Seite bietet eine Suchleiste für schnellen Zugriff auf Inhalte sowie ein ‚Filter‘-Symbol, das beim Anklicken ein Fenster mit vielfältigen Sortier- und Filteroptionen öffnet. Eine interaktive Karte des Cranach-Archivs ermöglicht die gezielte Suche nach Museen und Ausstellungen. Um die Benutzerfreundlichkeit zu steigern, verfügen alle interaktiven Elemente über ein einheitliches Farbschema, sodass auf den ersten Blick erkennbar ist, welche Elemente anklickbar sind.
Die Forschungsseite bietet ein klares und strukturiertes Design, das den klassischen Look des Cranach Archivs widerspiegelt. Das Farbschema sowie die Typografie sorgen für eine harmonische und professionelle Gestaltung. Gelbe Designakzente und die Farben des CGA-Logos lenken gezielt die Aufmerksamkeit auf zentrale Inhalte wie Projektphasen und aktuelle Themen.
Bei der technischen Umsetzung wurde darauf geachtet, dass die Website auf allen gängigen Endgeräten gleichermaßen gut aufgebaut und interaktiv benutzbar ist. Da die Sicht gerade bei Smartphones und Tablets durch die Gerätegröße eingeschränkt ist, ist das Menü aufklappbar gestaltet. Die verwendeten Maße für die Desktop-Version sind 1440x4761px, bei dem Tablet wurden die Maße eines Surface Pro 8“ (1040x960px) verwendet. Für die Smartphone-Ansicht wurde das iPhone 14 Plus mit einer Größe von 428x926px als Referenz genutzt. Neben WIMP-Geräten unterstützt die Website „Cranach Digital Archive“ auch Tablets und Smartphones.
