Share
Hvor lett er det for spilleren å sette sin hensikt til handling, eller for å forstå hva som skjer i spillet ditt? I denne opplæringen lærer du hvordan du bygger et bedre spill-brukergrensesnitt ved å undersøke både gode og dårlige eksempler fra eksisterende spill, og ende opp med en sjekkliste med spørsmål som veileder deg gjennom å designe dem.
Forresten, hvis du leter etter et sted å komme i gang, kan du finne en mengde veldesignede spillverdier på Envato Elements.
Spillverdier på Envato Elements Som spillere og spillutviklere vet vi at nedsenking er alt. Når du er nedsenket, mister du tid og blir involvert i hva spillet presenterer. En viktig faktor i hva som gjør eller ødelegger nedsenking er hvor enkelt det er for spilleren å konvertere en ide til en in-game handling - det vil si hvor flytende spillets User Experience (UX) er og hvor godt utformet brukergrensesnittet (Brukergrensesnitt) er. Et spill gjør vondt ved å gi for lite informasjon eller for mye, som krever for mange innganger, forvirrer spilleren med unhelpful prompts eller gjør det vanskelig for en ny spiller å samhandle. Dårlig UI-design kan til og med bryte spillet ditt helt.
I denne artikkelen vil jeg ikke lære deg hvordan du skal sette et brukergrensesnitt sammen. I stedet vil jeg fokusere på hva som gjør et brukergrensesnitt veldesignet eller dårlig utformet, og hvordan du kan bruke denne tenkningen til ditt eget spill. Jeg skal undersøke UI og UX-design som en rekke mål som er like viktige og så presise som alle andre deler av spillet ditt, ved hjelp av eksempler fra spill som gjør det galt og spill som gjør det riktig.
Vilkårene UI og UX er noen ganger (feil) brukt utveksling, men de har spesifikke betydninger.
Brukergrensesnitt eller Brukergrensesnitt, refererer til metodene (tastaturstyring, musekontroll) og grensesnitt (oppføringsskjerm, kartskjerm) som en bruker samhandler med spillet ditt med. UX eller Brukererfaring, refererer til hvor intuitive og morsomme de interaksjonene er.
For å se på det på en annen måte: Bilens brukergrensesnitt er rattet, pedalene, rattene og kontrollene på dashbordet; Bilens UX kommer fra immaterielle komponenter som bremsepedalen er lydhør, motoren jevnt akselererer når du går på gassen, girstaven har bare Den riktige mengden motstand - de tingene som gjør bilen morsom å kjøre.
Enkelt sagt, rollen som et godt brukergrensesnitt er å gi relevant informasjon tydelig og raskt, og for å komme seg ut av veien når den har gjort jobben sin. Hvis du bare tar en bit av informasjon fra denne opplæringen, la dette være det:
En god brukergrensesnitt forteller deg hva du trenger å vite, og blir så ut av veien.
Vi kan gå videre og koble prosessen med UI-design til seks grunnleggende spørsmål:
Spør disse spørsmålene ofte når du designer og spiller spillet ditt. UI-designens verden er en verden av endeløs nitpicking, og det er et av de få områdene i spillutvikling hvor det er greit å besatt.
Et godt eksempel er Fallout 3's Pipboy - eller mer spesifikt den korte animasjonen av din karakter som hever Pipboy til øynivå når du får tilgang til det:
Animasjonen varer bare et halvt sekund, så du kan ikke sette mye på det. Men se hvordan det utfordrer tålmodigheten til spillerne dine etter å ha satt gjennom det utallige ganger i løpet av et 80-timers spill. Ikke konkluder at spilleren din vil "bli vant til" å gjøre noe på en ikke-optimal måte. De vil bare seet og dårlig munn din mangel på designfølelse.
Jeg tror at den enkleste måten å lære UI-design er å lage nettsteder. Utrolige ressurser som Jakob Nielsens Alertbox eksisterer for å gi deg så mye informasjon som du vil om hva som egentlig gjør et brukergrensesnitt enkelt å bruke, hvordan folk interagerer med programvare og så videre.
Redaktørens merknad: Og det er alltid vår søsterside Webdesigntuts + ...
I sentrum av det som gjør et bra brukergrensesnitt er brukervennlighet, et attributt som inkorporerer svarene på de seks grunnleggende spørsmålene som er nevnt tidligere. Det er mye mer å si om brukervennlighet og gjør grensesnittet ditt brukbart, og jeg lar deg overta det boks på skjermen og finn de delene som er relevante for din erfaring.
Mange programmerere er redd for å gjøre brukergrensesnitt fordi de føler at dette er en kreativ jobb, en bedre igjen til noen som en kunstner som har en bedre forståelse av presentasjonen. Og likevel UI-design er en stort sett logisk prosess, en som er perfekt tilnærmet til en utvikler.
Faktisk tror jeg at programmøren (eller kreativ direktør eller den som har den mest direkte rolle i utformingen av spillopplevelsen til spillet ditt) burde være ansvarlig for å lage brukergrensesnittet, da de er de som kjenner spillet inne og ut, og hvem vet hvilken informasjon som er viktig og hva som er tilfeldig.
De bør fokusere på de funksjonelle aspektene av brukergrensesnittet: Hvor stort er det, gjør det (eller skal det) bla, hvilken informasjon som vises og hvor og hvordan spilleren navigerer gjennom den. Mock den opp med to eller tre farger, og stol aldri på fargeendringer alene for å formidle informasjon. Kjør i det minste gjennom ColorOracle eller Coblis for å sikre at fargeblindene ikke går glipp av.
Før jeg kommer inn i dette, er det viktig å forstå at når jeg snakker om dårlige brukergrensesnitt, gjør jeg den dommen basert på ideer og oppførsel som jeg tar med til det som en PC-spiller som spiller spill med tastatur og mus.
Brukerens valg av input er svært relevant for brukeropplevelsen, selv om det ikke er hele historien. Noen som er vant til et berøringsgrensesnitt, vil finne en knappgrensesnitt vanskelig, for eksempel, men et godt designet knappegrensesnitt vil fortsatt være lett å forstå og forutse.
Oblivion's brukergrensesnitt er et klassisk eksempel på at en plattforms brukergrensesnitt er uforenlig med en annen. Selv om Oblivion ble portet fra konsoller til PC, beholdt den fortsatt sin kontrolleringsfokuserte brukergrensesnitt. Dette er helt analogt med å slippe et spill på iOS eller Android, og gjør spilleren flytte en skjermmarkør rundt som de bruker en bærbar styreflate i stedet for å utnytte absolutt berøringsposisjonering.
Så hva gjør Oblivion's brukergrensesnitt så ille? Det er en kombinasjon av bortkastet plass, feilaktig skalering og upassende kontroller.
Jeg håper du er kul med å se seks elementer om gangen; disse vinduene er ikke justerbare. Den faktiske delen av menyen som formidler den relevante informasjonen, for eksempel innholdet i beholdningen, bruker bare 21,7% av det totale skjermområdet ved en oppløsning på 1920x1080.
Å bruke bare en femtedel av en skjerm er ikke så ille: du kan gjøre mye på så mye plass. Det virkelige problemet er at skrifttypen og ikonene er dobbelt så stor som de trenger for visning på en PC-skjerm, og dette begrenser i stor grad antall gjenstander som kan vises.
En lineær listevisning betyr også at du pleier å gjøre mye rulling, og det flippede grensesnittet skjuler alt fra deg. Når du kontrollerer statuseffekter, kan du klikke på fanen Magic, gå til underfanen Effekter og deretter bla gjennom listen. Det er en ting å skjule sjelden brukt informasjon som karakterstatistikk bak faner, men helt annerledes enn å skjule viktig informasjon som for eksempel drenering av helsen din mens du går rundt.
Oblivion mangler også snarveier. Det er ingen Kart-knapp for å hente kartet; du må klikke på kompasset for å få opp kartfanen. Det er ingen hurtig-selg-nøkkel eller selg stabel snarvei; du må arbeide med glidebryteren med musen og bekrefte den ved å klikke eller trykke på Enter. Det er ingen standardknapp for å komme ut av et vindu (Escape i de fleste spill), slik at spennende forskjellige vinduer gjøres ved å trykke enten E, Tab, Escape eller en annen tast.
Oppfølgeren, Skyrim, ville fortsette å fikse noen av disse problemene, men noen ville forbli eller bli verre. Jeg ble faktisk fast den første gangen jeg åpnet et bryst i Skyrim: Escape kom meg ikke ut av vinduet; lager nøkkelen fikk meg ikke ut; prøvde å bruke brystet igjen fikk meg ikke ut. Det var ingen knapp du kunne klikke for å avslutte eller spørre som fortalte deg hva du skulle gjøre. Å klikke utenfor vinduet fungerte ikke. Gjett hvilken nøkkel endelig la meg gå ut av brystet? Sheathe / Ready Weapon, selvfølgelig.
Far Cry 3s menyer er veldig vanskelig for en PC-bruker. Noen ganger svarer det ikke på klikk, så du må klikke tre ganger; menyer kan ta litt tid å laste; det er ikke veldig plass-effektivt - du vet avtale nå.
Det var patched, så jeg skal fokusere på tilstanden til sin HUD-spill når den først ble utgitt. La oss begynne med en titt på HUD i sin forgjenger, Far Cry 2.
Dette er hva du ser mesteparten av tiden. Ting som helseindikatorer og ammunisjonstall falmer inn og ut når du trenger dem, men generelt forlater HUD deg alene.
La oss nå se på Far Cry 3s HUD.
Far Cry 3s HUD ikke la deg være i fred. Jeg har det vanskelig å vise det i skjermbilder eller videoer; Det er bare noe du opplever som en spiller som fortsetter å rykke tilbake til virkeligheten. Det skaper en klaustrofobisk følelse.
Minimalapet er stort og ugjennomsiktig, så det kommer i veien. Målet påminnelsen øverst til venstre er også stor og ugjennomsiktig og kommer i veien, og selv om den forsvinner etter noen sekunder, har den en tendens til å dukke opp igjen akkurat som du skal begynne å glemme at du spiller et spill. Når du blir skutt, vises trekkindikatorene nær midten av skjermen, hvor de igjen kommer i vei, i stedet for å dukke opp på skjermens svært kanter som i alle andre spill. Hvis du samler nok tilberedende ingredienser, vises en annen stor, ugjennomsiktig popup til høyre for å fortelle deg at du kan lage noe nytt.
Hver gang en av disse popupene vises, slår spilleren ut av det morsomme de hadde og minner dem om at de bruker programvare. Overforsyningen av åpenbare opplysninger gjør at det føles som om spillet ikke stoler på at spilleren er kompetent. Patchen lar deg slå av det verste av disse HUD-funksjonene, men minimaporten er fortsatt der, og menyene er fremdeles ubehagelige for mus og tastaturinteraksjon.
Men la oss ikke bruke hele denne tiden på å snakke om dårlige brukergrensesnitt. Gode eksempler på brukergrensesnitt kommer fra spill som anerkjenner begrensningene og styrken i deres systemer.
De fleste PC-spillere er enige om at Morrowind (Oblivion's forgjenger) har en av de beste PC-brukergrensesnittene rundt - unntatt et problem som jeg snakker om nedenfor.
La oss gå over de grunnleggende elementene i denne skjermen.
Hva betyr dette brukergrensesnittet for PC-spilleren? Nesten alt er bokstavelig ett klikk unna. Hvis du vil se på dine ferdigheter, ruller du på tegnvinduet. Hvis du vil utstyre noe, drar du det på papirdocken din. Grensesnittet er raskt og tilgjengelig, og nesten alle typer gjenstander i verden har et unikt lagerikon, så det å finne din Journeyman Hammer innebærer et halvt sekund å se på ditt ryddige, skalerbare lager.
Den eneste detalj som lar denne brukergrensesnittet ned er det faktum at potions og scrolls gjenbruk inventory ikoner; Det er unike ikoner for potionens kvalitet, men ikke for dens effekt, så en Master Water Pustende potion ser ut som en Master Restore Fatigue potion.
Tekstinngang med en kontroller er ubeleilig i beste fall, og smertefullt i verste fall. Du kan ikke flytte fingrene dine direkte til en nøkkel, du må trykke på knappen din og opprette mange unødvendige bevegelser og handlinger..
Utover godt og ondt sidestepped alt dette ved å implementere det som er vanlig akseptert som den beste konsollen tekstinnskudd noensinne: Et uendelig bånd med bokstaver og tall ordnet på det i rekkefølge. Båndet ruller raskt og uten forsinkelse, det gir konstant lydhøy tilbakemelding, og det er lydhør overfor justeringer. Det er et mysterium hvorfor andre spill ikke har fulgt sitt eksempel.
Vel, jeg har vært litt urettferdig. Andre tastaturinnstillinger for tastaturinnstillinger gir deg mulighet til å holde nede en retning og bla gjennom alle tastene i rekkefølge, men de har ofte en forsinkelse før de begynner å rulle med full hastighet, eller de ruller ikke raskt nok. (Husk det grunnleggende spørsmålet, "Trenger jeg noensinne å vente på grensesnittet for å laste inn eller spille en animasjon?")
Homeworld brøt bakken i 1999 for å være den første RTS med ekte tredimensjonal bevegelse. Å kunne flytte enheter langs tre akser var en ny designutfordring, og Homeworld ble absolutt levert med stil og eleganse. Problemet: Hvordan representerer 3D-bevegelse på et 2D-plan (skjermen din).
Løsningen: For det første, håndtere det tradisjonelle horisontale flyet som spillerne er vant til.
Deretter håndtere det ekstra vertikale flyet.
Bevegelsesskjermbildet gir også spilleren noen subtile, men kraftige verktøy:
Korsfarer Kings 2 er det slags komplisert, flerlags spill som gjør at du føler deg dum. Men grensesnittet gjør sitt beste for å hjelpe deg gjennom det hele. For det første er det mange hjelpebokser som dukker opp til du er komfortabel nok med den delen av spillet for å fortelle det å stoppe. For det andre er det denne fantastiske funksjonen. Si at jeg vil vite hva et ikon for mynter representerer; Jeg holder bare over det og BAM!
En vill verktøytips dukket opp! Spillet forteller meg hva jeg skal ringe på myntikonet, gir meg informasjonen som er relevant for det, og forteller meg selv hvordan den informasjonen er organisert. Du kan gjøre dette med noe annet element i spillet, og verktøylippen vises raskt slik at jeg ikke må vente.
Du kan se på dette og si, "Duh, verktøytips har eksistert for alltid. Selvfølgelig skal man sprette ut når jeg svinger over noe." Bare husk det, som det er lett å glemme.
Et sted hvor det er spesielt enkelt å glemme verktøytips, er i spillets front-vendte menyer. Her er Vsync-verktøytipset i A Valley Without Winds Alternativer-meny.
Her er Vsync-verktøytipset i Half Life 2: Episode 2Alternativer-menyen.
Egentlig hjelpsom. De fleste PC-spillere som vandrer inn i de avanserte grafikkalternativene, vet hva VSync er, men å plassere et verktøytips er bare høflig - bare så lenge det er et nyttig verktøytips og ikke en som leser, "Slår VSync på eller av."
Civ 5s skjermbilde er et godt eksempel på å gjøre informasjon tilgjengelig raskt.
Denne single screen forteller deg: den økonomiske og kulturelle tilstanden til hele ditt imperium; Produksjonen av denne byen, inkludert befolkningsvekst (og grensevekst hvis byggelisten er kollapset); enhetene og bygningene som er tilgjengelige for denne byen og hvor lang tid det tar å bygge dem utbredelsen av byen din, samt ressursfliser i den og hvilke fliser borgere jobber for tiden; bygningene som allerede er bygd i den, og et sammenbrudd av Citizen Management-panelet, hvor du kan bytte til forskjellige arbeidstildelingsprofiler for å spesialisere denne byens utgang.
Du kan også flytte arbeidere mellom fliser rett på kartet over byen, og sette hele dette skjermområdet til god bruk.
La oss omarbeide de seks grunnleggende spørsmålene til brukergrensesnittdesign som seks generelle retningslinjer:
UI-design er en logisk jobb som du ikke bør være redd for å gjøre. Vær oppmerksom på spillene du spiller, legg merke til hvordan de presenterer informasjon og hvordan det får deg til å føle. Legg merke til ting du gjør repeterende, og hvordan de kan forbedres. Se etter informasjon som bare fungerer som dekorasjon, og se hva du vil erstatte med. Vær oppmerksom på ting som forvirrer deg. Og til slutt, har alltid noen folk spilltest ditt spill foran deg. Fortell dem hvordan du kjører spillet, så se stille og motstå trang til å veilede dem. Det er ganske ydmyk.
Accentsconagua