Die Studierenden lernen Praktiken der komponentenbasierten Front-End-Entwicklung kennen. Der Kurs legt dabei Wert auf die Wiederverwendbarkeit von UI Elementen und behandelt wichtige Aspekte wie Barrierefreiheit und Internationalisierung.
Die Vorlesung kombiniert theoretische Konzepte mit praktischen Übungen. Nach einer Einführung in die Entwicklung von Design Systemen werden verschiedene Front-End-Technologien wie JavaScript, HTML, CSS, SCSS und Standards wie ARIA im Detail behandelt. Im praktischen Teil des Kurses entwickeln die Studierenden ein eigenes Design System mit konsistentem Erscheinungsbild. Die Umsetzung wird mit React und Storybook realisiert.
Dieses Projekt entstand im Rahmen des Kurses Design System Engineering unter der Leitung von Jan Hassel. Unser Ziel war es, ein innovatives Design System zu entwickeln, das nicht nur theoretische Konzepte vermittelt, sondern auch praktische Anwendbarkeit in realen Projekten demonstriert. Wir wollten zeigen, wie Design-Systeme in der Entwicklung moderner Anwendungen effektiv eingesetzt werden können.
Über das Projekt
“Wanderlust” ist eine Flugbuchungs-App, die sich auf Multi-Stop-Reisen spezialisiert. Bei der Entwicklung dieser App standen Benutzerfreundlichkeit und ein ansprechendes Design im Vordergrund. Das Projekt wurde mit Vite und Storybook realisiert, wobei die Komponenten in React entwickelt und mit SCSS gestaltet wurden. Wir haben besonderen Wert auf die Responsive Design-Prinzipien gelegt, um sicherzustellen, dass unsere App auf verschiedenen Geräten und Bildschirmgrößen optimal funktioniert.
Demo
Im Demo-Ordner finden Sie den Startbildschirm unserer “Traveling Overview”. Dieser bietet einen Einblick in unsere kreative Arbeit und demonstriert, wie wir Design und Funktionalität in Einklang gebracht haben. Entdecken Sie unsere Farbpalette, Typografierichtlinien und die sorgfältig ausgearbeiteten Komponenten, die sowohl ästhetisch ansprechend als auch funktional sind.
