Fraunhofer ISE
UI-Refinement Web-App

Support für UI/UX-Design bei der Entwicklung einer Web-App mit Charting und Mapping für Analyse und Prognosen im Bereich Strommarkt und Stromnetze.

UIUX
Consulting Frontend Adobe XD HTML CSS Javascript

Überblick

Als wir von der spannenden Aufgabe hörten - kurz vor Beginn der Sommerferien - klang der Zeitplan schon etwas sportlich. Dann wurde es schnell konkreter: Nicht zum Ende des Jahres, sondern bereits Anfang Oktober sollte die App bereits als zentraler Teil der Projektergebnisse dem Fachpublikum präsentiert werden.

Der Transformationsatlas des Fraunhofer IEE simuliert die Entwicklung der Energiewende in Deutschland anhand von Szenarien und Modellen und kann damit die Anteile verschiedener Energieträger und auch die Effekte von geplantem Netzausbau auf Engpässe visualisieren.

Die App ist Teil eines größeren Projektes und war schon weitgehend fertig als wir zusammen mit dem Projektteam bei Fraunhofer mi dem Review begannen. Sie funktionierte auch bereits sehr gut für die Berechnung der Modelle und der Anzeige der Diagramme und Maps. Aber mit dem Userinterface waren die Kollegen dort noch nicht zufrieden und fragten nach Feedback und Unterstützung.

Im gegebenen Zeitrahmen waren nur kleinere Schritte möglich, aber wir nahmen uns die damalige Oberfläche vor und anaylsierten Strukturen und Interaktionsmuster. Eine weitere Herausforderung war das zugrundeliegende Framework (plotly / dash), das zwar hoch optimiert für das Berechnen und Darstellen der Modelle, aber nicht ganz so einfach anpassbar für typische UX-Aufgaben im Frontend war.

Wir brachten daher unsere Empfehlungen in eine Reihenfolge, um die wichtigsten prototypischen Verbesserungen möglichst noch im laufenden Projekt unterbringen zu können. Andere Dinge, die eher nice-to-have waren, wurden dokumentiert und den Kollegen im Institut übergeben, "for future use".

In mehreren Sessions wurde dann remote zusammen am "lebendigen" Prototypen justiert und entwickelt - mit dem Ergebnis, dass die wichtigsten Punkte dann tatsächlich noch im Projekt und zum Termin der Präsentation fertig waren.

Aufgaben

    • Analyse Userinterfaces und UX
    • Identifikation Optimierungspotentiale
    • Prototyping UI-Refinements in XD und HTML
    • Support für Entwicklungsteam bei Implementierng im Frontend-Framework