Francesco
Scheffczyk
KITeGG
Ende 2021 startete das Verbundvorhaben „KITeGG - KI greifbar machen und begreifen: Technologie und Gesellschaft verbinden durch Gestaltung“. Der Verbund besteht aus der Hochschule Mainz, Hochschule für Gestaltung Offenbach, Hochschule für Gestaltung Schwäbisch Gmünd, Köln International School of Design und der Hochschule Trier. Als Teil des Teams der Hochschule Mainz war eine meiner ersten Aufgaben die Gestaltung und Programmierung einer temporären Webseite, um schnell eine Anlaufstelle zu schaffen, die über das Projekt informiert.
Inzwischen wurde die temporäre Webseite durch eine dauerhafte Website ersetzt, die unter gestaltung.ai zu finden ist. Klick auf den Button oben um zu einer archivierten Version der temporären Webseite zu gelangen.
Gestaltung
Nachdem von Jean Böhm und Isabela Dimarco die ersten Designentscheidungen bezüglich Schrift und Farbe getroffen wurden, übernahm ich die Aufgabe der Gestaltung und Programmierung der Webseite. Da es sich um eine vorläufige Webseite handelt, die nur zu Informationszwecken dient, wurde ein One-Pager gestaltet. Das mitlaufende Menü in der Mitte dient dabei als präsente Navigation, um schnell zu den jeweiligen Informationseinheiten zu gelangen. Neben der Vorstellung der einzelnen Verbundmitglieder, stellt die Webseite auch einen groben Zeitplan mithilfe einer simplen Grafik dar, sowie eine Übersicht über das Team. Die Teamübersicht kann dabei nach Hochschule gefiltert werden. Außerdem werden am Anfang der Webseite erste Arbeitsergebnisse in einem sich immer aktualisierenden Raster dargestellt.
Als Schrift wurde die Archivo von Omnibus Type eingesetzt.
Technische Umsetzung
Um die Seite schnell online zu schalten, wurde bei der Entwicklung auf das Vue-Framework Quasar gesetzt. Mit seinen vorgefertigten Komponenten, Utilities und Helpern, bietet das Framework eine gute Basis für einen schnellen Entwicklungsprozess. Um KI als Gestaltungsmedium auf der Webseite mit einzubinden, wurden Bilder der Teammitglieder mithilfe eines KI-Modells nachträglich animiert. Die dabei verwendete Modell basiert auf dem Paper 3D Photography using Context-aware Layered Depth Inpainting von Meng-Li Shih, Shih-Yang Su, Johannes Kopf und Jia-Bin Huang. Falls ein Bild für ein Teammitglied fehlte, wurde ein Platzhalterbild mit CLIP-Guided VQGAN generiert.