game maker
Gebruikersnaam:
Wachtwoord:
Home Info Forums Help
Welkom, Gast. Alsjeblieft inloggen of registreren.
+  Forums
|-+  Werken met Game Maker
| |-+  Tutorials en Uitbreidingen (Moderator: Maarten Baert)
| | |-+  [Tut] Pixelart; het is ook kunst
Pagina's: [1]
« vorige volgende »
Print
Advertenties

TrevoriuS
Gebruiker

Offline Offline

Berichten: 1687


« Gepost op: 18 Mei 2008, 19:16:19 »

Deze tutorial is niet software specifiek, en is bedoeld om beginners op weg te helpen, en niet-beginners mijn visie op pixelart (en game art) te geven. Moge jullie ervan leren Blij Dit is zeker een flinke lap text, lees hem dan ook rustig door, en probeer tussendoor misschien wat dingen uit.

Succes en veel plezier,
TrevoriuS


Index
Pixel art, wat is het eigenlijk?
Basis elementen
Sprites
Tiles & achtergronden
Perspectieven
>Topdown
>Platform
>Isometrisch (1:1)
>Isometrisch (2:1)
Pixel technieken
>Dithering
>Anti alias
Animatie
Perspectief
Nawoord
Externe links
Credits

Pixel art, wat is het eigenlijk?
Pixel art wordt eigenlijk heel vaak verkeerd uitgelegd. Veel mensen gebruiken pixels en kleine afbeeldingen omdat het die 'coole ouderwetse look' heeft. Zelfs spel bedrijven hebben soms geen flauw idee wat pixel art is. Ik ben ooit bij een bedrijf geweest dat me uitlegde dat ze isometrische pixel art gebruikten. Wat ze eigenlijk gebruikten waren photoshop tekeningen, die ze omlaag scaleden. Daarnaast, waren de achtergronden en tilesets gewoon vierkant, en dus niet in een isometrisch perspectief. Je moet trouwens wel weten dat deze tutorial niet uitlegt hoe je een bepaald programma gebruikt. Pixelart kan zelfs gemaakt worden in microsoft paint, zonder problemen eigenlijk.

Als jij nou ook niet precies weet wat isometrisch is, laat het me uitleggen. Eigenlijk is het niet eens een pixel art onderdeel, maar is het uitgevonden door architecten. Het isometrische perspectief begint bij een topdown tekening. Teken iets 1:1 na, dit betekent dat hoogte en breedte op hun ware grootte moeten zijn gebaseerd. Dus een 40 x 30 cm balk kan je wel op schaal tekenen, maar dan moet dit dus ook 8 x 6 of 4 x 3 cm zijn, omdat de lengtes evenveel verkleind moeten worden. Voeg daarna 2 zijden toe. Deze zijn verticaal wel op schaal, maar horizontaal zijn ze aangepast om aan te sluiten op de top view. Meer hierover later.

Dus laten we nu verder gaan op wat pixel art betekent. Het idee is dat je weinig kleuren gebruikt, vroeger om limieten van ouderwetste systemen te omzeilen, en tegenwoordig om te weten wat je doet. Als je in zwart wit en grijs tekent is het makkelijker om fouten te vinden en corrigeren dan wanneer je met 200 kleuren werkt. Zeker in ouderwetse games had je met kleinere formaten te doen (16x16 pixels is normaal, hoewel het begon met 8x8 pixels). Dan heb je dus maar 16x16=256 pixels om te vullen. Met zo weinig ruimte, kan je er maar beter veel tijd in stoppen. Grotere tekeningen kosten meer tijd, omdat er meer pixels fout kunnen zijn. Dat is dus een voordeel van pixel art.

Tegenwoordig, wanneer je photoshop gebruikt, openen artists een 2000x2000 pixels grote file en beginnen te tekenen. Zo realistisch als ze kunnen. Hiervoor heb je veel oefening nodig, want deze mensen weten van te voren wat het resultaat is als ze een bepaalde kleur ergens neerzetten. Ze weten hoe ze kleuren moeten combineren en ze kennen de regels van perspectief en licht. Als je niet zo goed weet waar je mee bezig bent, is het makkelijker om klein te beginnen, en dan bij voorkeur in pixels. Met pixels leer je veel over errors vinden en oplossen, en over kleuren. Het voordeel is dat in zo'n kleine ruimte het minder tijd kost om errors te fixen.

Dus het resultaat is, dat echte pixel art betekend dat je weet wat je doet, omdat je werkt met limieten in kleur en formaat. Je kan dan ook eindeloos corrigeren omdat een enkele pixel zoveel invloed heeft op het eindresultaat. Je hoeft geen uur te spenderen om een schouder mooier te maken, maar je spendeert dat uur om 5 dingen uit te proberen op die schouder en te leren van de resultaten, zodat je de volgende keer meteen weet wat het mooiste wordt - ook als je op groter formaat tekent. Een laatste voordeel van pixelart is dat meer mensen de moeite nemen om kritiek te verwoorden door jouw afbeelding aan te passen.

Basis elementen
De basis van pixelart, wat het herkenbaar maakt als zijnde pixelart, is een laag kleur gebruik. Wanneer je op 16x16 pixels werkt, heb je geen 256 kleuren nodig (1 kleur per pixel). Hergebruikt kleuren, maak geen dingen vervaagd maar geef vlakken een duidelijke kleur, zodat ze herkenbaar blijven. 16 kleuren is al veel op zo'n klein formaat! Een ander voordeel van weinig kleuren in je art is dat je ze makkelijk kan vervangen en met het palette kan spelen tot je het mooi vind.

Naast dit alles, is pixelart gewoon net als ieder vorm van kunst. Je moet dingen bekijken en bestuderen om de vormen en details in kaart te brengen. Het kost tijd om te leren tekenen, net als het tijd kost om the leren pixelen. Het verschil is alleen dat pixels veel makkelijker aan te passen zijn, en expirimenteler werken. Het is dus makkelijker om controle te hebben over wat je doet. Als je vroeger wel eens observatief hebt getekend, zal je waarschijnlijk beter zijn dan de meeste beginnende pixelartists. Eigenlijk, als je echt een goede tekenaar bent, gaat iets met een potlood tekenen sneller dan iets in pixels maken omdat je al weet wat je als eindresultaat wil/moet hebben.

Sprites
Pixelart wordt voornamelijk gebruikt in games. Daarom, een onderwerp over sprites. Wanneer je een object voor een spel tekent (dus een sprite) moet je nadenken over wat het object moet 'doen'. Allereerst moet de speler weten wat het object is (gelijkenis), daarna moet het er realistisch en overtuigend uitzien, wat je doet door de volumes goed aan te geven. Een stick-figure kan geinterpreteerd worden als een mens (gelijkenis), maar als je er spieren op tekent lijkt het toch een stuk realistischer (volume). Om het volume te illustreren kan je het beste 4 tot 5 kleuren gebruiken om de basis schaduwen aan te geven, gebaseerd op 1 enkele lichtbron.

Dus als we een mens hebben, met licht van bovenaf, zijn de schouders lichter. Daarnaast zullen de sleutelbeenderen en borstspieren opvallen. Verder zijn er highlights op de heupen, bovebenen en voeten. De armen zullen misschien wat licht vangen bij de onderarm en hand. Dit is kennis van mensen, met bepaalde details die je moet leren of observeren. Vaak is tekenen wat je weet makkelijker dan tekenen wat je ziet, omdat door naar een mens te kijken je niet alle informatie van zijn botten kan achterhalen, en dus niet precies weet hoe het nou in elkaar steekt.

Door dit te tekenen, geef je het volume aan. Je kan iets niet opbouwen uit lijnen omdat objecten in het echt ook niet bestaan uit lijnen. Lijnen geven een plat vlak aan, terwijl licht en schaduw een 3e dimensie opwekt. Als je weet waar je licht vandaan komt, en je genoeg informatie hebt over het object wat je tekent door referentie te zoeken, en het liefst het object zelf, kan je door logisch te denken, en goed en lang te observeren, uitvinden wat de vorm van het object is.

Licht en schaduw volgen de vorm, dus geef de vorm aan, probeer geen diepte op te wekken om maar diepte te hebben in de vlakken die je met lijnen aangeeft, probeer je object te tekenen zonder lijnen, met alleen zijn diepte, door het licht zo realistisch mogelijk na te tekenen. Vergelijk je getekende resultaat met het object, of de foto die je ervan hebt als referentie. Probeer de verschillen te minimaliseren, en als je denkt dat je het goed gedaan hebt, houd ze goed langs elkaar, of misschien zelfs over elkaar.

Het is een kwestie van zo vaak natekenen dat je het uit je hoofd leert en geen referentie meer nodig hebt. Als je referentie zoekt, hoef je het object niet uit je hoofd te kennen, maar als je veel hebt geoefend, kan je het object natekenen vanuit een andere hoek dan de foto, of met andere lichten die het object zijn volume accentueren.

Begin nooit met de details, zet de vorm uit voor je kleine elementen gaat toevoegen. Oefen ontzettend veel en voeg misschien pas details toe als je genoeg hebt geoefend met de ruwe vorm uitzetten. Wat vooral belangrijk is, is dat je de hoek van een 'lijn' ten op zichte van de horizon niet verkeerd inschat. Als je deze principes begrijpt en onder de knie hebt, kan je dingen van de zijkant tekenen, met een foto die ergens schuin van voren is gemaakt (je moet uiteraard zien wat je tekent, maar met oefening kan je het manipuleren in iets wat ook correct is).

Dus als we volumes goed kunnen uitzetten, ziet het er nog steeds saai en grijs uit. Dus we zullen maar wat kleuren toevoegen. Maar omdat dit pixelart is, moeten we realiseren dat we maar weinig kleuren kunnen gebruiken. De meeste pixelartists maken wel gebruik van de moderne computer, want vroeger had je een bepaald aantal kleuren, en meer waren er niet. Nu heb je eindeloos veel kleuren, en je gebruikt er weinig, maar kan dus nog wel kiezen wat je wilt. Het mooiste is wel wanneer je in een spel een palet van onder de 32 kleuren gebruikt, en dan ook in je hele spel niet meer kleuren stopt.

Let wel op dat dit voorbeeld me minder dan 20 minuten kostte. Daarna had ik er geen geweldig gevoel over en gebruikte ik het figuur om een skelet eruit te maken. Skeletten zijn soms namelijk veel boeiender om te tekenen! (vind ik dan). Op deze manier kunnen we met slechts 5 kleuren, en commentaar van andere artists, een mooi uitziend skelet maken.


Tiles & achtergronden
Als we dan toch spellen gaan maken, hebben we ook tiles en achtergronden nodig. Afhankelijk van wat voor spel je maakt, gebruik je een van deze twee, en soms allebij. In een platform spel kan je tiles gebruiken voor de dingen waar de speler op kan lopen. Dan kan je achtergronden gebruiken om de sfeer te bepalen (en misschien ook wel voorgronden). Dit kan betekenen dat je op houten blokken en met mos begroeide stenen loopt, en op de achtergrond een grote jungle ziet, met misschien op de voorgrond nog wat planten die uitsteken. Daartegenover kan je in een topdown game juist tiles gebruiken als achtergrond (zoals gras, wegen en gebouwen) en sprites voor de bewegende objecten. De tiles in dit laatste genre werken meer als achtergronden, en moeten daarom ook zoveel als de regels van achtergronden volgen.

Een achtergrond moet de sfeer bepalen, en bij het spel passen. Daarnaast moet het eruit zien als een achtergrond. Een achtergrond maak je minder opvallen zodat je goed ziet wat de sprites zijn en wat de tiles zijn. Manieren om iets minder opvallend te maken is door het grijzere kleuren te geven, een lager contrast te geven, en het te vervagen naarmate de onderdelen verder weg van het speelveld komen. In die jungle bijvoorbeeld, laat het eruit zien alsof het mistig is. Bomen en planten die verder weg zijn moeten een lager contrast en grijzere tonen krijgen.

Sprites kan je onderscheiden door ze een outline of een donkere rand te geven. Dit is gebaseerd op 2 feiten. Een feit is dat een object nooit zo perfect plat en glad is dat de randen licther zijn dan de rest. Je ziet (bijna) altijd wel een stukje van het object wat donkerder is. Een ander feit is dat wanneer voorgrond objecten shilouette achtig zijn, tiles realistisch maar wel mooi in elkar overlopend zijn, achtergronden vervaagd en grijs zijn, een sprite dus wel eruit moet springen om zichtbaar et zijn. Dit doe je door het af te scheiden van de rest met een outline, en door het niet even gedetailleerd te maken als de rest, of andersom natuurlijk.

Nu iets meer over perspectieven...
Topdown
Topdown is ontzettend simpel. Een kubus in topdown is een vierkant [img 1]http://. Hoewel, om details in een topdown perspectief duidelijk te maken, is het handig om een idee uit te tekenen of fotos te nemen van het object in een 3 dimensionaal perspectief. Bijvoorbeeld als je een machine van topdown tekent, kan het zijn dat in 1 van de zeides lampjes zitten. Die teken je niet, maar het licht heeft wel effect op de top view. Als je de machine eerst in een ander perspectief tekent denk je pas aan het feit dat daar lichten kunnen zitten.

Platform
Denk aan topdown, en voer het nu uit in de side view. Het is echt niet moeilijker dan dat, behalve dat je met meer lagen kan werken. Je kan een tileset hebben voor objecten waar je op loopt, een tileset voor objecten waar je achterlangs loopt (foreground), een tileset voor omgeving objecten die vlak bij je zijn (achtergrond) en een achtergrond die meer diepte geeft en de lege ruimte opvult (skyline / depth).

Isometrisch (1:1)
Dus dit is een vierkant, wat eigenlijk een topdown kubus is:

Dan kunnen we de kubus draaien om meer ervan te laten zien, maar dat betekend dat we perspectief toevoegen. Perspectief is eigenlijk het uitrekken of indrukken van dingen. Dat is het enige effect. Maar daarmee verliezen we wel detail. Als we een kubus hebben waar iets op moet staan, kunnen we maar beter zo veel mogelijk van de kubus in de sprite stoppen. Daarom zijn architecten begonnen met het gebruiken van een isometrisch perspectief. We kunnen een zijde aan de topview toevoegen, zonder deze uit te rekken.

Om dit resultaat te verbeteren moeten we wel de topdown tekening 45 graden draaien en 2 zijdes toevoegen in plaats van 1. Met 3 zijdes van een object heb je alle informatie die je nodig hebt. De vorige versie van de kubus had net zo goed een gat in 1 van de zeikanten kunnen hebben. Maar deze laatste tekening laat zien dat we echt een kubus zagen in de voorgaande afbeeldingen.


Isometrisch (2:1)
Het isometrische perspectief geeft wel een raar en onnatuurlijk uitgerekt uiterlijk. Daarom, als we de topdown afbeelding nemen en deze verticaal 50% kleiner maken, en dan de isometrische regels toepassen, krijgen we een veel natuurlijker resultaat. Spellen begonnen met 1:1 isometrisch perspectief, 45 graden gedraait. Op deze manier bleef de grid bestaan uit regelmatige vierkanen, in plaats van diagonalen. Later, wanneer de grid geroteerd kon worden, kwamen artists tot de conclusie dat dit er onnatuurlijk uit zag, en is 2:1 isometrisch ontwikkeld. Hoewel het onmogelijk is om 2:1 isometrische sprites te draaien, omdat de grid dan uit ruiten gaat bestaan.

Dit: is beter dan dit:
Dit: is beter dan dit:
Dit: is beter dan dit:

Een laatste ding over isometrische graphics. Ik durf te stellen dat in het 1:1 (gedraaid) isometrisch perspectief (deze: [img 7]http://) de diagonale lijn 60% van de eigenlijke lengte moet zijn (de voorbeeld kubus is 10 pixels op iedere zeide, maar in het voorbeeld zijn de diagonale lijnen slechts 6 pixels).

Pixel technieken
Dithering:
Dithering is een term die staat voor kleuren 'mengen'. Je plaatst pixels zo ten op zichte van elkaar dat als je uitzoomed het er uit ziet als een andere kleur. Het gevaar hiervan is echter wel, dat het ook textuur toevoegt. De kleur zal eruit zien als het eindresultaat, dus zwart en wit samen worden grijs, maar het combineerd nooit perfect, waardoor je een soort ruw effect krijgt. Daarom is het slimmer om geen volledige oppervlakken te ditheren, maar alleen kleurovergangen. Ook is het beter om metalen of glazen objecten niet te ditheren.

Een manier om de textuur van ditheren te verminderen is door het willekeuriger te doen. Dit betekend dat je niet 2 kleuren om en om combineerd, maar soms grotere gaten openlaat enzovoorts. Ookal is het op deze manier is het wel moeilijker om nette overgangen te creeren, het geeft wel een 'natuurlijker' gevoel van textuur.

Deze voorbeelden maken overloopen tussen grote vlakken, dus beeld je in om het tussen 2 kleuren van een sprite te doen, terwijl het grootste deel van het vlak gewoon een effen kleur heeft. Nog 1 regel over ditheren op kortere stukken:


Anti alias:

Afbeeldingen zeggen meer dan woorden. In de tweede en derde afbeelding de lijn is gewoonweg softer dan in de eerste. Anti alias betekent dat je pixels tegenover elkaar afweegt. Dat betekent dan weer dat je 2 tot 4 pixels neemt en ze in 1 gemiddelde kleur combineerd zodat je nog maar 2 pixels nodig hebt. Wanneer een zwarte lijn op een wit oppervlak niet helemaal recht is, ziet het er hoekig uit en heeft het een 'trap' effect. Je kan de stappen waarin de lijn klimt of daalt tellen. Om dit te voorkomen moeten we gewoon de achtergrond en de lijn kleur bij de overgangen combineren in een gemiddelde kleur, die de overgang maskeert.

In het eerste voorbeeld is de lijn softer gemaakt, in het tweede voorbeeld is ook nog het trapsgewijs buigen voorkomen. Dit betekent dat als je een rij kleuren hebt die in een curve lopen, je het trap effect tegengaat door alle kleuren een beetje op te schuiven en in elkaar te laten doorlopen. Hier is een beter voorbeeld.


Animatie
Wanneer je objecten begint te verplaatsen, gaan de kleine details verloren in de beweging. Als je een karakter van 30x60 pixels hebt, waarin je zelfs de gulp hebt getekend, kan hij er wel goed uitzien, maar zodra je begint te animeren zullen deze details verloren gaan, en misschien zelfs de animatie minder duidelijk maken. Het is misschien wel mogelijk om een stilstaande sprite een hoger detail te geven dan een bewegende sprite. Ik heb dit nog nooit geprobeerd, misschien kan jij het!

Het is vaak handig om ruwweg je animatie uit te schetsen, Sommige mensen gebruiken stick-figures, anderen gewoon basisvormen, anderen doen weer allebij. Ikzelf gebruikt meestal basisvormen, omdat ik animatie met iets anders dan mensen heb geleerd, en omdat ik het op die manier handiger vind om kleding te animeren. Dus laten we nu eens dat skelet van eerder nemen, omdat dit eigenlijk een stick figure is, heb ik niet veel keus dan het op die manier animeren. Dus laten we hem amar eens laten lopen. Als je loopt heb je twee extremen, waarin je je voorste been net neerzet en je achterste been is uitgestrekt, en dat herhaald met je benen omgewisseld. Dan zijn er de overgangen (met alleen de extremen lijkt het alsof je op ijs loopt), wanneer je standbeen recht onder je is en je achterste been langs je lichaam is, op weg naar voren.

Om het dan netjes af te ronden, kunnen we ertussenin nog frames toevoegen, zodat de animatie gewoon wat vloeiender loopt dan dat hij nu doet. Dus, 2 frames is minimaal en ziet er slecht uit, 4 frames laat de volledige loopbeweging zien, maar met 8 frames ziet her er gewoon beter uit. Natuurlijk kan je doorgaan met frames toevoegen, zodat je aan het einde de lichaamsdelen slechts 1 pixel per frame beweegt. Maar waarom zou je, als de helft van dat werk toch verloren gaat in de snelheid van de beweging. Natuurlijk kan het wel handig / mooi zijn als je een slo-motion of bullet time effect in je spel of animatie hebt.

Dus, laat deze afbeeldingen je verder helpen...




Platform animatie
Toegevoegd op: 22/07/2008
Ik heb onlangs tijd besteed aan animaties voor platform games, en heb een goede 'workflow' gevonden. Wat ik doe is eerst de stilstaan sprite maken. Vervolgens, teken ik daar de 'stick figure' overheen, zodat de proporties kloppen voor ik ga animeren. Dan animeer ik de stick figure in 4 tot 8 frames.

Ik gebruik hierbij meestal deze afbeelding als referentie:

Hij komt uit een engelstalige tutorial die onderaan staat vermeld (Animation basics).

Als ik de stick figure heb geanimeerd, ga ik deze frame voor frame veranderen in de eigenlijke sprite:
1) Zet stilstaande sprite met hoofd op juiste hoogte
2) teken grondlijn op basis van de stickfigure, als deze door de benen of voeten gaat, stukje weglaten
3) Teken 1 arm en 1 been, uiteraard van de  zelfde kant
4) Herhaal dit proces met de andere arm en het andere been zodat je 2 sprites krijgt
5) Kopieer deze en verduister de armen en benen bij 1 van de 2 versies
6) Plak nu linkerarm/linkerbeen over verduisterde rechterarm/rechterbeen

Dit voorbeeld illustreert het idee, het is echter voor een platform game waarbij de arm via code word toegevoegd, dus dit is alleen een animatie voor het been (en torso):


Perspectief
Als je bijvoorbeeld een achtergrond wil maken die stilstaat in je spel, of een menu achtergrond, of gewoon wil oefenen met tekenen in het algemeen, is het ook belangrijk dat je perspectief begrijpt. Onderstaande afbeelding zal je de basis uitleggen:

De basis is dus eigenlijk best simpel, en het is toepasbaar op heel je scene. Iets wat mogelijk wat lastiger is, is cirkels en curves tekenen in perspectief. Wat hierbij goed werkt is een blok of vlak uitzetten, met de hoekpunten als punten die overeenkomen met de curve of cirkel, zodat je een aantal punten hebt om vandaan te tekenen, voor je de eigenlijke lijn neerzet.

Nawoord
Dit was het wel zo'n beetje, de basis. Ik wil nog enkele dingen goed benadrukken voor je me weer verlaat. Als je iets wil tekenen, zoek het voorwerp op, of zo veel mogelijk foto's. vergelijk jouw resultaat met het object, en zorg dat je geen details over het hoofd ziet. Als je dit vaker doet, zullen je objecten er minder leeg uit zien omdat je meer details vind en erin kan stoppen. Natuurlijk is het onmogelijk om alle details erin te stoppen, maar vaak helpt het wel in herkenbaarheid.

Op een gemiddeld game character, zijn de naden, zomen en gulp in een broek gepixeled in de sprite, terwijl 1 pixel misschien wel 10 bij 10 centimeter groot is, wat dus onrealistisch is, maar toch logischer overkomt dan wanneer het een leeg vlak zou zijn. Je moet echter wel goed weten waar je moet stoppen, en kritiek en commentaar van anderen (liefst artists) vragen of ze fouten zien in je werk, of om dit soort specifieke dingen te beoordelen.

Wat goed is om te doen naast veel referentiemateriaal zoeken, is zorgen dat het shilouet al herkenbaar is. Je moet zien wat iets voorstelt met alleen de buitenste rand (outline of shilouet, dit zijn 2 verschillende dingen dus raak niet in de war, maar in 2D komen ze op hetzelfde neer). Wat ook nuttig is aan referentiemateriaal, is dat je veel voorkomende omgevingen ziet.

Om je object niet levenloos en saai te laten lijken, kan je meer dan 1 lichtbron in je sprite toevoegen, en reflecties van de omgeving. Chroom is grijs, maar reflecteerd heel erg, dus een chromen object in een bos, lijkt bijna helemaal groen. Ookal komt het eindresultaat niet in deze omgeving te staan, of kloppen de lichtbronnen niet helemaal omdat ze niet in beeld zijn en later in het spel niet terugkomen, is het toch vaak mooi om hier goed over na te denken, omdat het meer diepte aan je graphic toevoegd.

Nu je tot hier bent gekomen, laat me a.u.b. via PM of dit topic weten wat je ervan vond, wat je mist, of het je heeft geholpen, of dat je vind dat ik ongelijk heb. Ik sta open voor input en meningen,
-TrevoriuS

Onderstaande links leiden allen naar engelse sites
Helpful things
Here are some tutorials that cover pixelart and general art principles, which can both help you more in this.
Basic art principles
All you need to know about light
Animation basics
Toons and animating

Some things to enjoy
One
Two
Three

Communities
Pixeljoint
Pixelation

Deze tutorial is gemaakt door TrevoriuS

« Laatste verandering: 26 Februari 2009, 20:59:09 door TrevoriuS »

Naar boven Gelogd

ikbenbram
Gebruiker


Offline Offline

Berichten: 101

strong game productions@


« Antwoord #1 Gepost op: 7 Augustus 2008, 13:15:24 »

wow dit heeft me zoveel geholpen thx
rating:
9.7/10

onntopic: wrm staat er niks over shaden?
en ik vind dat er wel wat meer over animatie bij mag staan ;P

« Laatste verandering: 7 Augustus 2008, 13:20:00 door ikbenbram »

IK GA WEER ACTIEF OP HET FORUM POSTEN KTHX

bezig met nieuw spel Scrap metal 5% nieuws: character engine half klaar Blij
Naar boven Gelogd

TrevoriuS
Gebruiker

Offline Offline

Berichten: 1687


« Antwoord #2 Gepost op: 7 Augustus 2008, 13:36:26 »

Animatie is zo afhankelijk van de sprite en style, dat dit alles is wat ik kan zeggen wat overal toepasbaar is. Daarnaast heb ik het al gehad over obervatie, dat kan je ook gebruiken in beweging, en perspectief als we het er toch over hebben (observatie that is). Er zijn gigantische boeken over animatie geschreven, variërend van cartoon, tot 2D graphics, tot 3D graphics.

Voor meer animatie, lees deze link (onderaan de first post): Animation basics

En volumes uitzetten is hetzelfde als shaden. Je kan geen vormgeven met outlines, outlines zijn 2 dimensionaal. Met schaduw, en dus volume voeg je die 3e dimensie toe. Ik kan jou niet uitleggen hoe je ergens schadow op tekent, dat is afhankelijk van de vorm, style en vooral ook de lichtbronnen.

Voor meer licht: All you need to know about light staat onderaan in de first post. In deze tutorial zeggen afbeeldingen en titels bijna altijd genoeg, als je maar lang genoeg de tijd neemt om te observeren.

Shaden is hetzelfde als de vorm van een object aanduiden, alle schadow en licht volgt de vorm, om vormen uit te drukken, moet je simpelweg referentie zoeken en het namaken. Natekenen heb je geen uitleg voor nodig, dat doe je gewoon. De enige uitleg die toepasbaar is op zoiets is de volgende:

Begin nooit met de details, zet de vorm uit voor je kleine elementen gaat toevoegen. Oefen ontzettend veel en voeg misschien pas details toe als je genoeg hebt geoefend met de ruwe vorm uitzetten. Bekijk zelf wat het verschil is tussen jouw resultaat en een foto, of beter, het object wat naast je staat (als je er aan kan komen Knipoog). Probeer die verschillen te minimalizeren. Wat vooral belangrijk is, is dat je de hoek van een lijn ten op zichte van de horizon niet verkeerd inschat.

Als je voor een flat staat, zie je het dak niet. Dat betekend dat de lijnen vanaf een punt boven de horizon komen. Als je twee punten boven een (horizontale) horizon lijn zet, en dan beide punten met 1-zelfde punt op de horizon verbind, zal je zien dat die lijnen een vlak maken waar je vanaf onderaan tegenaan kijkt. Omdat een flat geen vlak is, maar een blok met muren die jouw zicht op het plafond (dus de onderkant van het dak) versperren, zie je dat vlak niet, en dus het dak niet.

Post scriptum: Bovenstaande is nu ook verwerkt in de tutorial, zei het minder uitgebreid omdat ik een aantal dingen uit de tutorial ook herhaald heb, het voorbeeld met die flat, zal ik nog wel even illustreren

Update:
Perspectief verwerkt in tutorial...

« Laatste verandering: 7 Augustus 2008, 14:06:48 door TrevoriuS »

Naar boven Gelogd

Mloenkaugm
Gebruiker

Offline Offline

Berichten: 442

Ik kijk in je ziel.


« Antwoord #3 Gepost op: 7 Augustus 2008, 16:07:52 »

Wat een gigantische tutorial, ik heb hier ontzetten veel aan (en ik denk andere mensen ook wel)! Het is zeker de moeite waard om alles te kijken want het is één van de meest uitgebreide tuts over pixelart op heel NGMC (volgens mij toch wel de meest uitgebreide).

Dit heeft zeker ontzettend veel moeite gekost neem ik aan? Desalniettemin een perfecte tutorial voor beginner- en gevordene-spriters.


HOE MAAK JE EEN ONLINE GAME IK BRUIK AL 2 DAGEN GAMEMAKER!!!! (grapjuuuh)
Naar boven Gelogd

TrevoriuS
Gebruiker

Offline Offline

Berichten: 1687


« Antwoord #4 Gepost op: 7 Augustus 2008, 16:11:00 »

Het schrijven is niet zo veel moeite, 2 a4tjes type je in no-time vol, en veel van de voorbeelden had ik al. Voordat je een goede tutorial kan maken echter, moet je echt goed weten waar je het over hebt. Dat geld globaal zo, voor welk onderwerp dan ook. Dat kost veel ervaring, en als je ooit een tutorial schrijft, zal het onderwerp waarschijnlijk binnen je interesses liggen Knipoog
 
En inderdaad, gevorderde mensen zullen hier ook nog een ander idee van pixelart van kunnen krijgen. Er zijn veel mensen die denken dat ze 'ok' of 'goed' zijn maaar maar half weten wat ze doen, aan de andere kant, kan ik uiteraard ook ongelijk hebben over dingen. Ik heb ook veel van andere artists geleerd en heb methodes die mij goed leken over genomen. Ik ben nu aan het oefenen om meer detail te integreren zonder dat het onduidelijk wordt, maar ik heb er nog geen vaste methode voor (als het goed gaat is het vaak meer geluk dan wijsheid), dus ik kan het nog niet verwerken in de tutorial  Engel

Bedankt voor de reacties
-TS~


Naar boven Gelogd

Kakashi
Gebruiker


Offline Offline

Berichten: 29


« Antwoord #5 Gepost op: 8 Augustus 2008, 16:44:49 »

Gewoon een geweldige tutorial, heeft mij veel geholpen, vooral het stuk over dithering hielp bij het maken van achtergronden. Dit is zeker de beste pixelart tutorial voor beginers, gevorden én experts. alles word duidelijk uitgelegd, en eigenlijk zou iedereen die zelf sprites en achtergronden maakt dit moeten zien.

Heel mooi gedaan Rolt ogen

Naar boven Gelogd

Advertenties
« vorige volgende »
Pagina's: [1]
Print


Topic Informatie
0 geregistreerde leden en 1 gast bekijken dit topic.

Ga naar:  

Powered by SMF 1.1.21 | SMF © 2006-2007, Simple Machines
www.game-maker.nl © 2003-2020 Nederlandse Game Maker Community