Entwurfsanleitung für 3D-App-Startprogramm

Wenn Sie ein Windows Mixed Reality immersives Headset (VR) aufsetzen, geben Sie das Windows Mixed Reality Zuhause ein. Das Haus wird als Haus auf einer Klippen dargestellt, die von Bergen und Wasser umgeben sind, aber Sie können andere Umgebungen auswählen und sogar Eigenes erstellen. Innerhalb des Raums des Hauses ist ein Benutzer frei, die 3D-Objekte und -Apps zu organisieren, die sie für jede gewünschte Art und Weise sorgen. Ein 3D-App-Startfeld ist ein "physisches" Objekt im Mixed Reality-Haus des Benutzers, das sie auswählen können, um eine App zu starten.

Example: Floaty Bird 3D app launcher
Floaty Bird 3D-App-Startfeld (fiktive App)

3D-App-Startprogrammerstellungsprozess

Es gibt 3 Schritte zum Erstellen eines 3D-App-Startfelds:

  1. Entwerfen und Konzeptieren (dieser Artikel)
  2. Modellieren und Exportieren
  3. Integrieren Sie sie in Ihre Anwendung:

Entwurfskonzepte

Fantastische, aber vertraut

Die Windows Mixed Reality Umgebung, in der Ihr App-Startfeld lebt, ist teil vertraut, teil fantastische/sci-fi. Die besten Launcher folgen den Regeln dieser Welt. Denken Sie daran, wie Sie ein vertrautes, repräsentatives Objekt aus Ihrer App nehmen können, aber einige der Regeln der tatsächlichen Realität verbiegen. Magisches Ergebnis.

Intuitiv

Wenn Sie sich Ihr App-Startfeld ansehen, sollte der Zweck, Ihre App zu starten, offensichtlich sein und keine Verwirrung verursachen. Stellen Sie beispielsweise sicher, dass Ihr Startfeld ein offensichtlich genug vertreter Ihrer App ist, dass sie nicht für ein Stück Dekor im Cliff House verwechselt wird. Ihr App-Startfeld sollte Personen einladen, sie zu berühren/auszuwählen.

Example: Fresh Note 3D app launcher
Fresh Note 3D-App-Startfeld (fiktive App)

Startskala

3D-App-Startplätze leben im Cliff House und ihre Standardgröße sollte mit den anderen "physischen" Objekten im Raum sinnvoll sein. Wenn Sie Ihr Startfeld neben, sagen, ein Hauswerk oder einige Möbel platzieren, sollte es sich zu Hause fühlen, Größe weise. Ein guter Ausgangspunkt besteht darin, zu sehen, wie es sich um 30 Kubikmeter handelt, aber denken Sie daran, dass Benutzer es nach oben oder unten skalieren können, wenn sie möchten.

Eigenes Fähig

Das App-Startfeld sollte sich wie ein Objekt fühlen, das sich eine Person freuen würde, in ihrem Raum zu haben. Sie werden sich praktisch mit diesen Dingen umgeben, sodass der Startfeld wie ein Gefühl hat, dass der Benutzer wünschenswert genug war, um zu suchen und in der Nähe zu bleiben.

Example: Astro Warp 3D app launcher
Astro Warp 3D-App-Startfeld (Fiktive App)

Erkennbar

Ihr 3D-App-Startfeld sollte sofort "Ihre App-Marke" für Personen ausdrücken, die es sehen. Wenn Sie über ein Sternzeichen oder ein besonders identifizierbares Objekt in Ihrer App verfügen, empfehlen wir, dies als wesentlicher Teil Ihres Designs zu verwenden. In einer Mixed Reality-Welt zeichnet ein Objekt mehr Interesse von Benutzern als nur ein Logo allein. Erkennbare Objekte kommunizieren schnell und klar.

Volumetrische

Ihre App verdient mehr als nur das Setzen Ihres Logos auf ein flaches Flugzeug und ruft es einen Tag auf. Ihr Startfeld sollte sich wie ein aufregendes, 3D-, physisches Objekt im Raum des Benutzers fühlen. Ein guter Ansatz besteht darin, sich vorzustellen, dass Ihre App einen Sprechblasen im Macys Thanksgiving Day Parade hat. Fragen Sie sich selbst, was würde wirklich Menschen begeistern, da es auf der Straße kam? Was würde aus allen Anzeigewinkeln gut aussehen?

Logo onlyNur Logo

More recognizable with a characterMit einem Zeichen erkennbarer

Flat approach, not surprisingly, feels flatFlacher Ansatz, nicht überraschend, fühlt sich flach

Volumetric approach better showcases your appVolumetric-Ansatz zeigt Ihre App besser an

Tipps für gute 3D-Modelle

  • Wenn Sie Dimensionen für Ihr App-Startfeld planen, drehen Sie ungefähr einen 30-cm-Würfel. Ein Größenverhältnis von 1:1:1.
  • Modelle müssen unter 10.000 Polygonen sein. Weitere Informationen zu Dreiecksanzahlen und Detailebenen (LODs)
  • Testen Sie ein immersives Headset.
  • Erstellen Sie Details in die Geometrie Ihres Modells, wo möglich – verlassen Sie sich nicht auf Texturen für Details.
  • Erstellen Sie "wasserdichte" geschlossene Geometrie. Keine Löcher, die nicht modelliert sind.
  • Verwenden Sie natürliche Materialien in Ihrem Objekt. Imagine sie in der realen Welt gestalten.
  • Stellen Sie sicher, dass Ihr Modell bei verschiedenen Entfernungen und Größen gut liest.
  • Wenn Ihr Modell bereit ist, zu wechseln, lesen Sie die Richtlinien für exportierende Ressourcen.

Model with subtle details in the texture
Modell mit subtilen Details in der Textur

Was Sie vermeiden sollten

  • Verwenden Sie keine Details mit hohem Kontrast oder kleine, beschäftigte Muster und Texturen.
  • Verwenden Sie keine dünne Geometrie – es funktioniert nicht gut in einer Entfernung und wird alias schlecht.
  • Lassen Sie Teile Ihres Modells nicht zu viel über das Größenverhältnis von 1:1:1 erweitern. Es wird Skalierungsprobleme erstellen.

Avoid high-contrast, small busy patterns
Vermeiden sie hohe Kontraste, kleine, gebuchte Muster

Behandeln des Typs

  • Wir empfehlen, dass Ihr Typ etwa 1/3 Ihrer App-Startfeld (oder mehr) aufnimmt. Der Typ ist das Hauptelement, das Personen eine Idee gibt, dass Ihr Startfeld tatsächlich ein Startfeld ist, damit es schön ist, wenn es erheblich ist.
  • Vermeiden Sie es, den Typ super breit zu machen – versuchen Sie es innerhalb der Grenzen der App-Startfeld-Kerndimensionen (mehr oder weniger).
  • Flacher Typ kann funktionieren, aber es kann schwer sein, aus bestimmten Winkeln und in bestimmten Umgebungen anzuzeigen. Möglicherweise sollten Sie es ein solides Objekt oder einen Hintergrund hinter es setzen, um dies zu unterstützen.
  • Das Hinzufügen von Dimension zu Ihrem Typ fühlt sich in 3D schön an. Das Schattieren der Seiten des Typs kann eine andere, dunkleere Farbe helfen, die Lesbarkeit zu ermöglichen.

Flat type without a backdrop can be hard to view from certain angles and in certain environmentsFlacher Typ ohne Hintergrund kann von bestimmten Winkeln und in bestimmten Umgebungen schwer angezeigt werden.

Type with a built-in backdrop can work wellTyp mit integriertem Hintergrund kann gut funktionieren

Extruded type can work well if you shade the sidesExtrudierte Art kann gut funktionieren, wenn Sie die Seiten abschattieren

Geben Sie Farben ein, die funktionieren

  • Weiß
  • Schwarz
  • Helle halbgesättigte Farbe

Type colors that work.
Geben Sie Farben ein, die funktionieren

Farben, um zu vermeiden

Typfarben, die Probleme verursachen, umfassen:

  • Mittlere Töne
  • Grau
  • Übersättigungsfarben oder entaturierte Farben

Type colors that cause trouble.
Typfarben, die Probleme verursachen

Beleuchtung

Die Beleuchtung für Ihr App-Startfeld stammt aus der Cliff House-Umgebung. Stellen Sie sicher, dass Sie Ihr Startfeld an mehreren Stellen im gesamten Haus testen, damit sie sowohl hell als auch schattenweise gut aussieht. Die gute Nachricht ist, wenn Sie die anderen Entwurfsleitlinien in diesem Dokument gefolgt haben, sollte Ihr Startfeld für die meisten Beleuchtung im Cliff House in guter Form sein.

Gute Orte, um zu testen, wie Ihr Startfeld in den verschiedenen Lichtern in der Umgebung aussieht, sind das Studio, der Media Room, überall außerhalb und auf der Back Patio (der konkrete Bereich mit dem Rasen). Ein weiterer guter Test besteht darin, es in halb hell und halb Schatten zu setzen und zu sehen, wie es aussieht.

Make sure your launcher looks good in both light and shadows.
Stellen Sie sicher, dass Ihr Startfeld sowohl in Licht als auch Schatten gut aussieht.

Texturierung

Erstellen ihrer Texturen

Das Endformat Ihres 3D-App-Startfelds ist eine GLB-Datei, die mit der PBR-Pipeline (Physisches Basiertes Rendering) hergestellt wird. Dies kann ein schwieriger Prozess sein – jetzt ist ein guter Zeitpunkt, um einen technischen Künstler zu verwenden, wenn Sie noch nicht bereits haben. Wenn Sie ein mutiger DIY-Er sind, nehmen Sie die Zeit, die PBR-Terminologie zu untersuchen und zu lernen , und was unter der Haube geschieht, bevor Sie beginnen, helfen Ihnen, häufige Fehler zu vermeiden.

Example: Fresh Note app
Fresh Note 3D-App-Startfeld (fiktive App)

Wir empfehlen die Verwendung von Substanz-Maler durch Allegorithmic, um Ihre endgültige Datei zu erstellen. Wenn Sie nicht mit der Erstellung von PBR-Shadern in Substance Painter vertraut sind, finden Sie ein Lernprogramm.

(Alternativ würden 3D-Coat, Quixel Suite 2 oder Marmoset Toolbag auch funktionieren, wenn Sie mehr mit einer dieser Funktionen vertraut sind.)

Bewährte Methoden

  • Wenn Ihr App-Startprogrammobjekt für PBR erstellt wurde, sollte es einfach sein, sie für die Cliff House-Umgebung zu konvertieren.
  • Unser Shader erwartet einen Metal/Roughness-Arbeitsfluss – Der Unreal PBR-Shader ist eine enge Faksimile.
  • Wenn Sie Ihre Texturen exportieren, beachten Sie die empfohlenen Texturgrößen .
  • Stellen Sie sicher, dass Sie Ihre Objekte für die Echtzeitbeleuchtung erstellen– dies bedeutet:
    • Vermeiden von gebackenen Schatten – oder bemalten Schatten
    • Vermeiden von Backlicht in den Texturen
    • Verwenden Sie einen der PBR-Materialerstellungspakete, um die richtigen Karten zu erhalten, die für unseren Shader generiert werden.

Siehe auch