Product UI
Ich habe an den Clients für Bluebeaker Lab sowie Medmap Library, Doctor und Showroom gearbeitet: Suche, Ablage, Modellbearbeitung, Aufnahmen und Downloads. Das Video oben zeigt die Bedienung eines Modells im 3D-Viewer.
Suche und Ergebnisanzeige
In Library habe ich Suchbegriffe, Inhaltstypen, Kategorien und Seitennavigation mit den API-Abfragen verbunden. Ich habe leere Ergebnisse und Seitenwechsel behandelt und Autovervollständigungsanfragen bei koreanischer Texteingabe bis zum Abschluss der Zeichenkomposition zurückgestellt.
Ablage und passende Viewer
Ich habe Ordnererstellung, Umbenennung und Dateiverwaltung verbunden. Je nach ausgewähltem Inhalt wurde ein Modell-, Bild- oder Video-Viewer angezeigt. Im 3D-Viewer steuerte der UI-Zustand Kamera-Reset, Ansichtswechsel und Bildschirmaufnahmen.
Web und Desktop verbinden
Doctor war eine Weboberfläche innerhalb einer WPF-Anwendung. Ich habe die vom Host übergebenen Inhaltsdaten im WebView empfangen und im Viewer angewendet, sodass Web-Editor und umgebende GUI zusammenarbeiteten.
Content Tools
Ich habe Administrationsoberflächen entwickelt, mit denen Betreiber und Designer Inhalte registrieren und deren Darstellung prüfen konnten. Zum Ablauf gehörten neben dem Upload auch Modelldaten, Vorschaubilder, Vorschauansichten und Rendering-Einstellungen.
Registrierung und Uploads
Der Client legte zuerst die Metadaten an, forderte Upload-URLs an und übertrug Dateien und Vorschaubilder. Nach dem Upload wurde die Liste aktualisiert, damit der neue Inhalt direkt auf derselben Seite sichtbar war.
3D-Einstellungen als Bedienelemente
Ich habe Bedienfelder für Kamerakalibrierung, Licht, Schatten, SSS und Interaktionsgrenzen mit dem Viewer verbunden. Designer konnten die Darstellung über Bedienelemente prüfen, ohne Code bearbeiten zu müssen.
Rendering & Assets
Ich habe sowohl die Viewer-Bedienung als auch die Asset-Größe bearbeitet. Kleinere Dateien allein reichten nicht aus: Gemeinsam mit Designern habe ich Details vor und nach der Optimierung verglichen und geeignete Einstellungen für den Webeinsatz abgestimmt.
Objektauswahl und mehrere Ansichten
Für die Modellauswahl habe ich three-mesh-bvh eingesetzt; mehrere Ansichten wurden über Scissor-Bereiche gerendert. In Lab blieb der Canvas bei Seitenwechseln bestehen, und DOM-Bedienelemente waren mit der 3D-Szene verbunden.
Wiederkehrende Asset-Arbeit automatisieren
Mit gltf-transform habe ich doppelte und ungenutzte Daten entfernt sowie Mesh-Zusammenführung und -Vereinfachung automatisiert. Für Geometrie kamen Draco und Meshopt zum Einsatz, für Texturen KTX2. Veränderungen an Normal Maps und wichtigen Details habe ich in der Vorschau geprüft und die Parameter angepasst.