Wie man in AR designt

8. April 2021

Der spannende und möglichkeitenreiche Weg zum Design von
UX & UI in Augmented Reality
Erika Bosch Ramirez (Lead Designer)

Hallo zusammen!

Ich bin Erika Bosch Ramirez, Lead Designer bei Zaubar, wo wir Zeitreisen durch immersive und faszinierende Erlebnisse und Touren möglich machen, und ich werde versuchen, dir auf eine sehr einfache Art und Weise die holprige und überhaupt nicht lineare Methode zu erklären, die ich (und vielleicht auch andere Designer) nutze für das Design von UX/UI und Erlebnissen im Allgemeinen in Augmented Reality.

Erika Bosch Ramirez

Anwendungsfälle: Wann ist es notwendig, in AR zu designen?

AR wird bis jetzt als Gimmick gesehen, aber wann ist es wirklich nützlich? Für mich gibt es zwei Fälle, für die AR nützlich ist:

 

Um zu zeigen, dass etwas nicht mehr da ist, oder noch nicht da ist.

Das übersetzt sich direkt in historische oder futuristische Visionen; etwas Verspieltes, Fantastisches und außerhalb unserer möglichen Vorstellung.

Es gibt einige Faktoren, die wir in Betracht ziehen sollten, wenn wir darüber nachdenken, wofür wir entwerfen:

  • Scenario: Wo werden deine Nutzer deine Anwendung nutzen? Ist es nur zu Hause? Werden sie genug Platz haben, um die Assets aus deiner App zu nutzen? Ist es draußen? Werden die Leute die App auch in engen Straßen oder an überfüllten Plätzen nutzen können?
  • Personas: Unsere Plattform soll für den gewöhnlichen Touristen, aber auch für den Reiseleiter als Werkzeug der Gestaltung genutzt werden. Wir haben noch mehr Fälle, aber lass uns nicht zu kompliziert werden.
  • Zeit: Ist es Nacht, wo alles dunkel ist? Dann würde AR vielleicht nicht viel helfen. Ist es Tag, wenn die Sonne sehr hell ist? Vielleicht musst du berücksichtigen, dass einige Farben nicht so gut zu sehen sind.

 

Der Designer gibt keine Antworten, sondern Fragen.

Leute, die noch nie in ihrem Leben designt haben, denken vielleicht, dass Designer verwirrt sind oder nicht wissen, was sie tun sollen... aber das ist unsere Art zu arbeiten, mehr Informationen herauszufinden, um eine bessere Lösung zu haben. Wir müssen alles wissen! Bleib also neugierig 😉

Spielen mit Objekten und Kompositionen in AR, unter Verwendung verschiedener Elemente, die so im Raum platziert werden müssen, dass sie benutzerfreundlich bleiben: z.B. halbtransparente Böden und Wände, die noch sehen lassen, was in der realen Welt passiert.

 

Hintergrundinformationen und Wissen

Abgesehen davon, dass du neugierig bist und viel fragst, würde es dir in diesem Prozess helfen, dich mit räumlichem Design vertraut zu machen. Entwirf etwas in 3D, auch wenn es nur etwas Einfaches ist, oder zeichne ein paar Skizzen im Maßstab, versuche etwas über Perspektive und Isometrie zu lernen.

Ich persönlich habe einen Hintergrund in Architektur, was sehr hilfreich war, nicht nur für das besondere Gefühl, das für AR notwendig ist, sondern auch fürBeleuchtung, Materialien, Standardmaße und alle anderen Teile des Designs wie Proportionen, Kompositionen, etc.

 

Ansätze und Methoden: genauso wie 2D UX/UI?

Hey, warte! Nicht alles dreht sich um 3D? Nein! Es gibt immer noch unser gutes altes 2D Interface, das wir nicht vergessen sollten, denn dieses hat auch andere Funktionen und Zwecke als das 3D UI. Unser User, der an 2D UI gewöhnt ist, sollte immer noch in der Lage sein, unsere App ohne Handbuch oder ein Architektenstudium zu bedienen 😉 .

Hierfür ist es wichtig, durch Tests zu beobachten, was deine Nutzer tun, wenn du ihnen einen Prototypen präsentierst. Ist ihre erste Reaktion, wenn sie ein 3D-Objekt im Raum platzieren, es zu greifen (wie im echten Leben) oder nutzen sie tatsächlich einige der 2D-Schnittstellen, um es zu manipulieren?

Vorlagen, Vorlagen, Vorlagen ...

Einige Leute würden sagen (ich auch), dass das Verwenden von Vorlagen die Innovation tötet, aber für die ersten Tests ist es keine schlechte Idee, gute Beispiele von bestehenden Handlungen zu nehmen. Und damit meine ich nicht unbedingt, dass man sich Ideen von Apps holt, die genau das Gleiche machen (denn das ist in unserem Fall auch sehr schwierig), sondern dass man sich auch von realen oder analogen Schnittstellen inspirieren lässt, wie zum Beispiel, wie wir tatsächlich die Teile eines Puzzles mit unseren Händen bewegen, oder wie wir Dinge beim Kochen greifen, etc.

Also geh und mach dir ein Moodboard mit guten Inspirationen.

Pineapple inspiration

Analyse der Bewegung des Handgelenks beim Halten einer Ananas. Credit: Martin Sanchez (Unsplash)

Für das Prototyping gibt es wie immer mehr als eine Option:

  • Prototypen aus Papier: das würde ich gerade für die erste Phase des Ideensammelns empfehlen, da es sehr schnell geht und man schnell mit mehreren Ideen experimentieren kann.
  • Digitale Wireframes und Mockups: dafür bräuchtest du so viele Tools und Ansätze, die du nutzen kannst. Ja, es ist irgendwie traurig, dass es immer noch kein Tool gibt, das alles kann, aber gerade deshalb ist die Kommunikation im Team sehr wichtig und ein motiviertes Team, das Dinge testen will, bevor es ewig darüber redet.

 

Tools

Hier zeige ich dir eine Liste mit den aktuellen Anwendungen, die ich benutze und wofür:

  • Photoshop: für Visuelles
  • Figma: für die Erstellung von 2D-Grafik-Assets und UI
  • Adobe Aero: zum Testen von Sichtbarkeit, Größe, Animationen und etwas Bedienbarkeit.
  • After Effects + Lottiflies: für Mikrointeraktionen und allgemeine Animationen
  • Zaubar App: unsere eigene App haben wir bereits, in der wir auch die Positionierung von Objekten und die Darstellung durch mehrere Szenen testen können.

Teste eine Komponente der Office Tour in meinem Wohnzimmer mit Adobe Aero, es fühlt sich fast so an, als wäre sie da!

 

Testen

Es ist sehr wichtig zu testen, wenn du noch nicht so viel Erfahrung hast und auch wenn du sie hast, um zu sehen, wie dein Design mit der Umgebung funktioniert: Hindernisse, Licht, Menschen in der Nähe. 

Ich teste auch an echten Menschen, in unserem eigenen Team jede Woche und auch mit echten Kunden (Tourguides), die mit uns in unserer Beta-Version arbeiten.

Wenn möglich, versuche immer mit möglichst realen Fällen und echten Menschen zu testen, da dies immer die besten und saftigsten Informationen zurückwerfen wird.

Test Tour ZAUBAR

Ich und unsere Mitgründerin Anne-Sophie und Tour-Guide Frank Marx (Frank-in-Cisco) für einige Tests vor Ort.

 

Erlerntes

Ich hatte das Glück, schon einige Erfahrungen zu machen, die noch nicht viele Leute haben, so habe ich einige Dinge gelernt, die du vielleicht nützlich oder interessant findest:

  • Mach das UI so einfach wie möglich, damit ein Kind es benutzen kann.
  • Teste, teste, teste, und wenn möglich in echten Fällen mit echten Menschen.
  • Mache etwas in AR nur wenn es einen gewissen Wert hat.
  • Verwende Muster, bis du das Gefühl hast, dass du sie für deine eigenen Designs optimieren kannst.

 

 

Gefällt dir der Artikel? Verbreite die Nachricht