Anfang 2023 darf ich zudem noch an einem anderen VW Projekt parallel mitarbeiten. Da die Infotainment Simulation nicht nur in Fahrzeuginnenräumen von VW, sondern auch von Audi, Skoda, Seat und Porsche funktionieren soll, bedarf es einem Design-System, mit dessen Hilfe man in Figma das Design einmalig erstellen kann und dann über ein Plugin die Marken umschalten kann, um so die Simulation in den verschiedenen Corporate Designs zu sehen.

Verwendete Technologien: Typescript, Svelte, Flex Layout

Einstieg in ein bereits laufendes Projekt zur Entwicklung der One Infotainment@Android Web-Anwendung mit Angular (V9). In einem interdisziplinären Team von Konzeptern, Designern und Entwicklern durfte ich an diesem Projekt als Frontend-Developer mitwirken. Die Web App simuliert die gesamte Infotainment Anwendung für sämtliche Displays im Fahrgastraum zukünftiger VW Fahrzeuge und die der Tochterunternehmen. Die Anwendung besteht aus mehreren kleinen Apps, welche die einzelnen Bereiche im Display und Funktionalitäten repräsentieren. Mein Schwerpunkt in diesem Projekt lag in der Weiterentwicklung folgender Apps:

• Navigation
  • Karte mit User-Interaktionen (Drag, Pan, Pinch-to- Zoom)
  • Suche (Adressen, POIs)
  • Einstellungen
• Phone
  • Kontaktliste
  • Favoriten
  • Anrufliste
  • Eingehender Anruf, Halten-Funktion, Multi-Calls
• Mediaplayer
  • Always-on-Top Player mit Wiedergabefunktion
  • Liste der Songs, filter- und sortierbar nach Genre, Interpret oder Titel
  • Quellenauswahl (Spotify, USB, verbundene Geräte)
• Fahrzeug Setup
  • Exterior, Interior, Licht, Display, Sitze, Service
• Fahrerassistenzsysteme
  • Einrichtung diverser Einstellungsoptionen wie Geschwindigkeitswarnung, Spurhalteassistent, Abstandwarnung etc.
• Klima-Bar
  • Aufbau und Konfiguration der verschiedenen Heizungs- und Lüftungseinstellungen

Für eine Digital-Agentur aus Bonn durfte ich 4 Monate zusammen mit einem Backend-Entwickler an einem Web-Projekt für digitale Patientenakte arbeiten. Der Kollege hatte das Backend und die API schon vorbereitet, sodass ich dazu ein Backoffice für die Ärzte und ein Frontend für die Patienten entwickeln sollte.

Das Design für das Frontend wurd von einer anderen Agentur in Form einer Adobe Xd Datei geliefert. Diese sollte ich dann als Angular Web-App umsetzen für alle Displaygrößen. Leider bekam ich davon kein Screenshot oder Bild, welches ich hier verwenden dürfte.

Backoffice

Entwicklung eines Editor-Formulars im Backoffice des Kunden zur Pflege von Patiententakten. Eine Akte besteht aus Stammdaten und mehreren Einträgen, welche die Stationen des Patienten widerspiegeln und Referenzen. Ist die Akte angelegt, kann sie über eine Web-Anwendung dargestellt werden. Neben den Einträgen soll man auch sogenannte Learnings anlegen können. Diese werden mit einer Frage und 1-x Antworten gefüllt. Zudem hat der Benutzer die Möglichkeit, eine Grafik (meist MRT Ergebnis) zu platzieren, auf die der Endanwender zeichnen kann, um eine bestimmte Stelle zu markieren.

Frontend

Entwicklung der Web-Anwendung mit Angular (V12) zur Darstellung von Patientenakten. Jede im Backoffice angelegte Patientenakte bekommt eine eindeutige ID. Über eine URL + ID lässt sich die Akte in der App öffnen und anzeigen. Besonderes Augenmerk liegt hierbei auf der Darstellung der einzelnen Einträge der Akte. Diese lassen sich in Form von slides horizontal scrollen. Jede Kategorie hat eine eigene Farbe, Icon und Hintergrundbild. Unterhalb der Slides ist eine Art Zeitleiste, auf der sämtliche Einträge chronologisch angeordnet sind. Diese dienen als Link zu den einzelnen Slides, um so gezielt einzelne Einträge zu öffnen. Hat man die Akte durch, kommt am Ende eine Reihe Multiple Choice Fragen, die man beantworten muss und Aufgaben zum Zeichnen. Die Ergebnisse werden gespeichert und an einen API Endpunkt geschickt.