Fallstudie Smarthill
Entwicklung einer digitalen Stadtplattform
Meine Rolle:
UX Research, UX Design, UI Design
Tools:
Figma, Miro, Notion
Ziel:
Entwicklung eines konzeptionellen Plattformmodells, das zentrale Informations- und Serviceangebote einer Stadt bündelt und auf unterschiedliche Nutzergruppen zugeschnitten ist.
Lösung:
Ein strategisches UX-Konzept für eine digitale Stadtplattform, das Nutzerbedürfnisse, Informationsarchitektur und Designprinzipien in einem modularen Entwurf zusammenführt
Überblick
Smarthill entstand im Rahmen einer Fortbildung zum Certified User Experience Designer als praxisorientiertes Konzeptprojekt. Ziel war die Entwicklung einer beispielhaften Stadtplattform, die zeigt, wie urbane Informationen, Services und Mobilitätsangebote digital vereint werden können. Das Projekt diente der Anwendung des gesamten UX-Prozesses, von Research über Strategie und Informationsarchitektur bis zum visuellen Design. Alle Ergebnisse basieren auf konzeptionellen Annahmen und simulierten Nutzerszenarien, die eine realistische Umsetzung abbilden.
Research & Analyse
Die Konzeptphase begann mit einer umfangreichen Analyse, um Bedürfnisse und Nutzungskontexte der relevanten Zielgruppen, Bürger:innen, Tourist:innen, Studierende und Verwaltungsmitarbeitende, zu verstehen. Durch Interviews, Wettbewerbsanalysen, die Erstellung von Personas und Journey Maps wurde ein fundiertes Verständnis für die Herausforderungen urbaner Informationssysteme geschaffen. Diese Erkenntnisse bildeten das Fundament für die strategische Ausrichtung und Strukturierung der Plattform.
Ziel
- Verständnis für unterschiedliche Nutzungskontexte und Erwartungen
- Identifikation zentraler Touchpoints und Optimierungspotenziale
- Grundlage für die Strategie- und Konzeptentwicklung schaffen
Prozess
- Desk Research und Benchmarking zu Smart-City-Portalen
- Entwicklung von Personas und Empathy Maps
- Erstellung einer Customer Journey zur Visualisierung von Nutzungsszenarien
Lösung
Ein theoretisch fundiertes Research-Set, das die Grundlage für Informationsarchitektur und UX-Strategie bildete.
Strategie & Planung
Auf Basis der Research-Ergebnisse wurde eine konzeptionelle Produktstrategie entwickelt. Ziel war, ein zukunftsfähiges System zu skizzieren, das Stadtinformationen, Bürgerdienste und touristische Angebote integriert. Die Planung folgte einem agilen Ansatz: Mit Hilfe von Methoden wie Value Proposition Canvas, Product Scope und Lean UX Canvas wurden Zielgruppenbedürfnisse, Funktionen und Mehrwerte strukturiert dargestellt. Durch fiktive Stakeholder-Workshops und Design Sprints wurden Ideen priorisiert und in Konzeptmodule überführt.
Ziel
- Entwicklung einer strategischen Basis für ein digitales Stadt-Ökosystem
- Priorisierung zentraler Funktionen anhand hypothetischer Nutzerbedürfnisse
- Aufbau einer skalierbaren, agilen Planungsstruktur
Prozess
- Erstellung von Product Scope und Lean UX Canvas
- Ableitung konzeptioneller Use Cases aus Research-Daten
- Simulation eines iterativen Entwicklungsprozesses
Lösung
Ein strukturiertes Strategiekonzept, das zeigt, wie komplexe Stadtservices digitalisiert und nutzerorientiert gebündelt werden können.
Informations-Architektur & Content
Für die fiktive Plattform wurde eine Inhaltsstruktur entwickelt, die auf klaren Navigationslogiken und wiederverwendbaren Content-Bausteinen basiert. Themenbereiche wie Tourismus, Mobilität, Verwaltung oder Veranstaltungen wurden so organisiert, dass sie eine intuitive Orientierung bieten. Ergänzend entstand ein redaktionelles Konzept, das Rollen und Verantwortlichkeiten definiert, von der Content-Erstellung bis zur Freigabe. Diese theoretische Struktur verdeutlicht, wie modulare Informationsarchitektur Transparenz und Effizienz in einem digitalen Stadtportal fördern kann.
Ziel
- Aufbau einer klaren, erweiterbaren Inhaltsstruktur
- Definition logischer Navigations- und Informationspfade
- Konzeption redaktioneller Workflows und Zuständigkeiten
Prozess
- Erstellung einer Sitemap und Card-Sorting-Übungen
- Definition modularer Content-Elemente
- Entwicklung eines theoretischen Redaktionskonzepts (RACI-Modell)
Lösung
Eine skalierbare Informationsarchitektur mit transparenten Verantwortlichkeiten, die beispielhaft für die Umsetzung kommunaler Online-Angebote steht.
Interaktions-Design
Das Interaktionskonzept verdeutlicht, wie komplexe Inhalte einfach erfahrbar gemacht werden können. Kartenfunktionen, Filter und intelligente Suchmechanismen sorgen für Orientierung und Relevanz. Ein ergänzendes Conversational-Design-Modul simuliert die Integration eines Chatbots, der Nutzer:innen bei touristischen Fragen unterstützt. Der Fokus lag darauf, die Informationssuche als intuitiven, dialogbasierten Prozess zu gestalten.
Ziel
- Entwicklung eines interaktiven, nutzerzentrierten Navigationskonzepts
- Vereinfachung von Informationssuche und Entscheidungsprozessen
- Erprobung von Conversational-Design-Ansätzen für Smart-City-Umgebungen
Prozess
- Erstellung von Wireframes und Prototypen in Figma
- Konzeption typischer Nutzungsszenarien mit Chatbot-Integration
- Analyse und Bewertung möglicher UX-Pattern
Lösung
Ein interaktives, konzeptionelles Interface, das demonstriert, wie digitale Stadtservices dialogorientiert und barrierearm gestaltet werden können.
Visuelles & UI Design
Das visuelle Design wurde als theoretisches UI-System entworfen, das Modernität, Offenheit und Zugänglichkeit kombiniert. Auf Basis von drei Moodboard-Richtungen, Green City, Community und Futuristic, entstand eine gestalterische Leitlinie, die den Charakter einer smarten, nachhaltigen Stadt vermittelt. Farben, Typografie und Komponenten wurden nach Prinzipien des Atomic Design entwickelt und in einem Figma-Styleguide dokumentiert.
Smarthill Web
Die Web-Prototypen wurden in Figma auf Basis des Untitled UI Kits erstellt und zeigen das final gedachte Look & Feel der Plattform.
Smarthill App
Die App greift das Design der Webplattform auf und erweitert das System um mobile Funktionen wie ein digitales ÖPNV-Ticket.
Ziel
- Entwicklung eines konsistenten visuellen Konzepts für digitale Stadtplattformen
- Verbindung funktionaler Klarheit mit emotionaler Gestaltung
- Dokumentation von UI-Komponenten im Designsystem
Prozess
- Erstellung von Moodboards und Style Tiles
- Definition von Farbwelt, Typografie und Iconografie
- Entwicklung eines modularen Designsystems in Figma
Lösung
Ein konzeptionelles UI-Design, das als Vorlage für künftige Smart-City-Projekte dienen kann und die Verbindung von Struktur, Funktion und Emotion veranschaulicht.
Das habe ich aus den Projekten mitgenommen:
- Eine saubere Analysephase legt das Fundament für alle weiteren Designentscheidungen.
- Informationsarchitektur ist der Schlüssel, um komplexe Inhalte verständlich zu strukturieren.
- Iteratives Testen hilft, Annahmen früh zu validieren und Nutzerbedürfnisse gezielt umzusetzen.
- Gute UX entsteht durch Klarheit und Einfachheit.