Metlivi-bloggen

Så utformar du förhandsvisningar av möblering som förhindrar kollisioner och felplaceringar

I ett inredningsspel bör en förhandsvisning av en möbel besvara tre frågor innan spelaren bekräftar: var hamnar föremålet, är den positionen tillåten och vad händer om spelaren roterar eller avbryter? Visa en levande ”spökbild” av föremålet, kontrollera dess fotavtryck vid den aktuella positionen och rotationen och ange tydligt varför placeringen blockeras. Låt förhandsvisningen visas tills spelaren bekräftar, och se till att avbryt återför spelaren till rummet utan att något placeras. Den här guiden fokuserar på hur spelutvecklare kan utforma den här placeringsinteraktionen.

30 september 20266 min läsningAv Metlivi Editorial Team
Avsnitt 1

Vad bör förhandsvisningen visa?

Se förhandsvisningen som en tillfällig version av den färdiga möbeln, inte bara som en markör för muspekaren. Den bör visa föremålets storlek, riktning, kontaktpunkt mot golvet eller stödunderlaget samt placeringens status. Googles designriktlinjer för ARCore rekommenderar att målpunkten visas med föremålet eller dess skugga och att användaren får snabb återkoppling när en yta upptäcks. Även om placering i AR har andra begränsningar än i ett inredningsspel gäller samma princip: spelaren behöver se var föremålet hamnar innan hen bekräftar. Googles riktlinjer för placering av innehåll i ARCore

En användbar förhandsvisning har tre tydliga lägen: giltigt, ogiltigt och oklart. Giltigt innebär att den föreslagna placeringen uppfyller spelets regler. Ogiltigt innebär att en känd regel bryts, till exempel att föremålet överlappar ett annat eller står på ett underlag som inte stöder det. Oklart innebär att spelet ännu inte kan avgöra om målet är giltigt, kanske för att markören befinner sig över en vägg när spelaren placerar en golvmöbel. Visa inte ett oklart läge som giltigt bara för att kollisionskontrollen inte hittar något; ”ingen kollision upptäckt” och ”kan placeras här” är inte samma sak.

Avsnitt 2

Hur bör giltighet skilja sig från kollisionsdetektering?

Kollision är bara en del av bedömningen av om en placering är giltig. En soffa kan stå utan att krocka med ett annat föremål och ändå befinna sig utanför rummet, sväva ovanför golvet, vara vänd åt ett oanvändbart håll eller blockera en dörröppning enligt spelets regler. Definiera giltighet som en checklista med villkor för varje möbelkategori: tillåtet underlag, rumsgräns, kollision, begränsningar för orientering och eventuellt krav på fritt utrymme för passage eller interaktion.

Håll hårda regler åtskilda från önskemål. En kollision eller ett underlag som inte stöder föremålet kan hindra bekräftelse. En trång passage kan ge en mjuk varning om spelet tillåter placeringen. Skillnaden gör att ett dekorativt förslag inte ser ut som ett absolut hinder och hjälper spelarna att förstå vilka villkor de själva kan välja att godta. Forskning om möbleringssystem behandlar också arrangemang som styrda av flera placeringsregler, inte enbart geometri. Stanfords publicerade system byggde in riktlinjer för inredningsdesign och utvärderade de föreslagna layouterna med deltagare. Det talar för att ta hänsyn till mer än kollisioner, men föreskriver inte ett visst gränssnitt i ett spel. Stanfords studie om interaktiv möblering

Den tekniska kontrollen bör använda samma transformerade fotavtryck som förhandsvisningen. Unreal Engines överlappnings-API beskriver hur en angiven kollisionsform kontrolleras vid en viss position och rotation, medan Unity 6:s Physics.OverlapBox tar emot ett centrum, halva sidlängder, orientering, lagermask och inställning för hantering av triggers. Dessa API:er visar varför en rotationsändring måste leda till en ny kontroll av den roterade formen. Motorernas beteende och API-detaljer varierar mellan versioner; använd dokumentationen för den motorversion och kollisionskonfiguration som faktiskt ingår i spelet. Unreal Engines överlappnings-API och Unity 6 Physics.OverlapBox

Avsnitt 3

Hur bör giltiga och ogiltiga positioner se ut?

Kombinera utseendet med en extra signal. Ändra till exempel spökbildens färgton och kontur och visa en kort status som ”Redo att placera” eller ”Överlappar bordet”. Enbart färg kan vara svår att urskilja, särskilt mot golv med varierande mönster eller belysning. Behåll möbelns silhuett synlig i båda lägena så att spelaren fortfarande kan bedöma position och rotation. Om en viss kolliderare orsakar blockeringen kan det hjälpa spelaren att komma vidare att visa vilken det är. Undvik att belasta förhandsvisningen med tekniska detaljer när en begriplig förklaring räcker.

Uppdatera statusen medan möbeln flyttas, inte först när spelaren trycker på bekräftelseknappen. Placera möbeln vid bekräftelse endast om den aktuella statusen är giltig, och ge en kort bekräftelse på att åtgärden lyckades. Om placeringen är ogiltig ska förhandsvisningen vara kvar och orsaken anges, så att spelaren kan justera möbeln utan att starta om interaktionen. Det här är en designrekommendation som bygger på målet att förhindra oavsiktlig placering och på Googles vägledning om att kommunicera fel tydligt och erbjuda en konkret väg vidare. Googles vägledning om feltillstånd

Förlita dig inte på en enda gräns som växlar hela spökbilden mellan giltig och ogiltig utan att förklara varför. Om en stol står för nära en vägg bör spelaren till exempel se det faktiska fotavtrycket och få en specifik signal som ”Utanför rummet” eller ”Överlappar väggen”. Om regeln bara uttrycker en preferens ska den anges som en varning, och bekräftelse ska fortfarande vara möjlig om det passar spelets design.

Avsnitt 4

Vilken återkoppling bör rotation ge?

Låt förhandsvisningen följa spelarens inmatning under rotationen och kontrollera giltigheten igen vid den nya vinkeln. Fotavtrycket kan svepa in i ett närliggande föremål även om möbelns mittpunkt knappt flyttas. Rotationskontrollen bör också göra förändringens riktning och storlek förutsägbara: en synlig rotationsuppmaning, ett tydligt steg vid stegvis rotation eller en indikator för kontinuerlig rotation kan visa vad inmatningen gör.

Uppdatera både spökbilden och eventuell riktningssignal efter rotationen. En liten pil på golvet, en markering på framsidan eller en tydlig framkant kan göra det lättare att se åt vilket håll en soffa eller ett skrivbord kommer att vara vänt. Om möbeln fäster mot ett rutnät eller roteras i fasta steg ska förhandsvisningen visa det fästa resultatet, inte bara markörens oprecisa position. Då kan spelaren bedöma den placering som faktiskt kommer att genomföras.

Avsnitt 5

Hur bör avbrytande och återställning fungera?

När spelaren håller i ett föremål ska det finnas en konsekvent och synlig kontroll för att avbryta. Avbryt ska ta bort spökbilden och återställa rummets tidigare tillstånd utan att i tysthet placera, ta bort eller flytta möbler. Om spelaren började med att flytta ett redan placerat föremål ska avbryt återställa det till dess ursprungliga position. Det här är en rekommenderad interaktionsregel, inte ett beteende som något motor-API garanterar.

Bekräfta och avbryt ska ha tydliga, åtskilda etiketter eller ikoner, och förhandsvisningen ska visas tills spelaren väljer ett av alternativen. När en placering blockeras ska du visa ett litet nästa steg – flytta, rotera eller avbryt – i stället för att låta spelaren gissa. Googles placeringsriktlinjer rekommenderar också tydlig felåterkoppling och en väg till lösning, och påpekar att användare kan behöva instruktioner innan de använder en dragrörelse. I spel bör den relevanta kontrollen visas när möbeln plockas upp, inte bara på en separat hjälpskärm. Googles vägledning för manuell placering

Avsnitt 6

Exempel: placera en bokhylla

Tänk dig att en spelare placerar en bokhylla intill en vägg. Förhandsvisningen hittar först en golvyta och ställer bokhyllan tätt mot väggen. Fotavtrycket överlappar ett sidobord, så spökbilden visar ett ogiltigt läge och texten ”Överlappar sidobordet”. Spelaren roterar bokhyllan. Fotavtrycket räknas om för den nya vinkeln och förhandsvisningen visar nu att den får plats utan att överlappa. En markering på framsidan visar vilket håll som kommer att vara vänt in mot rummet. Spelaren ser ”Redo att placera”, bekräftar och föremålet visas på den position som spökbilden visade.

Om bokhyllan i stället hamnar delvis utanför rumsgränsen bör spelet ange det villkoret även om ingen kollision med ett annat föremål finns. Om målytan inte kan fastställas ska spelet visa en neutral signal för oklart läge, till exempel ”Placera på golvet”, och inte tillåta bekräftelse. Meddelandena är illustrativa exempel, inte påståenden om funktioner i Metlivi eller uppmätta användbarhetsresultat.

Avsnitt 7

En praktisk designchecklista

Skriv före implementationen ned placeringsreglerna för varje föremålstyp och avgör vilka som ska blockera placering och vilka som ska ge varningar. Kontrollera sedan att förhandsvisningen använder samma fotavtryck, rotation, fästning och stödyta som det placerade föremålet. Prova vid väggkanter, hörn och trånga mellanrum samt efter rotation. Kontrollera att spökbilden inte godkänner en position som den slutliga placeringen avvisar. Testa till sist hela flödet: plocka upp, flytta, rotera, rätta till en ogiltig placering, placera och avbryt – även när spelaren avbryter under omplacering av befintliga möbler.

Beslutsregeln är enkel: visa det exakta föreslagna resultatet, skilj mellan giltiga, ogiltiga och oklara lägen, förklara det mest användbara hindret och behåll en förutsägbar väg till att rotera, justera, bekräfta eller avbryta. Då blir placeringsförhandsvisningen ett praktiskt beslutsstöd i stället för en varning i sista stund.

Relaterad läsning

Fortsätt utforska detta ämne