Menü
Menü
Menü
Menü
Das xLab ist ein Experimentallabor von der Hochschule Karlsruhe. xLab bietet Raum für Studierende, Forscher:innen und wissenschaftliche Mitarbeiter:innen zum Explorieren, Experimentieren und Ausprobieren. Losgelöst von festgefahrenen Kategorien, können Student:innen hier ihr eigene Ideen, Projekte, Forschungsansätze oder -ergebnisse in einer geschützten Umgebung, mit der Unterstützung von Coaches, Gastdozent:innen sowie Professor:innen, entwickeln und umsetzen. Mit diesen Werten im Kopf haben wir das Corporate Design von xLab überarbeitet und einen neuen, Onlineauftritt erschaffen.
Das Ziel des Projektes war und ist es, Studierende auf das Projekt aufmerksam zu machen. Wir haben die Digitalstrategie entwickelt und geplant. Dafür sollte eine bessere Seitenstruktur und Experience für Nutzer:innen geschaffen werden. Es waren unterschiedliche Disziplinen beteiligt, Digital Business, SEO und Design und Experience.
Hier wurden relevante Personas identifiziert und mit der bereits gesammelten Erfahrung und zur Verfügung stehenden Daten bestimmt.
Im Rahmen unseres SEO Audit wurde die Struktur der Website, die Performance, die Strukturierung der Seiteninhalte und Onsite- und Offsite-Verlinkungen genau unter die Lupe genommen. Außerdem haben wir uns gemeinsam die Wettbewerber angeschaut.
Themenfelder und wichtige Keywords wurden im gemeinsamen SEO-Workshop definiert und priorisiert. Zudem haben wir das Suchvolumen und Potenziale analysiert und die Sitemap bzw. Informationsarchitektur definiert.
Das Tracking wurde mit der Google Search Console eingerichtet und alle Ergebnisse und Auffälligkeiten sorgfältig in einer Präsentation dokumentiert, die wir xLab im Anschluss zur Verfügung gestellt haben. Die dadurch ermittelten Quick-Wins haben wir direkt umgesetzt.
Zuerst haben wir User Stories für die Personas definiert, um die konkreten Anforderungen an die Website herauszuarbeiten und davon die passenden Maßnahmen abzuleiten.
Das Logo von xLab soll als dynamisches Gestaltungselement weiterverwendet (s. Gestaltungsmuster) werden. Das X wird nun als variabler Parameter verwendet. Die eckigen Klammern [ ] stehen für einen sicheren und geschützten Raum und das Lab verdeutlicht den experimentellen Charakter.
Die vorgegebenen Basisfarben, die weiterhin verwendet werden sollen, sind schwarz und weiß. In einem gemeinsamen Design Workshop haben wir das Spektrum um die Farben Blau und Gelb in sehr gesättigten Versionen ergänzt. Die Farbe Blau steht für Vertrauen, Raum, Intelligenz, Innovation und Sicherheit. Gelb für Freiheit, Optimismus, Lebensfreude, Kreativität und Explorieren. In Kombination stellen die Farben ein Experimentalcharakter und gleichzeitig eine sichere Umgebung dar, was beides sehr gut zur Marke von xLab passt. Die Kombinationen schwarz-gelb und blau-weiß erinnern an Sicherheitsschilder und Farbgebung aus dem Laborumfeld.
Um diese nüchterne Sicherheits- und Warnhinweisfarbgebung zu brechen, haben wir eine progressive Schriftgestaltung gewählt, welche durch die Schriftart Poppins hervorragend funktioniert. Diese Schriftart bringt durch eine sehr stark geometrisch konstruierte Form
eine unkonventionelle Komponente in das Erscheinungsbild der Inhalte. Durch den prägnant grafischen Charakter tritt die Schrift stärker in Vordergrund als klassischere Schriften, welche meist eher zurückhaltend sind. Neben der hohen Lesbarkeit besitzt die Schrift einen sehr gut ausgebauten Schriftsatz.
In das Branding sollen die drei Kernkompetenzen bzw. Disziplinen von xLab miteinfließen: Wissensaufbau, Vernetzung und Infrastruktur. Das Signet des Logos wurde durch Gestaltungselemente ergänzt und in eine animierte Form überführt. Was vor allem Nutzer:innen dabei helfen soll, Kategorien und Themen auf der Website einzuordnen. Die Farbgebung soll dies systematisch unterstützen: Auf der Landingpage zum Thema Wissensaufbau dominiert die Farbe Gelb mit entsprechendem Signet.
Für dieses Projekt haben wir Figma als Designtool verwendet. Wir setzen Figma für kollaboratives Arbeiten ein, da die Komponenten ohne extra Synchronisierungsprozess oder manuelles Tauschen von Dateien in der neuesten Version stets direkt für alle verfügbar sind. Im Anschluss an das Projekt kann diese Library auch von den Kund:innen weiterverwendet und -entwickelt werden und dient als Archiv für die Vorgängerversionen.
Diese Seite wurde von xLab selbst implementiert, nachdem wir das Designkonzept und die Komponenten des Design Systems übergeben haben.
Diese Partner durften wir auf einem ähnlichen Weg und bei ihrem Digital Game Plan begleiten.
Unser monatlicher Newsletter informiert Dich über Neuigkeiten aus der digitalen Welt. Du bekommst wertvolle Online-Praxis-Tipps und erfährst, welche Webinare und Veranstaltungen wir anbieten, um Dich digital handlungsfähig zu machen.
