Super Mario 64 mit Unity als Browsergame

Roystan Ross hat mit der Unity Engine das erste Level aus dem Nintendo 64 Klassiker Super Mario 64. Es sieht nicht nur erstaunlich gut aus (von der Grafik deutlich besser als das Original). Es spielt sich auch prima. Die Animationen wirken identisch mit dem Original und auch den Sound ist man gewohnt.

Auf seinem Blog schreibt Ross viel zu Unity. Vor allem natürlich zu seinem Projekt Super Mario 64 HD. Aber auch andere Themen im Hinblick zu Spielerstellung mit Unity. Beispielsweise hat er den Charakter Controller aus dem Mario Spiel also Customer Version freigegeben und jedem zur Verfügung gestellt.

Achja, Super Mario 64 HD kann man über diesen Link direkt im Browser spielen (Unity Player wird evtl. geblockt --> zulassen).

Visualisierung kostenlos

An dieser Stelle möchte ich noch auf Tools etc. zur Visualisierung verweisen, welche kostenlos sind. Das Programm R habe ich bereits in älteren Beiträgen beschrieben.

Google Developers bietet unter der Chart Gallery einige Tools zur Visualisierung an. Dank der Verbindung von JavaScript HTML und CSS lassen sich diese Ergebnisse einfach in eine Website integrieren. Der vorherige Post zum Thema Treemap habe ich ebenfalls mit diesem Google Tool erstellt.

Eine weitere JavaScript Bibliothek gibt es unter d3js.org.

Maps, Stocks und Charts lassen sich sich wohl auch mit dem Tool auf highcharts.com ganz gut und ansehnlich erstellen. Selbst getestet habe ich es nicht. Die Beispiele sehen aber sehr interessant aus und für nichtkommerzielle Zwecke ist es kostenlos.

Natürlich gibt es noch weitaus mehr Toos zum Visualisieren. Eine Zusammenstellung dazu habe ich hier gefunden. Dort werden auch Tools wie ManyEyes, Processing, Gapminder, WolframAlpha und viele mehr vorgestellt und verlinkt.

Visualisierung mit Google Treemap

Seitdem ich die Treemaps auf MarketWatch.com gesehen habe, wollte ich in diese Richtung visualisieren. Aber welche Daten soll ich dafür verwenden?

Da ich fast täglich die "NBA Game Time" App auf meinem Handy benutze, ist mir aufgefallen, dass die National Basketball Association eine riesige Datenbank voller Statistiken besitzt. Auf nba.com/stats kann man zu ziemlich allen möglichen Bezügen Statistiken abrufen. Leider ist ein Export im CSV-Format meines Wissens nicht möglich.

Da ich keine Statistik visualisieren wollte, die es schon gibt, musste ich mir etwas ausdenken. Da sich die Playoffs nähern und die Presse oft davon schreibt, wie stark der Westen im Vergleich zum Osten ist, dachte ich mir, gehe ich der Sache nach. Außerdem gibt es seit der Saison 2011/2012 eine Reihe neuer Statistiken in der NBA. Zum Beispiel die Advanced Statistics. Diese Statistiken wollen vor allem die Effizienz der Spieler messen. Auch ist es wesentlich schwerer die Defense als die Offense zu messen. Dafür kommen zum Beispiel spezielle Kameras zum Einsatz, wie in diesem Bericht erwähnt wird.
Die Statistik mit der kompliziertesten Formel ist das Player Efficiency Rating (PER):

PER = (LgPace/TmPace) * (15/LgPER) * (1/MP) * [3P + (AST*0,67) + (FG*{2-[(TmAST/TmFG)*0,588]}) + (FT*0,5*{2-0,33*(TmAST/TmFG)}) + (DefREB*VOP*LgOffREB%) + (OffReb*VOP*LgDefREB%) + (STL*VOP) + (BLK*VOP*LgDefREB%) - (TO*VOP) - [(FGA-FG)*VOP*LgDefREB%] - {(FTA-FT)*VOP*0,44*[0,44+(0,56*LgDefREB%)]} - {PF*[(LgFT/LgPF)-((LgFTA/LgPF)*0,44*VOP)]}]. 

Somit sollen sich auch Statistiken unterschiedlicher Epochen vergleichen lassen. Und wer hätte es gedacht,  auf dem ersten Platz steht Michael Jordan mit einem Wert von 27,91.

In einigen Statistiken werden aktuell verletzte Spieler nicht aufgeführt. Somit kann es sein, dass beispielsweise ein PER-Wert eines Spielers nicht automatisch verfügbar ist und manuell berechnet werden müsste. Aus diesem Grund habe ich mich entschieden die EFF (Efficiency) zu verwenden. Die Effizienz stellt eine Vergleichsgröße dar, mit der die Leistung eines Spielers bewertet und vergleichbar gemacht werden kann (und ist im Vergleich zur PER einfach und schneller zu berechnen).

Effizienz = (Punkte + Rebounds + Assists + Steals + Blocks) - ((Anzahl Wurfversuche - Anzahl verwandelte Würfe) + (Anzahl Freiwurfversuche - Anzahl verwandelte Freiwürfe) + Turnover)

In Google Treemaps kann man Grundsätzlich zwei Parameter einstellen. Die Größe eines Vierecks und die Farbe. Außerdem kann man die Vierecke beschriften und per Mousover den Wert, welcher dahinter liegt, anzeigen lassen. Meine Visualisierung soll folgendes veranschaulichen:

1. Eine Gegenüberstellung der Western Conference und Eastern Conference, anhand der Win%. Wie viel Prozent der Spiele hat ein Team gewonnen? Je höher desto größer das Viereck der jeweiligen Conference. Die Farbe wird durch die Anzahl der Siege berechnet. 0% Siege = Farbe Pink, 100% Siege = Farbe Blau.
2. Die Conferences sind in Teams eingeteilt (Hiebei jeweils nur 8 Teams - die acht, welche aktuell in die Playoffs einziehen würden). Die Teams werden wiederum durch die Spieler bewertet.
3. Jedem Team habe ich die fünf Spieler der Starting Lineup zugewiesen. Hier wollte ich die Korrelation von durchschnittlicher Spielzeit (MIN) und Effizienz (EFF) darstellen. Je mehr Spielzeit, desto größer das Viereck. Umso eine höhere EFF, desto blauer das Viereck.

Mein Resultat sieht vorerst so aus (auf Result klicken - im Treamap ist Linksklick = vor, Rechtsklick = zurück): 

Dabei bestehen noch einige Probleme. Der Mousovereffekt muss noch optimiert werden (Beschriftung). Komfortabel wäre es natürlich auch, die Daten als JSON-Datei einzubinden. Als Child-Elemente von den Spielern wollte ich noch weitere Statistiken anfügen, die ich schon angefangen habe vorzubereiten:

      ['Points',    'Harrison Barnes',            10.5,                              9.1],
          ['Rebounds',    'Harrison Barnes',            5.6,                              9.1],
          ['Assists',    'Harrison Barnes',            1.4,                              9.1],
       
          ['Points',    'Andrew Bogut',            6.2,                              11.3],
          ['Rebounds',    'Andrew Bogut',            8,                              11.3],
          ['Assists',    'Andrew Bogut',            2.6,                              11.3],
       
          ['Points',    'Stephen Curry',            23.3,                              17.8],
          ['Rebounds',    'Stephen Curry',            4.3,                              17.8],
          ['Assits',    'Stephen Curry',            7.9,                              17.8],
       
          ['Points',    'Draymond Green',            11.8,                              11.3],
          ['Rebounds',    'Draymond Green',            8.1,                              11.3],
          ['Assists',    'Draymond Green',            3.6,                              11.3],
       
          ['Points',    'Klay Thompson',            21.9,                              12.7],
          ['Rebounds',    'Klay Thompson',            3.2,                              12.7],
          ['Assists',    'Klay Thompson',            2.9,                              12.7],
       
          ['Points',    'Tony Allen',            8.7,                              8.7],
          ['Rebounds',    'Tony Allen',            4.4,                              8.7],
          ['Assists',    'Tony Allen',            1.4,                              8.7],

Leider ist das so nicht möglich, da identische Children nicht auf unterschiedliche Parents zugreifen können. Eine Lösung hierzu ist mir bisher noch nicht eingefallen. Ich werde aber daran arbeiten und Neuigkeiten wieder hier berichten.

Fertiges Spiel in Unity

Nachdem scripten ist es nur noch ein Schritt bis zum fertigen Spiel. Dieser ist dank Unity verhältnismäßig einfach. Über File --> Build & Run kann man das Spiel generieren. Hier kann man auch noch auswählen, für welche Plattform es erstellt werden soll. Ich habe es einmal als .app für Mac konfiguriert und einmal als Browser Spiel.
Unter diesem Link habe ich das Browser-Game bereitgestellt. Hier muss man beide Dateien downloaden. Anschließend die HTML-Datei öffnen, dann der Anweisung folgen und den Unity-Player herunterladen. Anschließend nur noch darauf achten, dass Pop-Ups nicht geblockt werden.

Als Anschauungsmaterial habe ich hier ein Ingame-Video:

Abschließend möchte ich noch ein kurzes Fazit zum gesamten Projekt loswerden:
Unity und Blender bieten eine Vielzahl an Möglichkeiten, wie man etwas macht. Tutorials im Internet unterstützen dabei enorm. Man kann sich viel anschauen und für sein eigenes Projekt anpassen. Die Community ist wirklich fantastisch. Ebenso wie die beiden erwähnten Programm. Vor allem Blender hat einen hohen Einstiegs- und zu Beginn vor allem Frustrationsgrad. Doch nach einer Weile kommt man damit ganz gut klar.
Auch muss ich sagen, dass ich mich mit den Themen, welche ich behandelt habe, nun ganz gut zurecht finde. Nach meinem Gefühl ist das aber nicht einmal ein Bruchteil von dem Gesamtmöglichen, was die Programme bieten. Aber das freut mich auch, da ich einen Einstieg gefunden habe und es jetzt eigentlich erst richtig losgehen kann.
An dieser Stelle bedanke ich mich bei meinem Projektpartner Roland. Es hat sehr viel Spaß gemacht und ohne unsere Zusammenarbeit wäre dieses Projekt wohl nicht zustande gekommen. Ebenfalls danke an die PH, für die Räumlichkeiten, Hardware und Software.

Zu unserem Spiel möchte ich sagen, es sieht zwar optisch nicht schön aus, hat einige Bugs, aber es läuft. Wir haben es geschafft, aus Blender 3D-Modelle, samt Animationen zu generieren, diese in Unity zu importieren und per Script daraus ein Spiel zu erstellen.

Zu aller Letzt noch zwei offene Themengebiete, dich ich unbedingt noch nennen möchte.

1. Wieso haben wir mit C# und nicht mit Java Script programmiert? - Das war mehr oder weniger Zufall. Unser erster Beispielcode war in C#, dann haben wir einfach gedacht, machen wir so weiter. Die offiziellen Unity Tutorials zeigen immer beide Varianten an. Code in C# und JS. Da wird man hervorragend unterstützt. 
2. Die neuste Version von Unity (Unity 5) bietet weitere tolle Features, die wir aufgrund der Vorgängerversion nicht nutzen konnten. Wir wollten mitten im Projekt kein Risiko eingehen und haben deshalb kein Update des Programms durchgeführt. Ein neues Feature, welches uns durchaus hilfreich gewesen wäre ist die UI Scrollbar. Leicht modifiziert hätten wir so eine interaktive Healtbar einbauen können, welche nach jedem Treffer abnimmt. Ein Tutorial dazu gibt es hier.

Scripten in Unity

Bei der Programmierung von Scripten stellt Unity mit MonoDevelop automatisch eine hervorragende integrierte Entwicklungsumgebung. Ähnlich wie Eclipse bietet MonoDevelop alles was man zum Programmieren benötigt.

Um ein Script in Unity zu erstellen, geht man im Inspector im unteren Teil wieder auf den Button "Add Component" und wählt "New Script. Nun kann man noch die Programmiersprache auswählen und das Script erstellen. Es erscheint von nun an bei den Assets. Ein Doppelklick hier auf die Datei und MonoDevelop wird geöffnet (In der Unity Version 4.3 kommt es hierbei zu Problemen und MonoDevelop lässt sich nicht starten. Ein Update behebt den Fehler). 

Die Variablen (Aim, Health, Movement Speed, Game Over und Sip Health) wurden von uns im Script erstellen und erscheinen, wie im Screenshot zu sehen, auch in der Unity Umgebung.

Da wir unseren Animationen bereits in Blender verschiedene Bezeichnungen gegeben haben, mussten wir für jeden Charakter ein einzelnes Script schreiben. Bei dem geringen Umfang war das kein Problem. Aber trotzdem der Tip: Schon zu Beginn des Projekts überlegen, wie das Script ungefähr aussehen soll. Dementsprechend schon in Blender die Animationen identisch benennen.

Mein Script sah dann so aus:

Zur Erklärung:

• anim vom Typ Animation belegen wir mit unseren Animationen
• Die Variable healt wird mit 100 gefüllt und soll sich mit jedem Schlag um 10 verringern.
• Die Variable movementSpeed haben wir festgelegt und auf 10 gesetzt, damit die Charaktere etwas schneller sind.
• gameOver ist ein Textfeld und wird bei Spielende angezeigt.
• dispHealth ist ebenfalls ein Textfeld und zeigt die Healthangabe beider Charaktere in der jeweiligen oberen Ecke.

An dieser Stelle soll gesagt werden, dass sich die offiziellen Unity Tutorials als sehr hilfreich herausgestellt haben. Ein Video-Tutorial zum Thema Collider habe ich hier nachfolgend als Beispiel eingestellt.

Weiter in der Erklärung des Scripts. 

void OnTriggerStay (Collider collider)
        {
                if (Input.GetKeyDown ("f") && health >= 0) {
                        health -= 10;
                
                }

Den dritten Box-Collider haben wir auf Trigger gestellt. Kommt dieser Collider in Kontakt mit dem Collider des Gegners, ist folgende If-Anweisung möglich: Drückt der Gegner die "f" Taste auf der Tastatur wird die Healthvariable um -10 verringert pro Tastendruck.

    void OnCollisionExit (Collision collision)
        {
                //Bei Berührung mit einem anderen Rigidbody entstehen Krafteinwirkungen die wir nach der Collision elliminieren
                rigidbody.velocity = Vector3.zero;
        
        }

Nach der Collision werden alle Kräfte (forces) des Vectors3 (3D Vector in Unity) auf 0 gestellt. Das ist nötig, weil sich die Modelle aufgrund des Rigidbodies sonst weiterbewegen. In unserem Falls sind sie nach einer Berührung langsam nach hinten gerutscht. 

void Update ()
        {
                dispHealth.text = "Dominator: " + health.ToString () + " HP";
                //KO-Bedingung
                if (health <= 0) {
                        Time.timeScale = 0;
                        gameOver.text = "Rageland gewinnt!";

In void Update haben wir die Anweisung, dass wenn die Healthvariable kleiner gleich O ist der timeScale auf 0 gesetzt wird und gamOver aufgerufen wird. Das hat zufolge, dass das Spiel gestoppt wird und das gameOver Textfeld erscheint. Das Besondere hierbei, die Healthanzeige des Gegners ist sozusagen im eigenen Script.

} else  if (Input.GetKey ("j")) {

                        //Positionsänderung erfolgt anhand der vergangenen animationszeit * Bewegungsgeschwindigkeit
                        //Crossfade als Animationsanweisung sorgt dafür, dass die Übergänge zwischen den Animationen erstellt werden
                        anim.CrossFade ("Armature|Rueckwaerts");
                        transform.position += new Vector3 (movementSpeed * Time.deltaTime, 0, 0);
                } else if (Input.GetKey ("h")) {
            
                        anim.CrossFade ("Armature|Vorwaerts");
                        transform.position += new Vector3 (-1 * movementSpeed * Time.deltaTime, 0, 0);
                } else if (Input.GetKey ("l")) {
            
                        anim.CrossFade ("Armature|Jab");            
            

Ist das nicht der Fall gelten folgende Else-Anweisungen. Der Tastaturbefehl "j" dient zur Bewegung Rückwärts, solange die Taste gedrückt wird. Gleichzeitig wird die entsprechende Animation (hier: Armature|Rueckwaerts) abgespielt. Die Multiplikation movementSpeed*Time.deltaTime löst aus, dass sich der Charakter um 10 Pixel pro Sekunde auf der X-Achse bewegt. Mit der Taste "h" kann man ihn vorwärts bewegen, mit "l" wird der Schlag ausgeführt.

} else {
            
                        anim.CrossFade ("Armature|Fightposition");
                }

Wird nichts gedrückt, wird die Animation "Armature|Fightposition" abgespielt. Wie hier zusehen ist, haben wir bei allen Animationen einen CrossFade hinzugefügt. Das sorgt für eine weicheren Übergang zwischen den einzelnen Animationen.

Box Collider & Rigidbody in Unity

Bevor wir die Charaktere per Tastatureingabe über ein Script ansteuern können, sind noch ein paar Vorbereitungen zu treffen.

Den Modellen haben wir einen Rigidbody zugewiesen (Add Components --> Physiks --> Rigidbody) und sie somit mit physikalische Eigenschaften versehen. Den Wert Mass haben wir auf auf den geringsten Wert von 0,0000001 gestellt. Den restlichen Einstellungen haben wir fast alle auf Default gelassen. Die Constrains (einzelne Bewegungsachsen) haben wir alle gefreezed, bis auf die X-Achse. Unser Charakter soll sich nämlich nur auf dieser Achse vor und zurück bewegen können. Wie in einem klassischen Beat' em Up wie Steet Fighter und Co.

Eine Erklärung zu allen Rigidbody-Einstellungen gibt es hier. Zusätzlich haben wir beiden Charakter einen Box Collider (grüner Kasten) zugewiesen. Dieser hat gleich zwei Funktionen: (1) Zum einen haben wir die beiden Collider-Größen in X-Achste etwas erhöht, da wir anfangs das Problem hatten, dass die Charakter aneinander vorbei rutschten, wenn sie frontal auf sich zugingen. (2) Und zum anderen brauchen wir den Collider für das Script. So können wir gewisse Abhängigkeiten bei Collider Berührung erstellen und abfragen.

Dem anderen Charakter haben wir noch einen zusätzlichen Collider mitgegeben. Dieser ist, wie auf dem folgenden Screenshot zu sehen, etwas vor dem Modell platziert. Der Collider simuliert im Grunde die Reichweite der Schlaghand. Das spielt beim scripten noch eine wichtige Rolle und wird im nächsten Beitrag beschrieben.

Charakter in Unity integrieren

Nach einigen Feinarbeiten am 3D-Modell steht nun der Export nach Unity an. Dazu habe ich den Charakter in Blender im Autodesk FBX (.fbx) exportiert. Diese Datei enthält das 3D-Modell, die Armature (Bones) und alle Animationen.
In Unity kann man diese Datei anschließend per Drag & Drop zu den Assets ziehen. Nun muss man die Texture noch einmal neu Verknüpfen. Dazu in der Hierarchy auf der linken Seite den Charakter auswählen, dann den eigentlichen Body (Mesh) anklicken. In meinem Fall heißt er eye.green (durch das importierte Auge, gab es Bennenungskomplikationen). 

Beziehungsweise hat Unity meinen Charakter in fünf Dateien (Mesh Part0 - 1) unterteilt, da mein Model zuviel Vertices (Punkte) bzw. Faces (Flächen) besitzt. Durch mehrfache Anwendung des Subdivision Surface Modifiers hab ich meinen Charakter in sehr viel Polygone unterteilt, was mir jetzt nachteilig erscheint. Deshalb der Tip, sparsam mit diesem Modifier umgehen.

Hat man das Mesh ausgewählt, kann man im Inspector auf der rechten Seite die Textur verknüpfen. Dazu einfach die PNG-Texturdatei, welche auch in Blender verwendet wird, in das Feld rechts unten ziehen, bzw. über "Select" auswählen.

Im Inspector kann man ebenfalls, die Positionierung und Größe des Charakters auswählen. Wir haben ein Terrain gebastelt und die beiden Modelle auf einem Berg positioniert. Dazu mussten wir sie noch um den Faktor 200 vergrößern.

Auf dem vorherigen Screenshot sind auch schon die ganzen Animationen gelistet, die Blender ohne Probleme übernommen hat. Dabei ist es wichtig, dass man in den Import Settings unter "Rig" den Animation Type auf "Legacy" einstellt (Die Import Settings erreicht man, indem man auf den Charakter unter Assets klickt).

Legacy bedeutet, dass die Animationen aus Blender vererbet werden. Unity bietet auch die Möglichkeit einer automatischen Knochenerkennung. Stellt man den Animation Type auf "Humanoid" erkennt Unity die Bones des 3D-Modells und verknüpft sie mit dem sogenannten Unity Avatar.

Unter dem Punkt Animations, kann man alle Animationen des Modells ansehen, abspielen und sogar schneiden. In meinem Fall musste ich den Jab um einen Frame am Anfang kürzen. Auch kann man Loop Frames automatisch einfügen lassen, um die Bewegung runder darzustellen.

Tip: Bei mehreren Modellen, für jedes einen eigenen Ordner in den Assets anlegen. Jeden Charakter einzeln nacheinander einfügen, Textur zuweisen und positionieren.

In Unity sah das Ganze dann so aus:

Mein Charakter musste mit dem Rücken zu dem anderen Charakter positioniert werden, damit die Animationen später im Spiel auf die richtige Seite abgespielt werden. Mehr dazu aber im nächsten Beitrag...

Charakter texturieren

Nachdem letzten Post ist zwar einwenig Zeit verstrichen, unser Projekt wurde aber dennoch weiter voran getrieben. Vier Animationen (Jab, Kampfstellung, Schritt vorwärts, Schritt rückwärts) wurden erstellt. In diesem Beitrag geht es um die Texturierung des Charakters.

In Blender kann man ein 3D-Modell auf verschiedene Art und Weise texturieren. Wir haben uns für eine vergleichsweise einfache Methode entschieden. Nämlich dem UV-Mapping per Bearbeitung des gemappten Bildes. Wie sind wir dabei vorgegangen?

1. Im Edit Mode haben wir den Charakter mit Hilfe der Markierung von Edges in verschiedene Flächen eingeteilt. Diese Linien haben wir zu Seams gemacht (ctrl + E --> Mark Seam).

Der Charakter wurde so in Seams aufgeteilt, damit verschiedene Flächen entstehen, die man entsprechen Texturieren kann. Also Flächen, welche dieselbe Textur bekommen.

Eine sinnvolle Aufteilung wäre zum Beispiel: Gesicht + Hals, Haare, Oberkörper (T-Shirt), Arme, Hose, Schuhe, Beine, etc. Des weiteren hilft es natürlich, wenn man sich schon bei der Modellierung Gedanken über die Textur macht. In meinem Fall habe ich erst jetzt bemerkt, dass ich meinen Charakter im Grunde nackt modelliert habe, er aber was anhaben soll. Ich habe es mir einfach gemacht und an den Grenzen von T-Shirtärmel zu Arm und Hose zu Bein, einfach per Loopcut und verziehen der Edges, Enden der Kleidungsstücke geformt. Dieses Vorgehen ist nicht Ideal, aber mehr oder weniger aus der Not entstanden.

2. Hat man das komplette Modell mit Seams markiert, muss man alles markieren ("A") und unwrappen ("U" --> Unwrap). Blender erstellt dann ein Image des geunwrappten. Dieses kann man im UV/Image Editor betrachten und bearbeiten. Hierzu öffnet man ein zweites Fenster, indem man das Dreieckssymbol im aktuellen Fenster einfach so weit wie nötig nach links zieht. Im neuen Fenster muss man dann über das Symbol links unten neben View die Ansicht auf UV/Image Editor umstellen. So hat man im linken Fenster das 3D-Modell und im rechten Fenster den UV Editor mit dem geunwrappten Bild.

Auf den ersten Blick ist es schwer zu wissen/ zu sehen, was welches Körperteil darstellt. Dazu kann man im UV/Image Editor den Button "Keep UV and Edit mode mesh selection sync" aktivieren. Danach erscheint alles was man links (3D-View) markiert, auch rechts (UV/Image Editor) markiert. Das ist sehr hilfreich, um die einzelnen Flächen zu sortieren.

3. Anschließend geht es wirklich an das Sortieren. Ich habe geschaut, welche Flächen was darstellen und sie dementsprechend verschoben. Flächen mit gleichen Texturen kann man theoretisch auch übereinander legen. Flächen mit unterschiedlichen Texturen muss man aber voneinander trennen. Bei mir hat Blender beispielsweise die Hose auf das T-Shirt gelegt. Im Edit Mode habe ich alle Flächen der Hose markiert und diese in der UV Ansicht durch verschieben und rotieren auf eine andere Stelle gelegt. Hat man alles gut platziert, kann man das Image exportieren ( UVs --> Export UV Layout). Blender speichert das Bild als png.

4. Jetzt kann man das UV Layout, also das Bild, in einem Bildbearbeitungsprogramm bearbeiten. In Photoshop habe ich die Flächen dementsprechend übermalt. Dazu habe ich die Arbeitsfläche auf einer Seite verdoppelt. Jetzt konnte ich mir an diese Stelle Texturen laden (Gesicht, Shirt, Hose, etc.) und mit dem Ausbessern Werkzeug die Flächen in der gewünschten Textur bemalen.

Anschließend habe ich die Arbeitsfläche wieder halbiert und das Bild am selben Ort und unter dem selben Namen, wie zuvor in Blender erstellt, gespeichert. Wenn ich jetzt Blender geöffnet habe, konnte ich im UV/Image Editor das bearbeitete Bild sehen.

5. Nun muss man dem Modell ein Material zuweisen. Über den kleinen Kreis im Menü der rechten Spalte. Anschließend kann man das Material mit der Textur verknüpfen.

Ich habe dem kompletten Charakter nur ein Material zugewiesen. Natürlich ist es sinnvoll, den einzelnen Regionen unterschiedliche Materialien und entsprechende Texturen zu zuweisen. So kann man die Schuhe beispielsweise glänzender und mit einer höheren Lichtreflexion versehen oder die Haut eine mattere Materialeigenschaft zuordnen. Diese Schritte sind aber leider der fortschreitenden Zeit geschuldet.

Mein texturierter Charakter sah dann so aus:

Fazit: Diese Methode der Texturierung ist nicht allzu schwer und im Prinzip relativ schnell durchzuführen. Mit dem Ergebnis bin ich in sofern zufrieden, dass man erkennen kann, dass es sich um ein Person handelt. Auf jeden Fall besser, als ein Modell ohne Textur. Jedoch kann man gerade in der Texturierung beeindruckende Dinge leisten. Wie Joshua Alger in diesem Video, sein Gesicht anhand von eigenen Fotos texturiert, ist schon beeindruckend.
Wie angesprochen, ist vor der Modellierung schon zu beachten, wie das Modell am Ende texturiert werden soll. Auch ist klar, je besser das Modell modelliert wurde, desto einfach und schöner lassen sich Texturen anbringen.

Animation - Jab

"Ein Jab beim Boxen ist eine abrupt geschlagene Gerade mit der Führhand. Als Führhand wird die meist etwas schwächere Hand bezeichnet, die nicht als Schlaghand eingesetzt wird, also bei Rechtshändern üblicherweise die Linke und umgekehrt."

Für unser Projekt haben wir als Schlag zuerst einmal den Jab gewählt. Zum einen ist er eine Basic-Bewegung beim Kampf und zum anderen ist er nicht so schwer zum animieren. Um den Bewegungsablauf beim Jab realitätsnah animieren zu können, habe ich einige Boxvideos studiert. Im Prinzip bleibt der gesamte Körper bis auf den Schlagarm ziemlich ruhig. Demnach habe ich alle anderen Bones bis auf den Arm auch nur minimal animiert. Hier das Ergebnis.

Charakter animieren

Nachdem erfolgreichen riggen, soll sich der Charakter nun auch bewegen. Dazu kann man in Blender in den Dope Sheet Editor wechseln und die Bones je nach Frames neu positionieren. Hier sind nun die Steuerbones von großem Vorteil, um nicht jeden Knochen einzeln positionieren zu müssen.

Das folgende Video-Tutorial gibt einen Einstig in das Thema der Animation in Blender.

Im Prinzip wird am Anfangs-Frame eine Ausgangsposition der Bones geschaffen. Nach beliebig vielen Frames können die Bones in eine neue Position gebracht werden. Der Übergang von z.B. Frame 1 nach Frame 25 wird automatisch gestaltet (Hier kann man natürlich zwischendrin auch weitere Frames einsetzen.)

Dabei kann man auch mehrere Actions erstellen und speichern. Für unser Projekt brauchen wir im Grunde mindestens vier verschiedene Actions: 1. Kampfsposition, 2. Vorwärts Bewegen, 3. Rückwärts Bewegen, 4. Schlag.

Wie ich die Kampfposition animiert habe, kann man im folgenden Video sehen.

Tip: Ich habe als weitere Action noch die Ausgangsposition abgespeichert, damit ich immer wieder darauf zurückgreifen kann, falls was schief geht.

Charakter riggen

Um den Charakter später bewegen zu können, muss man ihn erst riggen. Mehr oder weniger weisst man dabei dem Körper ein Skelett zu. Das ganze läuft bei Blender über den Armature Modifier. Mit Shift-A kann man die einzelnen Bones hinzufügen. Wie man das am besten macht zeigt das folgende Tutorial. (An dieser Stelle sollte ich erwähnen, dass man beim Riggen wirklich exakt vorgehen muss. Für Einsteiger sind dabei die kurzen, 20 minütigen Toturials, oft nicht ausreichend. Auch wenn mein Tutorial am über eine Stunde geht und ich dafür fast 5 wirkliche Stunden gebraucht habe, soll das nicht abschrecken. Hier wird wirklich alles sehr gründlich erklärt - auch mit Hintergrundinfos.)

Einen Knochen (=Bone) fügt man in Blender im Edit-Mode nach der Aktivierung des Armature Modifiers mit Shift-A ein. Diese baut man je nach Detailgrad zu einem Skelett zusammen.

Hierbei sollte man auf mehrere Sachen achten: Die Bones sollten schon bei der Erstellung nicht verdreht (rotiert) werden. Man kann sich die Auslage der Bones mit Axis anzeigen lassen. Die Bones sollten auf jeden Fall beschriftet werden. Auch hier kann man erst die eine Seite machen. Bei mir die linke Seite. Dabei habe ich alle Bones mit der Endung .L (zum Beispiel Oberschenkel.L) beschriftet. Das erkennt Blender automatisch und man kann die Bones der linken Seite duplizieren, rotieren und die Namen dann automatisch Umbenennen lassen. Blender ersetzt dann das .L durch ein .R.

Um Bone Abhängigkeiten zu Bestimmen kann man Bone Constraints adden. So kann man den Knochen im Pose Mode Funktionen und Abhängigkeiten hinzufügen. Man kann auch sogenannte Steuerbones hinzufügen. Das sind Knochen außerhalb des Körper mit denen man dann später bei der Animationsgestaltung bestimmte Gelenke einfacher ansteuern kann. (Diese Steuerbones kann man wie hier im zweiten Bild dargestellt, auch ganz individuell gestalten)

Im Weight Paint Mode kann man dann mit Hilfe von Farbgestalltung festlegen, welche Körperregionen sich wie stark mitbewegen. Blau steht hierbei für keine Bewegung und Rot für maximale Bewegung. So kann man Körperregionen je nach Knochen bemalen, wie stark sie in Abhängigkeit verformt/bewegt werden.

Die Bones kann man in verschiedenen Arten darstellen. Octahedral ist die Standardeinstellung, die man auch auf den meisten Screenshot hier sieht. Daneben gibt es noch Stick, Envelope, Wire und B-Bone. Mit dem letztgenannten kann man Bones im Nachhinein nochmals in mehrere Segments teilen. Dies verschönert beispielsweise die Rotationsbewegung des Handgelenks.

Das Endergebnis meines geriggten Charakter sah dann so aus und ließ sich ganz gut bewegen.

Augen einsetzen

Schlussendlich fehlen noch die Augen im Gesicht. Um Zeit zu sparen habe ich mir hier passende Augen im blend Format heruntergeladen und in mein Projekt übertragen.

Es war gar nicht ganz einfach die Maske um das Auge so anzupassen, damit das Auge dort gut Platz findet. Mehrfach habe ich die Planes um das Auge gelöscht und neu erstellt.

Tip: Planes in der Augenhöhle nach hinten extruden, damit keine freien Zwischenräume zwischen Auge und Gesicht erkennbar sind.

Ohr modellieren und an Kopf mergen

Bisher hat mein Kopf links und rechts noch ein Loch. Das Ohr extra zu modellieren und dann nachträglich einzufügen scheint laut diversen Tutorials die elegantere Variante. Dazu habe ich das Tutorial von Joshua Alger benutzt, welcher mir auch schon beim erstellen des Gesichts geholfen hat.

In diesem Tutorial werden zuerst Planes nach einem farblich bearbeitetem Background Foto erstellt.
Die Vorlage ist nachfolgend oder unter diesem Link frei erhältlich.

Die Planes werden anschließend zu einem 3D-Modell extruded. In vielen einzelnen Schritten hat man ziemlich schnell ein ansehnlich Ergebnis erreichen.

Die Datei sollte anschließend als normale Blender-Datei abgespeichert werden. Im Blender Projekt mit dem Gesicht und Körper kann man nun das Ohr (im Object-Mode) unter File --> Append einfügen. Nun muss man es noch zurecht skalieren und an die richtige Stelle verschieben. Anschließend kann man Ohr mit Kopf per Join verbinden.

Lücken zwischen Kopf und Ohr lassen sich per Merge zweier Punkte verbinden. Hiebei hat mir dieses Tutorial von Joshua Alger weitergeholfen.

Restlichen Körper modellieren

Vom Kopf aus wurde der weitere Körper  nach unten modelliert. Hier war das folgende Tutorial sehr hilfreich.

Mit Extrude kann man aus den entsprechenden Flächen neue Elemente ziehen. Nach dem Rumpf kamen die Beine und Füße. Wichtig dabei ist, dass man immer einige Schritte im Voraus denkt. Welches Körperteil kommt als nächstes? Aus welchen Elementen besteht ein Fuß? Oder ein ein Zeh? Hier kann man natürlich auch von ganz genau bis pi mal Daumen modellieren. Ich habe mich eher an das Letztere gehalten, da wir mit dem modellierten Körper ja noch viel vorhaben.
Anschließend ein paar Eindrücke von meiner bisherigen Arbeit.

Fazit: Wie bereits erwähnt, ist hier das Vorausdenken essentiell. Auch ist es nicht leicht die richtigen Dimension der Größe der einzelnen Körperteile zu gestalten. Bei meinem Modell ist das am zu kräftigen Rumpf, an den zu dünnen Beinen und den zu kleinen Händen ganz gut erkennbar.
Der beim Gesicht angewandte Subdivision Surface Modifier, welcher für mehr Polygone gesorgt hat, war bei der Körpergestaltung eher nachteilig. Ich hatte teilweise zu viele Flächen, was beim Extruden gestört hat. Deshalb habe ich oft einige Flächen gelöscht und durch eine einzige ersetzt.
Was auch hilfreich war, ist das Cutten (Shortcut K zum Punkte Setzen und dann mit Backspase bestätigen) von Flächen. So konnte ich den Körper schlussendlich doch einigermaßen angenehm nach dem Tutorial gestalten.