Metlivi Blog

So gestalten Sie Vorschauen für die Möbelplatzierung, die Kollisionen und Fehlplatzierungen verhindern

In einem Einrichtungsspiel sollte eine Möbelvorschau drei Fragen beantworten, bevor der Spieler bestätigt: Wo landet das Objekt, ist diese Position erlaubt und was passiert beim Drehen oder Abbrechen? Nutzen Sie ein Live-„Geisterbild“ (Ghost) des Objekts, validieren Sie dessen Grundfläche an der aktuellen Position sowie Rotation und zeigen Sie eine klare Begründung an, wenn die Platzierung blockiert ist. Halten Sie die Vorschau bis zur Bestätigung sichtbar und sorgen Sie dafür, dass ein Abbruch den Spieler in den Raum zurückbringt, ohne etwas zu platzieren. Dieser Leitfaden konzentriert sich auf das Design dieser Platzierungsinteraktion für Spieleentwickler.

30. September 20266 min LesezeitFreizeit, Reisen & StadtlebenVon Metlivi Editorial Team
Abschnitt 1

Was sollte die Vorschau vermitteln?

Betrachten Sie die Vorschau als temporäre Version des endgültigen Möbelstücks und nicht bloß als Cursor-Markierung. Sie sollte die Größe des Objekts, die Ausrichtung, den Kontaktpunkt mit dem Boden oder der Auflagefläche und den Platzierungsstatus anzeigen. Die ARCore-Designrichtlinien von Google empfehlen, den Zielpunkt mit dem Objekt oder seinem Schatten zu visualisieren und zeitnahes Feedback zu geben, sobald eine Oberfläche erkannt wird. Obwohl die AR-Platzierung anderen Einschränkungen unterliegt als ein Dekorationsspiel, gilt dasselbe Prinzip: Spieler müssen sehen, wohin ein Objekt gelangt, bevor sie sich festlegen. ARCore-Leitfaden zur Platzierung von Inhalten von Google

Eine nützliche Vorschau verfügt über drei klar erkennbare Zustände: gültig, ungültig und ungelöst. Gültig bedeutet, dass die vorgeschlagene Platzierung den Spielregeln entspricht. Ungültig bedeutet, dass eine bekannte Regel verletzt wird, beispielsweise eine Überlappung mit einem anderen Objekt oder eine nicht unterstützte Oberfläche. Ungelöst bedeutet, dass das Spiel noch kein gültiges Ziel bestimmen kann, etwa weil sich der Cursor über einer Wand befindet, während ein Bodenmöbelstück platziert wird. Stellen Sie den Zustand ‚ungelöst‘ nicht einfach als gültig dar, nur weil die Kollisionsprüfung nichts gefunden hat; ‚keine Kollision erkannt‘ und ‚kann hier platziert werden‘ sind nicht dasselbe Ergebnis.

Abschnitt 2

Wie sollte sich Gültigkeit von der Kollisionserkennung unterscheiden?

Kollision ist nur ein Teil der Platzierungsgültigkeit. Ein Sofa schneidet sich vielleicht nicht mit einem anderen Objekt, befindet sich aber möglicherweise außerhalb des Raums, schwebt über dem Boden, ist in eine unbrauchbare Richtung gedreht oder blockiert gemäß den Spielregeln eine Türöffnung. Definieren Sie Gültigkeit als eine Checkliste von Einschränkungen für jede Möbelkategorie: zulässige Auflagefläche, Raumbegrenzung, Kollision, Ausrichtungsgrenzen sowie jeglicher bewusste Freiraum für Zugang oder Interaktion, den das Spiel vorsieht.

Trennen Sie strikte Regeln von Präferenzen. Eine Kollision oder eine nicht tragende Oberfläche kann eine Bestätigung verhindern. Ein enger Durchgang könnte als sanfte Warnung angezeigt werden, sofern das Spiel dies zulässt. Diese Unterscheidung verhindert, dass ein gestalterischer Vorschlag wie ein harter Fehler wirkt, und lässt Spieler verstehen, welche Bedingungen sie wahlweise akzeptieren können. Die Forschung zu Möbel-Layout-Systemen betrachtet Anordnungen ebenfalls als von mehreren Layout-Regeln geleitet und nicht allein von der Geometrie; das von Stanford veröffentlichte System berücksichtigte Richtlinien für die Innenarchitektur und evaluierte vorgeschlagene Layouts mit Teilnehmern. Dies spricht dafür, mehr als nur Kollisionen zu berücksichtigen, schreibt jedoch keine bestimmte Spieloberfläche vor. Stanfords Studie zum interaktiven Möbel-Layout

Die technische Überprüfung sollte mit der transformierten Grundfläche der Vorschau übereinstimmen. Die Overlap-API der Unreal Engine beschreibt die Überprüfung einer bereitgestellten Kollisionsform an einer bestimmten Position und Rotation, während Physics.OverlapBox in Unity 6 einen Mittelpunkt, Halbachsen, eine Ausrichtung, eine Layer-Maske und ein Trigger-Verhalten akzeptiert. Diese APIs veranschaulichen, warum eine Änderung der Rotation eine Überprüfung der gedrehten Form auslösen muss. Das Verhalten der Engine und die API-Details variieren je nach Version; verwenden Sie die Dokumentation für die Engine-Version und das Kollisions-Setup, mit denen das Spiel tatsächlich ausgeliefert wird. Unreal Engine Overlap-API und Unity 6 Physics.OverlapBox

Abschnitt 3

Wie sollten gültige und ungültige Positionen aussehen?

Kombinieren Sie das Erscheinungsbild mit einem redundanten Hinweis. Ändern Sie beispielsweise die Tönung und die Umrandung des Ghost-Objekts und zeigen Sie einen kurzen Status wie „Bereit zum Platzieren“ oder „Überlappt mit Tisch“ an. Farbe allein ist oft schwer zu unterscheiden, insbesondere auf unterschiedlichen Böden oder bei wechselnder Beleuchtung. Halten Sie die Silhouette des Möbelstücks in beiden Zuständen sichtbar, damit der Spieler dessen Position und Drehung weiterhin beurteilen kann. Wenn ein bestimmter Collider die Blockierung verursacht hat, kann dessen Kennzeichnung bei der Korrektur helfen; vermeiden Sie es, die Vorschau mit technischen Details zu überfrachten, wenn eine einzige verständliche Begründung ausreicht.

Lassen Sie den Status aktualisieren, während sich das Möbelstück bewegt, und nicht erst nach dem Drücken der Bestätigungstaste. Platzieren Sie das Möbelstück bei Bestätigung nur, wenn der aktuelle Zustand gültig ist, und geben Sie eine kurze Bestätigung aus, dass die Aktion erfolgreich war. Ist er ungültig, halten Sie die Vorschau aktiv und nennen Sie den Grund, damit der Spieler die Position anpassen kann, ohne die Interaktion neu zu starten. Dies ist eine Designempfehlung, die aus dem Ziel abgeleitet ist, versehentliche Platzierungen zu verhindern, sowie aus Googles Leitfaden, Fehler klar zu kommunizieren und einen machbaren Weg zur Behebung anzubieten. Googles Leitfaden zu Fehlerzuständen

Vermeiden Sie es, sich auf einen einzelnen Schwellenwert zu verlassen, der das gesamte Geisterbild zwischen gültig und ungültig umschaltet, ohne zu erklären, warum. Wenn ein Stuhl beispielsweise zu nah an einer Wand steht, sollte der Spieler die tatsächliche Grundfläche sehen und einen konkreten Hinweis wie „Außerhalb des Raums“ oder „Überlappt mit Wand“ erhalten. Wenn die Regel nur eine Präferenz darstellt, kennzeichnen Sie sie als Warnung und lassen Sie die Bestätigung weiterhin zu, sofern dies zum Spieldesign passt.

Abschnitt 4

Welches Feedback sollte die Drehung liefern?

Lassen Sie die Vorschau während des Drehens an die Eingabe des Spielers gekoppelt und validieren Sie sie im neuen Winkel erneut. Die Grundfläche kann selbst dann in ein nahegelegenes Objekt hineinragen, wenn sich der Mittelpunkt des Gegenstands kaum bewegt. Eine Drehsteuerung sollte zudem die Richtung und das Ausmaß der Änderung vorhersehbar machen: Eine sichtbare Aufforderung zum Drehen, ein klarer Schrittwert für stufenweises Drehen oder eine kontinuierliche Rotationsanzeige können verdeutlichen, welche Auswirkung die Eingabe hat.

Aktualisieren Sie nach dem Drehen sowohl das Ghost-Objekt als auch etwaige Orientierungshinweise. Ein kleiner, zum Boden zeigender Pfeil, eine Frontmarkierung oder eine sichtbare Vorderkante können es erleichtern zu erkennen, in welche Richtung ein Sofa oder ein Schreibtisch zeigen wird. Wenn das Möbelstück an einem Raster oder festen Schritten einrastet, zeigen Sie das eingerastete Ergebnis in der Vorschau an, nicht nur die nicht eingerastete Cursorposition. So kann der Spieler die Platzierung beurteilen, die letztendlich tatsächlich ausgeführt wird.

Abschnitt 5

Wie sollten Abbrechen und Wiederherstellen funktionieren?

Stellen Sie beim Bewegen eines Objekts eine konsistente, sichtbare Schaltfläche zum Abbrechen bereit. Das Abbrechen sollte das Ghost-Objekt entfernen und zum vorherigen Raumzustand zurückkehren, ohne Möbelstücke stillschweigend zu platzieren, zu löschen oder zu verschieben. Wenn der Spieler damit begonnen hat, ein bereits platziertes Objekt zu verschieben, sollte das Abbrechen dieses an seine ursprüngliche Position zurücksetzen; dies ist eine empfohlene Interaktionsregel und kein von einer Engine-API garantiertes Verhalten.

Die Aktionen zum Bestätigen und Abbrechen benötigen unterschiedliche Beschriftungen oder Symbole, und die Vorschau sollte bestehen bleiben, bis eine davon ausgewählt wird. Wenn eine Platzierung blockiert ist, zeigen Sie einen kurzen nächsten Schritt an – Verschieben, Drehen oder Abbrechen –, anstatt den Spieler raten zu lassen. Der Platzierungsleitfaden von Google empfiehlt ebenfalls ein klares Feedback bei Fehlern sowie einen Weg zur Lösung und weist darauf hin, dass Nutzer vor der Verwendung einer Ziehgeste möglicherweise eine Anleitung benötigen. Zeigen Sie bei Spielen die relevante Steuerung direkt an, wenn das Möbelstück aufgenommen wird, und nicht erst in einem separaten Hilfebildschirm. Googles Leitfaden zur manuellen Platzierung

Abschnitt 6

Ein praktisches Beispiel: Platzieren eines Bücherregals

Stellen Sie sich einen Spieler vor, der ein Bücherregal an einer Wand positioniert. Die Vorschau findet zunächst ein Bodenziel und lässt das Bücherregal an der Wand einrasten. Seine Grundfläche überschneidet sich mit einem Beistelltisch, sodass das Geisterbild einen ungültigen Zustand und „Überlappt mit Beistelltisch“ anzeigt. Der Spieler dreht es; die Grundfläche wird im neuen Winkel neu berechnet, und die Vorschau passt nun ohne Überlappung. Eine nach vorne gerichtete Markierung bestätigt, welche Seite in den Raum zeigen wird. Der Spieler sieht „Bereit zum Platzieren“, bestätigt, und das Objekt erscheint an der durch das Geisterbild angezeigten Position.

Landet das Bücherregal stattdessen teilweise außerhalb der Raumbegrenzung, sollte das Spiel diese Einschränkung auch dann erkennen, wenn keine Objektkollision vorliegt. Kann die Zielfläche nicht bestimmt werden, zeigen Sie einen neutralen Hinweis für den ungelösten Zustand wie „Auf dem Boden platzieren“ an und lassen Sie keine Bestätigung zu. Diese Meldungen sind illustrative Beispiele, keine Behauptungen über Funktionen von Metlivi oder gemessene Usability-Ergebnisse.

Abschnitt 7

Eine praktische Design-Checkliste

Notieren Sie vor der Implementierung die Platzierungsregeln nach Objekttyp und entscheiden Sie, welche davon Blockaden und welche lediglich Warnungen sind. Vergewissern Sie sich anschließend, dass die Vorschau dieselbe Grundfläche, Drehung, Einrastung und denselben Auflagepunkt verwendet wie das platzierte Objekt. Überprüfen Sie die Interaktion an Wandkanten, Ecken, schmalen Lücken und nach dem Drehen; stellen Sie sicher, dass das Ghost-Objekt keine Position als gültig markiert, die bei der endgültigen Platzierung abgelehnt wird. Testen Sie abschließend den gesamten Ablauf: Aufnehmen, Bewegen, Drehen, Beheben einer ungültigen Position, Platzieren und Abbrechen – einschließlich des Abbruchs beim Neupositionieren vorhandener Möbel.

Die Entscheidungsregel ist unkompliziert: Zeigen Sie das exakte vorgeschlagene Ergebnis, unterscheiden Sie zwischen gültigen, ungültigen und ungelösten Zuständen, erklären Sie den hilfreichsten Grund für eine Blockierung und gewährleisten Sie einen vorhersehbaren Weg zum Drehen, Anpassen, Bestätigen oder Abbrechen. Dadurch wird die Platzierungsvorschau zu einer echten Entscheidungshilfe statt zu einer Warnung in letzter Sekunde.

Weitere Artikel

Dieses Thema weiter erkunden