Topp 5 beste brukergrensesnitt for videospill

Feirer de største brukergrensesnittdesignene innen spill

La oss være ærlige. Brukergrensesnittet (UI) til et videospill er en av de minst sannsynlige tingene med det for å etterlate et varig inntrykk på deg. Du vil sannsynligvis huske den anspente atmosfæren, den spennende historien, den intense kampen, en kul søken eller en morsom karakter over noe klønete grensesnitt som du tidvis trekker opp for å utføre oppgaver som ofte føles som gjøremål: å kjøpe og selge ting, oppgradere dine utstyr, eller lese opp på lore.

Heldigvis har spillmediet modnet veldig raskt de siste to tiårene. Både spillere og spillstudioer er klar over den sterke forskjellen det gjør når et grensesnitt er tett integrert i spillet til et som er klappet på som en ettertanke noen måneder før det sendes. Spillene på denne listen har bidratt sterkt til å skyve grensesnittdesign fremover, så her er en nedtelling av de beste videospill-brukergrensesnittene som fullstendig vendt forventningene om hva mediet var i stand til å levere på.

5. Metroid Prime

Utviklet av Retro Studios

Immersion of the Space Pirates.

Kicking off er spillet som virkelig solgte designere på hvor viktig grensesnittet til et spill ender med å bli til den totale spilleropplevelsen. Mer enn seksten år etter den første utgivelsen, er Metroid Prime fortsatt et høydepunkt for grensesnittdesign i spill og er en av de første vellykkede henrettelsene av en diegetisk brukergrensesnitt i et videospill, et der alle grensesnittelementene finnes direkte i spillverdenen ( i dette tilfellet projisert i perspektiv på spillerens hjelm) i motsetning til å være lagdelt på toppen av spillskjermen.

Skann og lær på farten med den nye Helmet 5000.

All spillets informasjon og systemer formidles til spilleren direkte gjennom hjelmen HUD, og ​​bryter nesten aldri ut på sin egen grensesnittskjerm. Det hadde til og med subtile motbevegelser når du snudde kameraet, og hvert enkelt grensesnittelement hadde utlignet jitterbevegelser hver gang det foregikk noen intense handlinger rundt deg, og la opp til en av de beste “screen shake” implementeringene i et videospill.

Når hjelmen din fungerer som lommespeil.

Dette solgte virkelig fordypningen i spillet, ettersom det virkelig fikk deg til å føle at du så på verden fra hjelmen. Kirsebæret på toppen var at visse lysglimt av og til lar deg se en gjenspeiling av Samus 'livredde ansikt på innsiden av hjelmen, og utnytte den strålende for følelsesmessig spenning og karakterbygging utover å bare ha hjelmen som et glassslør som fantes bare for å projisere UI-elementer på det.

Pop på Thermal Visor for å bruke et 70-talls fargepalett-tema på brukergrensesnittet.

Spillets sanne UI-flaggbærer er Scan Visor. Å skanne objekter og fiender i verden er en slags valgfri spillmekaniker som du gjør i ditt eget tempo. Spillet tvinger deg sjelden til å gjøre det. Hvis du ser noe interessant, skanner du det, og Visor HUD gjør hele utlegningen om fienden eller gjenstanden. Det fikk deg aldri til å navigere til en lore-meny begravd i grensesnittet eller lese opp på den i et bestiary. Alt skjedde på Scan Visor HUD. Dette samsvarer perfekt med karakterdesignet til Samus og spillets intensjon for verden, og får henne til å føle seg som en ekte oppdagelsesreisende som avdekker verdens mysterier ved å skanne ting rundt seg.

Røntgenviser: For de gangene du virkelig vil dobbeltsjekke negativene.

Det var en veldig tett og tilfredsstillende integrasjon mellom kontrollene og den visuelle tilbakemeldingen på brukergrensesnittet her. Det gjorde at det å samhandle med elementene i verden føles som et lite minispel i seg selv, da du alltid var på utkikk etter interessante ting i verden og ville ønske å skanne dem for å se hva Scan Visor ville gjort som svar. Det fikk deg virkelig til å føle at du hadde byrå over grensesnittet. Source Gaming har en flott artikkel om den, som ytterligere beskriver triumfene til Scan Visor HUD som spillmekaniker.

Fallout 4s gjennomskinnelige Power Armor HUD: Det er et bilpanelet, men i et massivt eksoskelett som rusler rundt i ødemarken.

Metroid Prime, som var revolusjonerende for sin tid, påvirket en hel rekke spill for å sikte mot diegetiske grensesnitt i sin verden som en fordypningsmekanisme. Du kan spore inspirasjonen til Power Armour HUD i Fallout 4 direkte tilbake til Metroid Prime, der alle de futuristiske stolpene og statusindikatorene i spillet midlertidig blir erstattet av analoge skiver nederst på skjermen, og simulerer en hjelm HUD som rister med hvert kraftig fotspor.

Metroid Prime har et av de mest minneverdige sci-fi-grensesnittene i et videospill og er fremdeles sitert av veteran-designere til i dag som katalysator for deres beslutning om å lage og bygge spill-UI-er for å leve. Ta en titt på Space Apes UI Breakdown of Metroid Prime for en grundig analyse av HUD og et glimt av hvordan spillets kunstretning spiller direkte inn i grensesnittets styrker og forbedrer effektiviteten til spillingen.

4. Assassin's Creed II

Utviklet av Ubisoft Montreal

Tilfeldige tilgangsminner: Attentatisk drepe berømte renessanseskikkelser.

Assassin's Creed-franchisen har alltid hatt et skikkelig polert brukergrensesnitt. Måten den kontrasterer fra middelalderens verdener som spilleren vanligvis løper og klatrer rundt i med den teknologisk futuristiske estetikken til Abstergo Industries, er både slående og fantastisk. Men det er ett Assassin's Creed-spill hvis grensesnitt gikk langt utover det som var nødvendig og leverte en utrolig glatt opplevelse mens du navigerte i menyene i spillet: Animus-grensesnittet til Assassin's Creed II.

Se meg virvle og vri meg: Denne DNA-strengen hadde noen virkelig kule animasjoner.

Å ta sentrum: en massiv, abstrakt DNA-streng hvis "minner" du sakte fyller ut ved å spille gjennom spillets viktigste historiehendelser. Det er en tematisk tilknytning til spillet her, der spillerpersonen fysisk rekonstruerer tidligere minner fra forfederen, derav DNA-strengen fylles ut og oppdateres når du gjør fremskritt gjennom spillet. DNA-menyen øker viktigheten av denne rekonstruksjonen ved å merke seg for turen hele veien gjennom, og visuelt oppdatere tråden med hver større endring.

Lemme spesifiserer bare lasten min i dette lurvrige brukergrensesnittet mens jeg satte meg på en benk i Venezia fra 1500-tallet.

Animus-brukergrensesnittet er ikke uten skurrende øyeblikk. Når du er helt fordypet i den middelalderske Firenze-verdenen og løper rundt på taket på Duomo og trenger å sjekke inventaret ditt før du deltar i kamp, ​​er det en rar dissonans når et futuristisk grensesnitt dukker opp for å forsterke at du egentlig ikke er der og at du bare spiller gjennom en simulering. Spillet vever dette vanligvis inn i sin verden, men til tider håndbølger det bort.

Husk Desmond, ingenting av dette er ekte.

Hver gang du samhandler med en kjøpmann eller trenger å kjøpe og oppgradere utstyr, dukker Animus UI opp igjen der du kjøper rustning fra renessansetiden i et elegant, moderne grensesnitt. Det er både kult og rart på samme tid. Det er et flott konsept, og når det gir deg bort fra den verdenen du var i for bare noen få sekunder siden, gjør det det jevnt og elegant, og prøver sitt beste for ikke å brått avbryte fordypningen i spillet.

Estetisk sett er Animus UI nydelig, og til tider føles det som et abstrakt kunstmuseum. Den er vakker, godt konstruert og føles god å bruke. Alle de gjennomskinnelige refleksjonene og rene linjene er utrolig behagelige å se på. De avslappede hierarkiene, minimalistiske fargepalettene og de subtile bakgrunnsanimasjonene gir mye teft og stil til grensesnittet. Den komplette samlingen av Animus-grensesnitt fra Assassin's Creed II er tilgjengelig for visning i Louis Augers Behance-galleri.

Når du roter med kontrollene dine er så betagende at du glemmer knappekartleggingen.

Spillet stopper ikke der. Hver undermeny og hver nestede meny på fjerde nivå gjør også noe annet eller interessant med Animus-temaet. Noen prøver å legge visuell interesse til en ellers kjedelig meny gjennom abstraksjon, og andre prøver å gjøre om utformingene av klassiske menyer for å legge til et nytt snurr på den. Det treffer virkelig ideen om at hele saken foregår i en simulering, inkludert at du tuller med HUD og kontroller av spillet.

Bare vær glad for at de ikke tvang diagonal styrebevegelse for å velge disse alternativene.

Totalt sett var Animus UI en stor hit blant spillerne, og de omfavnet den med åpne armer. Det ble så verdsatt som et ikon av Assassin's Creed-franchisen at spillerne til og med skapte tilpassede Animus-temaer for sine telefoner og stasjonære maskiner. Det påvirket absolutt andre spill å skyte etter tematiske brukergrensesnitt også i spillene sine. Animus UI utviklet seg ganske drastisk i løpet av de neste kampene i serien, men ingen stemte overens med den raffinerte elegansen og tilbakeholdenheten som Assassin's Creed II behandlet den med.

3. Skjebne

Utviklet av Bungie

Slik enkelhet! Slike konturer!

Da Destiny først ble annonsert for å være en konsoll eksklusiv, var spillerne svært skeptiske. Det viste frem dype RPG-systemer i sitt kjernespel, som vanligvis var reservert for hardcore PC-spill. Menyene for disse PC-spillene har tette grupper av valgbare objekter med vilje, fordi det er raskere å navigere gjennom dem med en musepeker. Så spørsmålet for enhver designer var hvordan Bungie muligens kunne oversette dette til en til en kontrolleroppsett rettet mot et mainstream konsollpublikum.

Mindre er mer: joystickmusa er tilbake, gutter!

Destinys løsning for interaksjonsdesign på dette problemet var den frie markøren. Ikke lenger ble du fast på et rektangulært rutenett med gjenstander som du måtte smertelig navigere gjennom en etter en. I en prisbelønt casestudie nevnte Bungie til og med at de ikke ønsket at spillere skulle slite tommelen ved å mase D-Pad for å navigere gjennom en rutenett. Den frie markøren lovet raskt valg og utheving, med kontekstuelle svevemenyer.

Det har noen pene ting som skjer under panseret, der den bremser musens akselerasjon mens du svever direkte over et brukergrensesnittelement og deretter setter det hurtig opp igjen slik at du raskt kan fremheve noe i den andre enden av skjermen uten å overdøve for raskt eller sakte å dra en markør med høy friksjon til elementet du vil velge.

Game UI 2.0: Return of fancy hover effects.

Enda bedre, det har til og med motrulling på skjermen når du beveger markøren rundt. Hvis du flytter den til venstre, beveger hele skjermen seg ned til høyre, noe som gjør det raskere å få tilgang til elementer og gjør det mulig for mer eiendom å vises på lagerbeholdningsskjermene. David Candland har en fantastisk GDC-snakk hvor han diskuterer hvordan teamet optimaliserte bevegelseshastigheten til den frie markøren for å få den til å spille bra med flyout-menyene som dukker opp, samtidig som de sikrer at motrullingen på skjermen ikke føles skurrende.

Det praktiske med denne gratis markørdesignløsningen er imponerende. I Bungies interne forskning ble følelsen og hastigheten til den frie markøren mye testet, noe som sikret at både FPS- og MMO-spillere forsto hvordan de skulle bruke den, og at den ikke ville bli tungvint etter hundre timers spill. Dette var en første på et konsollspill og Bungie spikret det totalt.

Angripe. Bare velg den som har høyest angrep.

Lagerstyring er et annet aspekt som den frie markøren håndterer godt. Igjen, dette er vanskelig i RPGs, men Destiny gjør en god jobb med å optimalisere det for en konsoll. Det er veldig liten kognitiv belastning på nedlastningsskjermene, og det meste av tett informasjon vises bare når spilleren indikerer en intensjon om å se den. Skjermoverganger til detaljvisningen av elementer er raske, slik at du kan utføre knappetrykk til muskelminne og utføre handlinger raskt i et fartsfylt flerspillermiljø.

Reach for the Light: Destiny's kartografiske stjernekart.

Den visuelle utformingen av spillet er heller ingen slouch. Bungie kunne lett gått for et sci-fi-grensesnitt med teknologisk skrå tekst, men i stedet gikk de for et blikk påvirket av ren sveitsisk typografi og gammel kartografi. Målet var å skyte for klarhet og mystikk. Dette fungerer også veldig bra, med vakre typografiske proporsjoner og store 3D-modeller som tar mesteparten av skjermplassen som forsiktig leder spillerens øyne gjennom grensesnittet. Det hele ser ut som en veldig bra sammensetning. Et galleri med utvalgte skjermer fra spillet er tilgjengelig for å se på Ryan Klaverweides Behance-side.

No Man's Sky med en rutenettbasert lagerfri markør (til venstre) og Assassin's Creed Origins berget den sporbaserte lagerfri markøren (til høyre). RIP Animus.

Mange andre konsollspill med lignende mekanikere har lagt merke til Destiny's suksess og begynner å gjenskape den frie markøren i sine grensesnitt. En flat designtrend begynner også å dukke opp der grensesnittet prøver å redusere kompleksiteten i et spills systemer ved å forenkle og hekke den visuelle visningen av disse systemene, og dermed redusere den kognitive belastningen på spilleren.

Destiny's UI endte med å bli meget anerkjent, og vant priser fra hele den interaktive designverdenen med spesiell ros rettet mot den gratis markørmekanikken og den typografiske utformingen av menyene. Mange spillere nevner brukergrensesnittet som en av de mest minneverdige og unike delene av spillet.

2. Persona 5

Utviklet av P-Studio (Atlus)

Hallo kaos, min gamle venn.

Du så den komme. Denne listen ville ikke være den samme uten den. Persona 5 har det desidert mest stilige, kaotiske, sinnssyke, over-the-top-brukergrensesnittet for å noensinne et videospill. Det oser av personlighet og visuelt opptog i hver meny, hver animasjon og hver skjermovergang. Grensesnittet er en så stor attraksjon i spillet at det holder spillerne i gang bare for å se hvordan UI for en ny spillfunksjon ser ut. Det er så bra at spillerne cosplayer menyen.

Blink og du vil savne det! Hodeskalle med den kritiske svakheten utnytter.

Hvis du ikke har spilt spillet, kan det komme ut som vilt og rotete. Men hvis du har det, vil du forstå hvorfor det er slik. Det er en veldig sterk tematisk tilknytning til spillets oversikt over menyene. En stor del av spillingen foregår i en alternativ dimensjon, der alt er en manifestasjon av de forvrengte og kronglete ønskene til en persons sinn. Menyene for å gjenspeile denne følelsen av uorden og kaos perfekt, med sin estetiske punk-vanvidd og streif over skjermen med ekstrem visuell stil og eleganse.

Bryter fangenskapene dine: Persona 5s overstyliserte, fullblodige brukergrensesnitt for maksimal påvirkning.

Spillet bryter mange designregler når det kommer til grensesnittoppsett. For eksempel bytter det stadig ut hva skulderknappene gjør, avhengig av hvilken meny du er i. Det skjer mye med karaktertilpasning-menyene, økonomi-menyene i spillet og kampmenyene. Det er viktig for et spill å innse når man skal bryte reglene, og det er enda viktigere å gjøre det riktig. Ridwans utmerkede analyse på UI / UX av Persona 5 kommer sterkt anbefalt, som oppsummerer i detalj detaljene om hvilke avveininger spillet ofte finner seg å gjøre mellom estetikk og brukervennlighet.

Ingen resept nødvendig: å ha en avslappende tid på legekontoret med stemningsbelysning.

Til tross for at de har et sett med rød og svart primærfargeskjema, bryter spillet tidvis sin egen fargepalett for virkelig å gjøre spesifikke menyer og områder av spillet skiller seg ut. Det fungerer i sin favør ganske bra og gjør at visse handlinger føles veldig unike. Uansett om du liker den generelle visuelle presentasjonen av spillet eller ikke, er det ingen som benekter at det absolutt griper oppmerksomheten og ber deg om å leke og tulle med grensesnittelementene. Jiaxin Wen har en annen flott analyse rettet mot den grafiske utformingen av spillet, og går dypt inn i farger, oppsett og JRPG-inspirasjoner.

Når menyene for å ri på t-banen ser så bra ut at du bare bruker hele dagen under jorden.

Det er vanskelig å forestille seg hvor kjedelig det må ha vært å bli gravid en UI som denne, mye mindre utvikle og lokalisere den. Selv utviklerne nevnte at de ønsket at grensesnittet skulle være et salgsargument for spillet. Det er ikke uvanlig å finne deg selv stirre på en meny i fem hele minutter, og telle antall typografiske stiler som blir brukt på skjermen, og være i ærefrykt over hvordan de klarte det, slik at det hele fungerte. Det er virkelig imponerende hvordan spillet opprettholder praktisk gjennom noen seksti eller så unike menyer uten å ofre stilen.

1. Dead Space

Utviklet av Visceral Games

Kom igjen og modifiser våpenet ditt på dette skumle forlatte romskipet! Vi har et WYSIWYG-grensesnitt.

Dead Space er et eksempel på plakatbarnets flaggskip om hvordan en diegetisk brukergrensesnitt virkelig kan utnytte kraften til spillmediet. Det henter inspirasjon fra Metroid Prime HUD og trekker ut brukergrensesnittet ut av hjelmen direkte inn i spillmiljøet. Brukergrensesnittelementer sitter ikke lenger fast på hjørnene av skjermen, men lever i stedet i verden rundt deg. Å spille Dead Space var øyeblikket da spillerne virkelig forsto hvordan et grensesnitt ikke bare kan spille inn i den atmosfæriske fordypningen av et spill, men heve det til nye høyder.

Sup Necromorph: Følg med på batterilevetiden din med en nyttig statusindikator på ryggen.

I Dead Space vises spillerens helse og stase direkte på selve karaktermodellen, med de neonblå stolpene på ryggraden som viser helse og halvsirkelen til høyre som representerer nivået av stasen. Siden spillermodellens rygg alltid vender mot kameraet, ser øynene alltid på den. Spillet bruker en mørk / nøytral fargepalett for alt annet i verden, og med litt hjelp fra smart belysning, sikrer det at disse stolpene skiller seg ut uansett hvilket miljø du kryper gjennom i spillet.

Når brukergrensesnittet for minoritetsrapporter faktisk fungerer.

Nesten hver meny i spillet er en holografisk pop-up-skjerm som vi har sett så mange "fantasy" -versjoner av i sci-fi-filmer, men i dette tilfellet kan den faktisk brukes. Du kan panorere rundt den og zoome inn i den, og dens dybde og parallaks selger virkelig 3D-følelsen. Spillermodellens hode og hender samhandler og reagerer veldig troverdig med de flytende brukergrensesnittelementene.

Den geniale delen om dette er at den aldri setter pauser i spill. Samspillet ditt med brukergrensesnittet er i sanntid. I et sci-fi-isolasjonsskrekkspill som Dead Space som stoler så tungt på øyeblikket til øyeblikk spenning som er skapt av sin foruroligende atmosfære, fungerer dette direkte i spillets favør. Det omgivende spøkelsesaktige lydsporet fortsetter å spille i bakgrunnen, og de uhyggelige miljøeffektene fortsetter å virvle rundt deg, slik at du føler at du aldri er trygg. Dette tar fordypningen i spillet til et helt nytt nivå.

Modding dressen din i mørk mørke, hva kan muligens gå galt?

Selv om brukergrensesnittet i Dead Space kanskje ikke er så visuelt imponerende som løperne på denne listen, er det den tette integrasjonen i spillet som gjør at det fungerer så bra. Studioet planla det på denne måten helt fra begynnelsen og fikk hvert spillelement til å fungere i forbindelse med det. I et intervju nevnte designerne til og med at intensjonen var å opprettholde spenningen og spenningen ved spill i alle aspekter av spillet, inkludert interaksjon med menyer.

Gå for den kritiske veien: Oppgradering av våpen i det holografiske brukergrensesnittet.

I en utviklerdagbok nevnte UI Design Leads til og med at de ønsket at grensesnittet skulle føles som om de var der for Isaac (spillerkarakteren) å samhandle med, ikke bare at det eksisterer i separate skjermbilder for å tjene et bestemt spesifikt spillformål. Det trengs for å være fornuftig i sammenheng med spillet.

På slutten av dagen er det ikke UI-en, men i stedet hvor godt grensesnittet smelter sammen med spillets tone ved å utfylle atmosfæren og følelsen av sin verden som får Dead Space til å sitte komfortabelt på topplassen på denne listen . Dette er hva hvert spillgrensesnitt skal strebe etter å gjøre, og Dead Space satte linjen så høyt at det har vært tøft å matche det siden den gang.

Den virkelige grunnen til at du ikke kan dobbeltutvikle våpen i Far Cry 2.

Du trenger ikke å være et sci-fi-spill som Dead Space eller Metroid Prime for å trekke fra deg en dygetisk brukergrensesnitt. Spesielt implementerte Far Cry 2 en versjon av den veldig bra, der kartet og kompasset i spillet er faktiske 3D-spillmodeller som spilleren trekker frem til referanse gjentatte ganger. Watch Dogs klarte også å trekke av et stilig, semi-diegetisk overlegg UI med suksess med ctOS-grensesnittet.

For å lære mer om hvordan UI of Dead Space kom sammen, sjekk ut denne fantastiske GDC-praten av Dino Ignacio om arbeidet som er involvert i å konseptualisere det og hvordan det utviklet seg over tid til den versjonen som fulgte med spillet. Det er ingen som benekter at virkningen Dead Space har hatt på spillene som fulgte etter det, og det kommer til å bli en interessant dag når et bedre integrert diegetisk grensesnitt endelig velter det fra topplassen på denne listen.

God design er usynlig

De mest åpenbare utfordrerne for de beste spillgrensesnittene er de som er mest visuelt slående - som Assassin's Creed II og Persona 5. Så er det Destiny som tilfører et unikt samspill som gjør navigering i menyene så lekne og intuitive at du glemmer at den til og med eksisterer etter noen timer. Og til slutt er det spill med diegetiske grensesnitt som Metroid Prime og Dead Space som integrerer brukergrensesnittet i spillet så godt at du ikke en gang tenker på det som et eget element i spillet. Det hele smelter sammen sømløst.

Resident Evil 4 populariserte ”visual grid” -beholdningssystemet (til venstre) der bedre elementer tar mer plass, og tvinger spillerne til å gjøre noe mental tetrisoptimalisering i hodet. Organisering av varelageret ditt ble til en minispel i seg selv. Prey gjør det samme med et moderne snurr på det (til høyre).

Utover de som er nevnt over, er det et utrolig vell av spill der ute som gjør noen virkelig ut-av-denne-verden ting i sine grensesnitt. Mange av de fascinerende er enestående i en spesifikk skjerm eller interaksjon i spillets menyer. YouTuber Design Doc har en flott samlingsvideo-serie som oppsummerer de fleste av dem (sammen med eksempler på dårlig grensesnittdesign i spill). Over tid har spill-UI-designere avskrevet hverandres ideer fra forskjellige spill og har forbedret dem, noe som resulterer i bedre og mer raffinerte grensesnitt som vi ser i moderne spill.

Beyond Good and Evils tastaturinngangshjul (til venstre) forsøkte å lette friksjonen av tastaturtekstinnganger med en massiv alfabetspiral som du snurrer gjennom. Preys favoritthjul (til høyre) gjør det samme når du begynner å skaffe deg for mange våpen og krefter, og skalere uendelig inn på skjermen.

Grensesnittdesign i spill er et under-verdsatt aspekt av mediet generelt, og spillene på denne listen fungerer som et vitnesbyrd om deres makt når de kjøres riktig. Noen av dem har gode HUD-er, noen har fantastiske menyer, og noen er rett og slett herlige å bruke. Du kan gå bredt og integrere et konsistent grensesnitt over hele spillet eller gå dypt inn i en spesifikk interaksjonsmodell og finpusse den til perfeksjon. Uansett, et gjennomtenkt implementert grensesnitt tjener bare til å øke følelsen av fordypning og engasjement som spillerne føler i sitt forhold til spillet, og det er akkurat det vi alle prøver å skyte etter på slutten av dagen.