Share
In questo tutorial, ti mostrerò come creare una grafica 3D con ombreggiatura piatta per il tuo gioco Unity, e spiegare perché vorrai farlo in primo luogo.
Oggi c'è un'abbondanza di strumenti e motori 3D che consentono a chiunque di realizzare giochi 3D. Tuttavia, le sfide dell'arte 3D sono scoraggianti e spesso richiedono una quantità enorme di tempo, sforzi e competenze che il gamedev o l'hobbista solista non hanno. I modelli a basso poligono, in combinazione con l'ombreggiatura piatta, riportano lo stile dei primi anni '90, utilizzando tecniche che chiunque può imparare. E non è solo un ritorno al passato nostalgico; le ombreggiature piatte possono essere facilmente combinate con tecniche moderne come le mappe di occlusione ambientale per dare al tuo gioco un aspetto sorprendente e d'avanguardia.
Prendi il progetto Unity di esempio qui
Questo tutorial presume che tu sappia già come eseguire la modellazione 3D o che sia possibile trovare modelli 3D gratuiti su Internet. Tirerò fuori modelli esemplificativi dal nulla; ci sono tonnellate di tutorial su internet per come iniziare nella modellazione 3D. Se sei appena agli inizi, consiglio vivamente Wings 3D e SketchUp. Entrambe dispongono di interfacce estremamente accessibili rispetto alle app di modellazione professionale e verranno esportate nei formati che Blender e Unity possono utilizzare.
Quindi hai deciso di sporcarti le mani con Unity e iniziare a creare un gioco completamente 3D. Forse non hai abilità di gioco in precedenza, o forse hai fatto un po 'di arte per i giochi 2D; in entrambi i casi, imparerai rapidamente che i giochi 3D richiedono un set molto ampio di abilità da creare. Non solo devi imparare come creare modelli 3D, devi scartare quei modelli per disegnare correttamente una texture sulla superficie del tuo modello. Devi anche creare faticosamente la trama, ovviamente.
E se potessi creare il modello, ma averlo finito e pronto per il tuo gioco dopo qualche passo in più per colorarlo e ombreggerlo? Potresti finire con qualcosa del genere:
O questo:
Certo, l'aspetto è spartano e lo-fi, ma questo è il punto! Sia che tu stia mirando alla nostalgia dei primi anni '90, a un look moderno e astratto, o voglia solo risparmiare un sacco di tempo a fare risorse per un gioco di marmellata, l'ombreggiatura piatta è un'ottima scelta di stile sia per i principianti che per gli esperti 3D.
Se hai appena iniziato con la grafica di gioco, la semplicità del flusso di lavoro ti consente di concentrarti sui fondamentali: imparare a creare un modello 3D con una bella silhouette e forma e colorarlo con una piccola serie di colori scelti a mano. Concentrarsi su questi principi fondamentali ti insegna le abilità di base dell'arte senza distrazioni.
Ogni modello 3D è composto da una serie di vertici che determinano la forma di quel modello. Per ogni vertice, c'è anche un vettore chiamato a normale-pensala come una piccola spilla che spunta dal vertice.
Il motore di rendering usa la normale per ogni vertice e confronta la sua direzione con la direzione di qualsiasi sorgente luminosa in ingresso e la direzione in cui la telecamera è rivolta, al fine di determinare la quantità di luce da applicare a quel vertice.
Il renderer dissolve lentamente la quantità di luce da un vertice all'altro, dando a un modello 3D di base un aspetto "appiccicoso". A meno che non applichi una texture (e spesso, anche se lo fai), questo sembra davvero terribile su tutto ciò che non è in realtà una superficie sinuosa, "morbida":
Con l'ombreggiatura piatta, l'intera superficie di un poligono riceve una quantità uniforme di luce, calcolata da una normale sporgenza verso l'esterno dal centro del poligono:
Le moderne applicazioni di modellazione utilizzano "bordi rigidi" o "gruppi di levigatura" per regolare le normali dei vertici del modello in modo che corrispondano al poligono a cui sono adiacenti, causandone l'ombreggiatura uniforme e uniforme. Un abile artista 3D userà questi per rendere gli spigoli nitidi e le superfici piatte piatte, ma siamo interessati a rendere l'intero modello nitido e piatto. Per fortuna, Unity rende questo molto semplice.
Se hai abbastanza familiarità con lo strumento di modellazione, puoi rendere il tuo modello un ombreggiato piatto impostando tutti i bordi come "difficili". Tuttavia, in Unity puoi semplicemente scegliere di consentire a Unity di creare automaticamente gli spigoli:
Clicca sul tuo modello in Progetto finestra per far apparire il suo Importa impostazioni nel Ispettore pannello.
Vai al Normali e tangenti sezione e, nel normali menu a discesa, scegliere Calcolare.
Impostare il Angolo di levigatura a 0 e fare clic Applicare.
Unity trasformerà ogni spigolo in un angolo più acuto di questo in un bordo duro. Vogliamo che tutti i nostri bordi siano rigidi, quindi in modo naturale impostarli 0 dà questo effetto.
Sentiti libero di sperimentare diversi angoli di levigatura, a seconda della geometria del tuo modello, può essere un modo incredibilmente facile per dargli un aspetto completamente diverso.
Ora che abbiamo ombreggiato il nostro modello, dobbiamo dargli un po 'di colore! Ci sono molti modi per farlo, ma alcuni sono migliori di altri:
Preferisco di gran lunga l'ultimo metodo, che ti descriverò qui sotto. Normalmente, dopo aver creato un modello 3D, devi scrupolosamente scartarlo per adattarlo a una trama fatta a mano. Tuttavia, dal momento che ci interessa solo avere un singolo colore per ogni poligono, non importa quale sia il tuo lavoro di unwrapping UV: potrebbe essere solo un miscuglio casuale di vertici, purché sia sopra il corretto colore!
Il primo passo nella colorazione è creare la trama. Per il nostro esempio, diciamo che vogliamo quattro colori:
Successivamente, carica il modello 3D completato nel tuo modellatore preferito e carica la trama. Seleziona tutti i volti del modello che desideri essere di un certo colore e automaticamente l'UV scartalo. Il risultato sarà probabilmente un miscuglio confuso di poligoni.
Come ho detto, però, non importa. Sposta tutti i poligoni uno sopra l'altro e ridimensionali in un piccolo blob che si adatterà a uno dei quadrati della texture della tavolozza. Quindi, trascinali sopra il colore che hai scelto.
Dai un'occhiata al tuo modello; le sezioni strutturate ora hanno il colore giusto! Ripeti questo processo per il resto dei volti del tuo modello, ancora selezionandoli e scartandoli in base al colore che vuoi che siano. Se commetti un errore, non è un grosso problema, basta selezionare di nuovo i volti, scartarli di nuovo se necessario e metterli nel posto giusto sulla trama. Lo stesso non si può dire per il "vero" unwrapping UV!
Voilà! Hai un modello colorato e ombreggiato che puoi importare nel tuo gioco.
Nel caso ve lo stiate chiedendo, ecco alcuni motivi per evitare gli altri due metodi:
Questo metodo crea molti materiali di cui tenere traccia in Unity e, cosa più importante, Unity non metterà dinamicamente in batch i tuoi modelli e utilizzerà un'intera call call per ogni materiale, che è spesso il collo di bottiglia più piccolo sull'hardware grafico moderno.
In poche parole, otterrai prestazioni terribili se utilizzi ampiamente questo metodo.
In realtà funziona abbastanza bene e potresti volerlo utilizzare a seconda delle tue esigenze o del tuo flusso di lavoro artistico. Tuttavia, noterai immediatamente qualcosa: quando importi il tuo modello e usi uno shader Diffuse di base, i tuoi vertici non sembrano mostrare!
Questo perché gli shader di base li ignorano; avrai bisogno di usare shader speciali che effettivamente usano i dati dei colori dei vertici. Questi possono essere trovati facilmente, ma le cose si complicano se vuoi anche altri effetti di rendering da altri shader: questi shader spesso non usano neanche i colori vertici, e avrai bisogno di modificare lo shader da solo.
Se non sai già come scrivere shader, questo può portare a un sacco di tempo e fatica che vorresti spendere per il resto del tuo gioco. Inoltre, potrebbe essere solo io, ma trovo molto più facile cambiare più colori contemporaneamente con una texture piuttosto che impostarli manualmente in un modellatore o in-game con uno script.
Ora che hai una tavolozza delle texture e una tecnica di base, puoi continuare a creare il resto dei modelli per il tuo gioco. Come sospetti, puoi semplicemente aggiungere colori alla tavolozza e utilizzare la stessa trama per l'intero gioco.
Ci sono in effetti alcuni grandi vantaggi in termini di prestazioni: se ti attieni a utilizzare lo stesso materiale per l'intero gioco, Unity di solito disegna tutti i tuoi oggetti in modo più efficiente "facendoli" in batch. Come ho detto prima, "disegnare chiamate" sono un collo di bottiglia importante nella grafica computerizzata ed è una buona idea tenerle al minimo.
Unity cercherà automaticamente di disegnare la scena nel minor numero di chiamate possibili se si utilizza un singolo materiale per ogni cosa, sebbene ogni modello debba essere ridimensionato allo stesso modo e avere meno di 300 vertici. Ti informerà di quanto bene è fatto nel Statistiche finestra:
Mancia: Se desideri saperne di più sul batching, assicurati di controllare i documenti Unity sull'argomento. Questo dovrebbe essere richiesto a chiunque sia interessato alle prestazioni del loro gioco!
Hai una serie di modelli con ombreggiatura piatta e colorata, e tutto sembra a posto, ma cosa succede se vuoi cambiare i colori mentre il gioco viene giocato?
Ad esempio, diciamo che hai uno script che genera il tuo aeroplano, ma in seguito vuoi colorarlo di blu se è amico o rosso se è un nemico. Puoi certamente creare palette separate e materiali separati, ma significa perdere l'incremento prestazionale del batching di questi due tipi di aeroplani.
Non è un grosso problema se ce ne sono solo alcuni in una sola volta. Tuttavia, prendi l'esempio di un terreno generato in modo procedurale composto da tonnellate e tonnellate di tessere o cubi, di molti tipi di terreno diversi, come un certo gioco sandbox popolare. Ciò significherebbe una tonnellata di richieste di sorteggio, ma non temere, c'è un modo per continuare a usare un solo materiale!
Ricorda come hai colorato il tuo modello spingendo le sue coordinate UV in scatole colorate? Unity ti consente di modificare al volo i vertici del tuo modello, comprese le coordinate UV, quindi per ogni tipo di terreno puoi semplicemente spostare le coordinate UV nella casella di colore corretta tramite script.
Crea un nuovo script C # in Unity chiamato PaletteColorizer e incolla questo codice in esso:
usando UnityEngine; usando System.Collections; public class PaletteColorizer: MonoBehaviour public int colorsPerRow = 4; public int colorIndex = 0; public bool overrideUVs = false; void Awake () if (! enabled) return; SetUVsToColor (colorIndex); void Update () public void SetUVsToColor (int colorIndex) if (overrideUVs) SetUVs (gameObject, GetColorOffset (colorIndex)); else TranslateUVs (gameObject, GetColorOffset (colorIndex)); Vector2 GetColorOffset (int colorIndex) offset Vector2 = nuovo Vector2 (); float row = Mathf.Floor (colorIndex / colorsPerRow); float step = 1.0f / colorsPerRow; offset.x = (colorIndex - (row * colorsPerRow)) * step; offset.y = (1.0f - (row / colorsPerRow)); offset di ritorno; public public void TranslateUVs (GameObject obj, Vector2 offset) var meshFilter = obj.GetComponent (); Maglia mesh = meshFilter.mesh; var newUVs = new Vector2 [mesh.uv.Length]; per (int i = 0; i < mesh.uv.Length; i++) newUVs[i] = new Vector2(mesh.uv[i].x + offset.x, mesh.uv[i].y + offset.y); mesh.uv = newUVs; static public void SetUVs(GameObject obj, Vector2 offset) var meshFilter = obj.GetComponent(); Mesh mesh = meshFilter.mesh; var newUVs = new Vector2[mesh.uv.Length]; for(int i=0; i < mesh.uv.Length; i++) newUVs[i] = new Vector2(offset.x + 0.01f, offset.y - 0.01f); mesh.uv = newUVs;
Per utilizzare questo script, è sufficiente aggiungerlo come componente a qualsiasi oggetto di gioco con un materiale utilizzando una texture della tavolozza, impostare il numero di colori per riga e impostare l'indice del colore (iniziando con 0 nell'angolo in alto a sinistra e contando fino a il giusto e il basso).
Se le coordinate UV del tuo modello non sono configurate per adattarsi all'interno dei riquadri delle palette (come nel caso del quadrante "acqua" attorno agli esagoni), controlla il Override UV casella di controllo; come puoi vedere sopra, questo farà sì che lo script scriva interamente nuove coordinate invece di cambiare quelle esistenti.
Una cosa da tenere a mente su questo metodo è che, quando si modifica una mesh, Unity creerà tranquillamente una nuova mesh in memoria. Se lo si fa particolarmente spesso su un numero elevato di mesh, è possibile che si verifichino problemi di memoria e si vorrà esaminare la possibilità di memorizzare nella cache e condividere le mesh che sono state colorate allo stesso modo. Per un numero ragionevole di modelli low-poly, però, probabilmente non dovrai mai preoccuparti di questo.
L'ombreggiatura piatta non ha necessariamente bisogno di essere sempre abbinata a blocchi di colore uniformi. Un modo per aggiungere dettagli delicati e un aspetto "polveroso" realistico su qualsiasi superficie è aggiungere un'occlusione ambientale ad essa. Unity Pro fornisce modi per aggiungere l'occlusione ambientale come filtro di post-elaborazione, ma voglio mostrarti un modo per aggiungere quel tocco extra di smalto senza bisogno della versione Pro e senza nemmeno bisogno di shader speciali.
Tutto quello che devi fare è scartare il tuo modello e "cuocere" l'effetto dell'occlusione ambientale su una texture. Questo richiede di dedicare del tempo e degli sforzi per scartare correttamente il tuo modello, ma dopo questo passaggio è questione di pochi clic e un po 'di giocherellando con il tuo programma di disegno per dare al tuo modello un aspetto leggermente più reale e d'avanguardia.
Per prima cosa, dovrai avviare Blender con una scena vuota: Premi UN per selezionare tutti gli oggetti nella scena di avvio, premere Elimina, quindi premere D per confermare. Non vuoi lampade o videocamere perché queste verranno importate come oggetti indesiderati vuoti in Unity.
Quindi, importa il tuo modello. (File> Importa> Wavefront (.obj)). Per questo esempio, iniziamo con un boulder.
Apri l'Editor UV e crea una texture che è in grado di contenere all'incirca la quantità di dettagli che desideri. Sono piuttosto avaro, quindi mi limito a 256x256px per qualsiasi cosa sulla dimensione del giocatore (una roccia o un albero), e divento solo più grande per oggetti molto grandi (come la montagna su cui camminano).
Ora, scartare il modello. Ci sono molti modi per farlo, che sono trattati in modo molto più dettagliato di quanto potrei mai sperare, quindi consulta la documentazione di Blender o altri tutorial online su come scartare correttamente il tuo modello in modo corretto ed efficiente.
Ora che hai un modello da scartare, sei pronto per infornare l'occlusione ambientale sulla tua texture. Blender renderà l'occlusione ambientale direttamente sulla tua trama, rispettando le coordinate UV che hai appena scartato. Segui semplicemente questi passaggi:
Ora hai la texture AO cotta e un modello che ha le coordinate UV corrette per usarlo. Salva la texture in un file immagine ed esporta il modello in Blender in un formato che Unity può usare (come ad esempio .fbx).
A seconda delle esigenze, potresti essere in grado di utilizzare la trama così com'è. Crea semplicemente un nuovo materiale Diffuse che utilizza la tua nuova texture AO sfornata e imposta il colore su qualcosa che ti sembra bello.
Tuttavia, probabilmente vorrai avere modelli con più colori, come un albero. Hai solo bisogno di seguire alcuni passaggi aggiuntivi. Segui le istruzioni sopra per creare una texture AO cotta per il tuo modello di albero. Questa volta, però, vorrai tenere traccia di dove hai messo le tue coordinate UV, perché dovrai colorare manualmente quelle posizioni sulla texture.
Sarebbe saggio raggruppare le isole UV per colore. In questo esempio, inserisco le parti del tronco nella parte superiore della trama e le parti in foglia sul fondo.
Apri la tua texture AO cotta con il tuo programma di colorazione preferito (qualsiasi cosa supporti i layer, come GIMP). Crea un nuovo livello e mettilo sopra il tuo livello AO, usando il livello AO come guida per colorare il nuovo livello in base ai colori che desideri vedere nel modello.
Utilizzare il laccio strumento, o altro strumento di selezione a tua scelta, per selezionare le parti della texture che vuoi colorare, quindi riempire quelle con il colore corretto.
Ora hai impostato i colori, quindi è l'ora del compito finale: fondere l'AO sopra i colori. Sposta il livello AO sopra il livello colorato e modifica la modalità di fusione su Moltiplicare.
Imposta l'opacità del livello su qualsiasi aspetto piacevole. Usa il tuo stesso giudizio, ma assicurati di annotare questa percentuale, poiché per ottenere un effetto uniforme su tutte le tue trame ti consigliamo di utilizzare lo stesso metodo e quantità di fusione.
Salva questa texture in un file e importala in Unity accanto al modello ad albero. Crea un materiale proprio come hai fatto per il masso, usando la trama che hai appena creato.
Questo è praticamente tutto! Usa questa tecnica su tutti i tuoi modelli per dare all'intera scena un aspetto più lucido e tangibile di quello che potresti ottenere con la sfumatura piatta di base.
Potresti notare che i tuoi materiali utilizzano solo shader diffusi di base. Una delle cose più belle dell'utilizzo di AO cotto miscelato direttamente sulla trama del colore è che puoi usare questa texture con qualsiasi altro shader che abbia una trama diffusa ... senza codice specifico AO richiesto!
Ora hai a portata di mano una comoda cassetta degli attrezzi con le tecniche grafiche che puoi utilizzare per creare un intero gioco flat-shaded. Con una pratica sufficiente, puoi realizzare immagini straordinarie che sono veloci da produrre e che rendono efficiente il rendering.
Accentsconagua