UI e UX Design

L'interfaccia utente (UX) combina il design visivo artistico con il design dell'informazione centrato sulla comunicazione per produrre menu, layout del Gioco, schermi a testa (HUD) e altre interfacce con cui i giocatori interagiscono. L'esperienza utente (

Interfaccia utente

L'interfaccia utente condivide informazioni vitali come punti di colpo, obiettivi di missione e prezzi che consentono ai giocatori di prendere esperienzae navigare nel Gioco. Poiché è spesso il modo principale in cui i giochi comunicano con il Giocatore, l'interfaccia utente è critica per i giocatori e può lasciare i giocatori confusi e frustrati e portare a una bassa retention, mentre l'interfaccia utente progettata con successo può contribuire all'engagement e Monetizzazione

• Prioritazione
• Attenzione
• Lingua visiva
• Convenzioni
• Consistenza

Prioritazione

Condividere le informazioni più significative prima è conosciuto come la gerarchia delle informazioni . Questo è particolarmente cruciale nei giochi in cui i giocatori prendono decisioni istantanee in base a un set limitato di informazioni. Quando prioritizzare l'interfaccia utente, identificare ciò che è essenziale o più rilevante per l'esperienza del Giocatoree assicurarsi che sia accessibile e facile da localizzare. Considere queste domande:

• Cosa sta facendo il giocatore in questo momento?
• Qual è la cosa più importante di cui dovrebbero essere a conoscenza, o a cui dovrebbero avere accesso?
• Quali scelte hanno a disposizione?
• Quale informazione hanno bisogno per poter fare queste scelte?
• Quante volte si impegneranno in queste scelte?

Le informazioni e le funzionalità cambiano nel corso di un Gioco, a seconda di fattori come il ruolo che il giocatore svolge, la loro posizione nel Mondodi gioco e gli oggetti che contengono. L'interfaccia utente può essere progettata per presentare solo ciò che importa contestualmente - scambiare i pulsanti e le informazioni a seconda di ciò che è utile in ogni contesto. Ciò garantisce che i giocatori abbiano sempre ciò di cui hanno bisogno, senza il disordine di tutto ci

Esempi

Gli elementi irrilevanti possono causare confusione e distrazione. RPG di legame magico ha un'interfaccia utente pulita e minimalista che è particolarmente cruciale per le interfacce mobili, poiché le piccole schermate possono facilmente essere sopraffatte con bottoni, schermi e testo eccessivi.

In Super Striker League , le interazioni del giocatore variano a seconda di se controlla la palla. Senza la palla, i giocatori possono Correre e Affrontare per riottenerne il controllo. Una volta in possesso, i pulsanti passano a Deke e Pass, consentendo ai giocatori di schivare gli avversari e passare la palla. Facendo clic su questi pulsanti, l'interfaccia utente rimane contestualmente utile, evitando

pulsanti contestuali in Super Striker League ]]

pulsanti contestuali in Super Striker League ]]

In The Survival Game, i giocatori devono essere consapevoli del loro Statodi salute e fame, e hanno un accesso rapido alla loro mappa, Inventario, reportorioe strumenti. Questa informazione consente loro di prendere decisioni e prioritare azioni per la sopravvivenza. Se questa informazione o gli strumenti sono difficili da trovare o mancanti, la sopravvivenza diventa più impegnativa e frustrante.

Attenzione

Nonostante un'interfaccia utente minimalista, prioritaria e contextualizzata, i giocatori potrebbero comunque aver bisogno di assistenza per localizzare ciò di cui hanno bisogno. I progettisti UI possono utilizzare diversi strumenti visivi per catturare e guidare l'attenzione dei giocatori, tra cui:

• Colore: I colori chiari catturano l'attenzione più di quelli spenti. Usa tonalità vibranti per il testo cruciale, pulsanti e altri elementi, e tonalità mutate per colori meno importanti. Questo aumenta la visibilità e riduce la distrazione.
• Dimensione: I più grandi elementi sono più visibili e percepiti come importanti rispetto a quelli più piccoli.
• Spazio: Gli elementi circondati da ampio spazio negativo o spugna sono attraenti agli occhi.
• Prossimità: Gli elementi grouped implicano una connessione. Posizionando elementi e oggetti correlati l'un l'altro, i giocatori possono capire la loro associazione e localizzarli più facilmente.
• Movimento: Gli elementi animati catturano l'attenzione. Anche la minima variazione può fare risaltare un elemento tra le controparti statiche. Gli effetti di parti, le mosse di spostamento e le frecce animate vengono spesso utilizzati nei tutorial per la guida.

La moderazione è la chiave con questi strumenti. L'uso eccessivo di elementi lampeggianti e in movimento può sopraffare e confondere i giocatori invece di aiutarli.

Esempi

Nella stagione pass Jailbreak la sua interfaccia utente, una striscia di giallo dorato sotto gli icon di esclusiva della stagione, attirando l'attenzione sulle ricompense premium e rendendole visivamente distinte dalle gratuite.

In Dragon Adventures, la priorità visiva viene assegnata al più grande pacchetto di monete aumentandone la dimensione e separandolo con più spazio, per distinguere le più piccole raccolte.

In Tower Defense Simulator , entrambe la dimensione e la vicinanza sono utilizzate per raggruppare e distinguere le skin della torre giornaliere dalle casse giornaliere.

Lingua visiva

Oltre a guidare l'attenzione dei giocatori sui più importanti elementi sullo schermo, i designer UI sviluppano una lingua visiva per aiutare i giocatori a capire ciò che stanno vedendo. Una lingua visiva è un insieme di scelte di design deliberate e coerenti che forniscono informazioni in un'unica visuale su scopo, Stato, associazioni e rilevanza. Il linguaggio viene costruito da strumenti come forma, colore e stile. Alcuni degli usi per la lingua visiva includono:

Icons.

Gli icon possono impiegare un'identità visiva che trasmette il significato e le associazioni. Ad esempio, gli icon relativi a statistiche specifiche possono condividere una palette di colori e forme simili, consentendo ai giocatori di riconoscere e capire la loro funzione.

Pulsanti

Come forma prevalente di input del giocatore, i pulsanti devono essere facili da identificare. L'alloggiamento dei pulsanti in un container, come un colore che circonda il testo o l'Icona, li distingue dal background, rendendoli visibili. L'aggiungere di luci o ombre può migliorare il loro appeal tattile suggerendo la profondità 3D.

Testo

I titoli e gli intestati contenenti informazioni di alto livello dovrebbero essere più grandi e più grande del testo del corpo. I colori che sono altamente leggibili e si adattano bene al colore di sfondo dovrebbero essere considerati. Le scelte stilistiche come il colore e l'ombreggiatura possono sottolineare informazioni importanti come oggetti di gioco, statistiche o abilità. Sempre privilegiare la leggibilità quando si sceglie un carattere.

Una volta che il linguaggio visivo è stato progettato, può essere documentato in un Guida Stile, un insieme di regole e esempi che aiuta tutti nel team a capire come applicare il linguaggio in modo coerente in tutto il Gioco.

Convenzioni

Le convenzioni sono scelte di design comunemente applicate che sono viste in molti giochi diversi. Alcuni esempi includono:

• Un simbolo X su un pulsante che chiude la finestra di dialogo quando viene premuto
• Il colore grigio applicato ai pulsanti che sono attualmente non utilizzabili
• Un'icona di blocco che sovrappone un pulsante o una funzione per indicare che il giocatore non l'ha ancora guadagnato o non l'ha ancora sbloccato

Data la loro ampia diffusione, i giocatori sono tipicamente a conoscenza di tali convenzioni. L'utilizzo di questa familiarità può rendere un'interfaccia più intuitiva e ridurre la necessità di istruzioni specifiche del gioco. Il giocare a giochi all'interno del tuo genere di destinazione può aiutare ad identificare le convenzioni che i giocatori possono riconoscere. Un designer UI può optare per un approccio unico per adattare meglio il loro processo decisionale, ma conoscere queste convenzioni inform

2> DOORS2>

Consistenza

Qualunque sia la decisione che un designer UI prende, dovrebbe applicarli coerentemente in tutto il Gioco. La coerenza aiuta i giocatori a navigare nel gioco in modo più efficiente e previene confusione e frustrazione.

Ecco alcuni esempi di coerenza UI in un Gioco:

• La statistica "Salute" appare in verde in tutto il testo, le icone correlate e la barra di salute.
• Qualsiasi volta che il dialogo NPC menziona un Articoloin gioco, viene evidenziato in grassetto.
• I pulsanti di chiusura sono sempre quadrati, rossi e contengono un X bianco, che appare solo nell'angolo in alto a destra di un dialogo.
• Quando un giocatore non può permettersi un oggetto nel Negozio, il prezzo viene visualizzato in rosso.

Queste scelte sono deliberate, mirando a facilitare la comprensione e la navigazione del giocatore. Applicandole coerentemente, i giocatori possono associare elementi correlati, identificare oggetti importanti, sviluppare la memoria muscolare, prendere decisioni informate rapide e passare più tempo immersi nel Gioco.

UX

Il design UX si riferisce a come i giocatori interagiscono con il Gioco, come fanno le loro scelte conosciute al Giocoe come si muovono da una scelta all'altra. Anche se UX di solito funziona a fianco dell'interfaccia utente (UI), è più concentrato sull'interattività e sull'esperienza del giocatore rispetto al design visivo e informativo dell'UI.

Capire i giocatori

Un obiettivo primario del designer UX è creare interazioni e flussi che sono intuitivi, non invadenti e convenienti per i giocatori da utilizzare. Questo processo inizia con una comprensione dei giocatori stessi, del pubblico inteso per un Gioco. Quando si identificano i giocatori di un'esperienza, considera i Seguendo:

• Demografia: La demografia aiuta a informare le scelte di progettazione rivelando informazioni generalizzate su un Gruppodi giocatori. Ad esempio, i giocatori più giovani sono generalmente più probabili di giocare su dispositivi mobili o tablet in quanto le giochi intesi per quell'audience di solito priorizzano la progettazione e la pulizia dell'esperienza utente mobile.

• Livello di esperienza: Gli sviluppatori possono scegliere di progettare per i giocatori con poca esperienza di gioco, una quantità significativa o qualcosa di intermedio. Le interazioni che sono familiari ai giocatori esperti, come toccare una chiave di numero per equipaggiare un oggetto in una barra degli strumenti o premere c per crouch, possono non essere chiare per i giocatori inesperti e richiedono un messaggio aggiuntivo o un'istruzione.

• Familiarità con il genere: La familiarità con il genere riflette il livello di esperienza del giocatore con un tipo specifico di Gioco. I giochi che cadono in generi popolari su Roblox, come Roleplay, Survival Horror e First-Person Shooter, probabilmente hanno molti potenziali giocatori che hanno giocato a un livello di esperienza simile prima. I giochi in altri generi possono avere meno giocatori esperti,

• Stile di gioco: I giocatori di solito preferiscono uno stile di Giocarespecifico, che va dalla competizione e dalla raccolta di obiettivi all'esplorazione e alla cooperazione. Questi preferiti non sono solo riflessi nelle meccaniche di gioco preferite dai giocatori, ma influenzano anche le decisioni UX. I progettisti considerano quali interazioni priorizzare, quali pulire e quali presentare ai giocatori. Tengono anche conto della menteset

Dopo aver considerato questi fattori e selezionato un gruppo di giocatori target (o gruppi), conoscerli incontrandoli, giocando con loro e imparando le loro preferenze per informare meglio le scelte di progettazione.

Progettazione delle interazioni

Le interazioni sono funzionalità che consentono ai giocatori di sperimentare e comunicare le loro scelte in un Gioco. I progettisti UX vogliono che queste interazioni siano intuitive e richiedano il meno possibile di spiegazione. Per far questo, utilizzano:

• Convenzioni
• Metofori
• Commenti

Convenzioni

Le convenzioni sono progetti UX e principi che i giocatori potrebbero già essere a conoscenza di altri giochi.

Esempi di convenzioni includono:

• L'invito di vicinanza "E" che gli sviluppatori Roblox utilizzano per segnalare ai giocatori che un oggetto è interattabile se si trova abbastanza vicino per apparire.
• La chiave "C" consente all'avatar del Giocatoredi accovacciarsi in modo che possano piazzarsi sotto gli ostacoli o adattarsi a spazi stretti.
• Numero di chiavi che equipaggiano gli oggetti da una barra degli strumenti nella mano dell'Avatarin modo che possano essere utilizzati.
• Camminare in cerchi sul pavimento per entrare in una coda per una Corrisponde.

Le convenzioni diventano stabilite quando una particolare scelta di implementazione o design cresce in popolarità a causa della sua facilità d'uso. "C" per crouch, ad esempio, è facile da ricordare in quanto è la prima lettera della parola crouch, e è convenientemente situato accanto a WASD, le chiavi che i giocatori usano per Barra di navigazione. È un'interazione rapida e sottopresso, il che è ideale dal momento che l'intento di

Metofore

Metaphors riferiscono un concetto astratto a uno più familiare, creando una scorciatoia per la comprensione. In questo esempio da Spellbound Wizard RPG, l'attività di lancio dei maghi viene eseguita facendo clic su le carte da una baraja. L'interfaccia utente / l'interfaccia utente basata sul deck crea l'attività di lancio dei maghi, che non ha un'

Feedback

La comunicazione dal gioco al giocatore è conosciuta come feedback . Il feedback aiuta i giocatori a capire che un'azione che hanno preso ha avuto un effetto nel Gioco. Può contribuire all'apprendimento di come il gioco funziona e aggiungere uno strato extra di polacco che rende più soddisfacente l'utilizzo di una funzione. Alcuni esempi di feedback includono:

• Un nemico che gioca la sua animazione di reazione "hit" per indicare che ha subito danni dalla arma del Giocatore
• Un pulsante che cambia colore per indicare lo stato di sorvolare, depressed e rilasciato (selezionato)
• Un effetto sonoro di "cha-ching!" quando il giocatore completa un Acquista
• Una barra di avanzamento che si riempie quando il giocatore completa gli obiettivi della missione

Quando manca o è insufficiente il feedback, i giocatori potrebbero non sapere cosa hanno raggiunto, capire se gli effetti sono stati buoni o cattivi o anche sapere se la funzione che stanno utilizzando funziona correttamente o sta riscontrando bug.

Progettazione dei flussi

Sono necessarie molte interazioni per completare un obiettivo. I progettisti UX sono preoccupati di come i giocatori navigano da un'azione o da uno schermo o scelta all'altro e assicurarsi che queste vie siano logiche e convenienti.

Ad esempio, per equipaggiare un oggetto su un avatar in Berry Avenue RP , un giocatore deve:

• Trova e tocca il pulsante Avatar
• Seleziona una categoria di oggetto (viso, testa, collo, ecc.)
• Scorri per trovare un elemento di interesse
• Tocca l'articolo per equipaggiarlo sul suo Avatar
• Trova e tocca il pulsante Fatto per uscire dalla personalizzazione dell'avatar

Questi passi compiuti insieme rappresentano il flusso di personalizzazione dell'avatar. Questo flusso è semplice e semplice, con il maggior numero possibile di passi necessari per equipaggiare un Articolo. Poiché i giocatori non devono eseguire molte azioni o pensare troppo di ciò che devono fare, questo flusso è basso in frittione, una misura della forza richiesta per raggiungere un obiettivo.

La progettazione di flussi efficienti e di bassa frittizione richiede una attenzione attenta ai casi d'uso. Questi casi d'uso possono essere espressi come obiettivi del giocatore come:

• Vuoi essere in grado di modificare rapidamente un Avatar
• Trovare facilmente gli oggetti mentre si modificano
• Anteprima degli elementi prima della selezione
• Facile rimozione dell'elemento dopo la selezione

Queste obiettive poi guidano la progettazione UI e UX della Proprietà:

• I giocatori accedono alla personalizzazione dell'avatar attraverso un pulsante prominente sullo HUD e possono iniziare immediatamente a equipaggiare gli oggetti ai loro avatar
• Le schede classificano gli elementi in categorie convenienti, e il campo di ricerca consente ai giocatori di cercare gli elementi direttamente
• Gli articoli sono visualizzati sull'avatar istantaneamente
• I giocatori possono rimuovere l'elemento facendo clic su di esso nuovamente per deselezionarlo o facendo clic su di esso nella lista degli oggetti equipaggiati

I progettisti possono quindi iniziare a visualizzare l'interfaccia utente e a pianificare gli step che i giocatori completeranno per raggiungere l'obiettivo di modificare i loro avatar. Questo processo può essere aiutato dall'uso di un flusso di lavoro, che visualizza graficamente le azioni dei giocatori mentre navigano nell'interfaccia utente. Questi flussi di lavoro possono aiutare a identificare le azioni ignorate,