Come funzionano le animazioni di interazione personaggio / oggetto nei giochi isometrici?


10

Sto progettando un gioco isometrico di simulazione aziendale in cui il giocatore vede un ufficio con i soliti mobili come scrivanie, lavagne, ecc.

I personaggi (Staff / NPC) all'interno del gioco dovrebbero interagire con questi oggetti eseguendo alcune attività predefinite come scrivere sulla tastiera alla scrivania o scrivere sulla lavagna, ecc.

Quello che mi interessa, in particolare, è il seguente scenario:

Il personaggio si sposta attraverso l'ufficio (1) verso la sua scrivania (2) e si siede e inizia a digitare (3).

Da quello che ho capito avrei un foglio sprite per il movimento del personaggio (1) e uno sprite statico per la scrivania (2) ma non capisco bene come sarebbe gestito il terzo passo?

C'è uno sprite combinato che contiene sia la scrivania che il personaggio? Suppongo di no, altrimenti avrei bisogno di un foglio sprite per ogni combinazione di scrivania e personaggio.

Come viene gestito normalmente?

MODIFICARE:

Ecco un esempio specifico di animazione del gioco Theme Hospital. Puoi vedere il video qui .

Per quanto posso vedere l'animazione è divisa in diversi passaggi.

Passaggio 1: il personaggio si sposta tra la scrivania e la sedia.

inserisci qui la descrizione dell'immagine

Ciò suggerisce che sedia e scrivania sono in realtà sprite separate.

Passaggio 2: il personaggio si siede l'animazione

inserisci qui la descrizione dell'immagine

Notare come nell'ultima cornice la sedia sia più vicina alla scrivania.

Passaggio 3: animazioni desk

inserisci qui la descrizione dell'immagine

Passaggio 4: alzare l'animazione

È lo stesso di sedersi ma giocato al contrario.

Passaggio 5: allontanarsi

Usa l'animazione di spostamento normale per allontanarti.

La domanda che ho è: in che modo queste animazioni sono meglio separate e in che modo un artista grafico di solito fornisce queste animazioni?

Il personaggio seduto e digitando sulla scrivania è in realtà tre diversi sprite (scrivania, personaggio e sedia)? Qualcuno conosce sprite di esempio di animazioni simili?

MODIFICA 2:

Immagino che la mia più grande preoccupazione sia che ho le giuste aspettative su come appariranno gli sprite. Non riesco a disegnarli da solo, quindi dovrò pagare qualcuno per farlo e suppongo che ci sia un qualche modo di best practice per fare questo tipo di animazioni?

Risposte:


8

Risposta breve? Non combinare gli sprite.
Cioè, se combinate, dovrete avere l'animazione per ogni singola combinazione. Sembra strano se vuoi solo una sedia. Ma facciamo finta che il tuo ufficio possa essere ampliato nel gioco centrale, dove ora le sedie hanno uno sprite più bello. Vorresti solo aggiungere uno sprite o ricombinarti e aggiungere di nuovo tutta l'animazione di ogni datore di lavoro?

Facciamo alcuni calcoli.

Fai finta di avere 6 sprite su un datore di lavoro seduto digitando l'animazione, hai 5 sedie diverse e 10 tipi di datori di lavoro diversi.

Se si disegna semplicemente il datore di lavoro sopra la sedia, ciò richiederebbe 10 * 6 + 5 sprite, 65 sprite.
Se combini e crei ogni combinazione, ciò richiederebbe 10 * 6 * 5 sprite, cioè 300 sprite. Sarà così doloroso per te creare un foglio di calcolo così grande per una semplice animazione!

MODIFICARE:

Bene, se non sai come fare, sarebbe meglio definire la tua sedia come sfondo e il personale come folletti attivi. Più facile per te.

Background.draw();
Foreach(employer i in staff)
    I.draw();

Ciò dovrebbe mantenere il tuo staff separato dal tuo chais (sfondo). Inoltre, aggiorna anche i frame dell'animazione del personale in modo indipendente.

EDIT2:

Ho visto la tua modifica e i tuoi campioni. Terrei lo stesso approccio. Tutti gli sprite diversi. La sedia sarebbe comunque andata di fronte al personaggio!

Per avvicinare la sedia, aggiorna la sua posizione verso l'alto e verso sinistra di alcuni pixel, oppure esegui lo sprite stesso.

Capisci di Z align? che dovrebbe giocare un sacco di cose ...

Puoi vedere che alcune parti della sedia rimangono dietro il personaggio, altre appaiono di fronte. Quindi, come è possibile se si tratta di un solo sprite? Z align!

Due modi per ottenere l'effetto. Mantieni una maschera (non così facile) o dividi il tuo sprite in due.

Citerò solo il secondo metodo, dato che non ho molto tempo ora. Dovresti tagliare lo sprite della sedia, nelle parti che sarebbero nella parte anteriore, e ciò che sarà dietro. Quindi mettili nella stessa posizione. facile! Ciò che gioca è l'allineamento Z qui, le parti dietro devono essere disegnate dietro, il personaggio nel mezzo e le parti della sedia anteriore nella parte anteriore.

Non so quale lib / api / sdk / set di strumenti stai usando. Ma la maggior parte fa in questo modo: usa il fattore az Align che determina cosa c'è dietro o cosa c'è davanti o Cosa viene disegnato per primo vai dietro, cosa viene disegnato per ultimo. Quindi dovresti tenerlo a mente.


Sì grazie. Lo pensavo anch'io ma non capisco come sarebbero state realizzate le animazioni. conosci un esempio che potrei guardare? sarebbe meglio!
Patrick Klug,

Intendi codice o un gioco? Se vuoi un gioco, prova a vedere Game Dev Story di Kairosoft per Android e iOS. Esempio di codice che non conosco ...
Gustavo Maciel,

Risposta rivista. Verifica se soddisfa le tue esigenze (:
Gustavo Maciel,

Ho aggiornato la mia domanda con un esempio specifico. Sono davvero interessato a come sarebbero gli sprite o cosa gli artisti grafici sono abituati a fornire. Le animazioni di GameDev Story sono un po 'troppo semplicistiche per quello che ho in mente.
Patrick Klug,

Leggi Modifica 2, ho migliorato la risposta, spero che copra le tue esigenze.
Gustavo Maciel,

2

Un'idea alternativa sarebbe quella di includere un'immagine del buffer di profondità / Z con i tuoi sprite in modo simile al modo in cui le API 3D (OpenGL) assicurano che i poligoni non si sovrappongano. Per un gioco sprite di base potrebbe essere solo un mucchio di 0/1 bit (bitmap in bianco e nero) (anche se puoi usare più livelli di profondità se vuoi).

Se hai uno sprite 'deskchair' combinato e vuoi che la sedia appaia di fronte a qualsiasi altro sprite (cioè persone) su quel quadrato, renderebbe la versione Z-Buffer del carattere 'nera' mentre la scrivania sarebbe 'bianca' .

Quando si esegue il rendering dello sprite dinamico (una persona) su quella tessera, verificherebbe per vedere di che colore è il buffer di profondità. Per i pixel che sono 0 (nero), salti il ​​disegno della persona sprites pixel e lascia lì solo quelli della sedia.

Invece di controllare ogni pixel 1 alla volta, un modo più semplice per eseguire il controllo sarebbe quello di moltiplicare i pixel di sprite per il valore del buffer di profondità poiché la profondità più vicina sarebbe 0 e cancellerebbe il. Quindi ovviamente devi colorkey (a meno che tu non abbia un canale alfa color).

Questo ovviamente aggiunge un sovraccarico (anche se potresti saltarlo per tutto ciò che non ha bisogno di più livelli di profondità come una sedia da scrivania). Devi anche sincronizzare le tue animazioni (cioè la persona dovrebbe abbinarsi all'animazione della sedia da scrivania). Non ti dà la stessa flessibilità di avere solo un sacco di sprite separate.


Il livello di profondità con maschera che ho citato nella mia modifica (:
Gustavo Maciel il
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.