Funktionserweiterung «Bilder vergleichen» im Cranach Digital Archive


Lisa-Marie Sienz & Yasmin Ziegler

Kontext
Cranach Digital Archive (CDA)
Modul
Screendesign
Semester
Wintersemester 2020/21
Studiengang
Medieninformatik Ba.

Im Rahmen des Screendesign Projekts sollte das Cranach Digital Archive um die Funktion „Bilder vergleichen“ erweitert werden, wobei das Design professionell, modern, schlicht und simpel gehalten werden soll, sowie die Erweiterung sich in das bereits vorhandene Design integrieren soll. Die Funktion soll für Experten ausgelegt sein und auf WIMP-fähigen Geräten, sowie größeren Touchdevices funktionieren. Zu Beginn der Umsetzungsphase wurden aus den vorgegebenen Materialien wichtige Basisobjekte wie Schriftgrößen, Abstände, sowie Farben übernommen und daraus wurde die Startseite des bereits bestehenden Archivs bestmöglich nachgestellt. Die Startseite bietet die Grundlage der weiteren Screendesigns. Anhand der Startseite wurden kontinuierliche Abstände, Farben und Schriftarten festgelegt (im Patternlab hinterlegt). Nach der Festlegung des Grundaufbaus und Stils wurde die Funktionserweiterung geplant. Hauptziel der Vergleichsfunktion ist es möglichst offen für Vergleichsvarianten zu sein. Hierfür wurden vielseitige Anwendungsbeispiele in Betracht gezogen. Für die Funktionserweiterung wurde sich im Vorfeld mit einigen Websites auseinandergesetzt, die ähnliche Vergleichsfunktionen aufweisen, sowie darauf geachtet, möglichst gängige Icons zu verwenden, damit sich der Nutzer schnell in die neuen Funktionen einfinden kann. Folgende Quellen wurden für die Icons verwendet: https://www.figma.com/community/plugin/740272380439725040/Material-Design-Icons https://www.figma.com/community/file/780582924744713607 Alle Gemälde und Grafiken können jederzeit in eine Sammlung aufgenommen werden, was eine einfache Handhabung bietet. Hierfür erhalten diese immer ein Lesezeichen, das impliziert, ob sie bereits in der Sammlung enthalten sind oder nicht. Sollten sie bereits in der Sammlung enthalten sein ist dieses ausgefüllt, anderenfalls nicht. Per Mausklick kann eine Grafik bzw. ein Gemälde hinzugefügt/entfernt werden. Diese Umsetzung verhindert doppeltes Hinzufügen und bietet die Möglichkeit jederzeit ein Objekt zu entfernen. Zur spezifischen Suche wurde die Taskleiste um eine Archivsuche erweitert, sodass spezifische Artefakte hinzufügt werden können. Die Sammlung wurde ebenfalls in der Taskleiste erweitert. Sie ist unterteilt in Werke, Zustände eines Werkes, benutzerspezifische Ausschnitte und gespeicherte Vergleiche. Zum Überblick in der Sammlung wurden eine Sammlungssuche und Sortieroptionen zur Verfügung gestellt. Im oberen Feld können die markierten Objekte eingesehen und in die unteren Vergleichscards per Drag and Drop gezogen werden. Somit bleiben die unteren Vergleichscards vorhanden und nur die markierten Artefakte ändern sich beim Wechsel der Seiten Zustände und Werke. Diese Vorgehensweise wurde gewählt, da somit ein übergreifender Vergleich möglich ist. Es können sowohl Werke mit demselben oder anderen Werken verglichen werden als auch beispielsweise Werke mit Zuständen.

Dabei ist es dem Nutzer während des Vergleichs möglich, unter den einzelnen Zuständen/Abbildungen eines gespeicherten Werkes, bzw. unter den spezifischen Aufnahmen eines bestimmten Zustands/einer bestimmten Abbildung zu wählen und diese Auswahl auch beliebig oft wiederholen zu können, ohne zur Sammlung zurückkehren zu müssen. Aus Platzgründen wurde der Vergleich von mehreren Elementen auf einmal als nicht sinnvoll eingestuft, da die Bildausschnitte für eine detaillierte Analyse zu klein erscheinen. Eine alternative, vereinfachte Variante wurde in den benutzerspezifischen Ausschnitten implementiert. So ist es dem Nutzer möglich innerhalb eines Vergleichs einzelne Detailausschnitte der Elemente in einer separaten Sammlung abzulegen, welche dann in einer vergrößerten Ansicht mit bis zu 5 weiteren Ausschnitten noch einmal eingesehen werden können. Dabei kann der Benutzer die Aufteilung der Darstellungsfläche verändern, um einzelne Elemente größer einsehen zu können als andere. Dem Nutzer ist es zusätzlich auch möglich, einen Vergleich zu speichern und ihn so später erneut aufzurufen, ohne die einzelnen Artefakte erneut wählen zu müssen. Gespeicherte Vergleiche und benutzerspezifische Ausschnitte werden hier über ein Delete-Icon gelöscht, während gespeicherte Werke über einen weiteren Click auf das Lesezeichen wieder aus der Sammlung entfernt werden können. Um ein möglichst durchgängiges Design zu schaffen, wurde darauf wertgelegt bei der Touchvariante nur Kleinigkeiten zu verändern, die die Bedienung mit einem Finger erleichtern. (Abstände, größere Buttons, Swiping)

Style-Guide

Styleguide für das Projekt von Lisa-Marie Sienz & Yasmin Ziegler