Pixel artea hasiberrientzako: erabiltzeko argibideak

Pixel artea hasiberrientzako: erabiltzeko argibideak

Garatzaile indieek askotan hainbat rol konbinatu behar izaten dituzte aldi berean: joko-diseinatzailea, programatzailea, konpositorea, artista. Eta ikus-entzunezkoei dagokienez, jende askok pixel artea aukeratzen du; lehen begiratuan, erraza dirudi. Baina ederra egiteko, esperientzia asko eta zenbait trebetasun behar dituzu. Estilo honen oinarriak ulertzen hasi berri direnentzat tutorial bat aurkitu dut: software berezien deskribapena eta marrazketa teknikak bi sprite adibide gisa erabiliz.

hondo

Pixel arta arte digitalaren forma bat da, zeinetan aldaketak pixel mailan egiten diren. Gehienbat 80ko eta 90eko hamarkadetako bideo-jokoen grafikoekin lotzen da. Orduan artistek memoriaren mugak eta bereizmen baxua kontuan hartu behar izan zituzten. Orain pixel artea oraindik ezaguna da jokoetan eta, oro har, arte estilo gisa, 3D grafiko errealistak sortzeko aukera izan arren. Zergatik? Nostalgia alde batera utzita ere, hain marko zurrun batean lan polita sortzea erronka polita eta aberasgarria da.

Pixel artean sartzeko oztopoa nahiko baxua da arte tradizionalarekin eta 3D grafikoekin alderatuta, eta horrek garatzaile indieak erakartzen ditu. Baina horrek ez du esan nahi erraza izango denik amaitu estilo honetako jokoa. Pixel art metroidvaniak dituzten indie garatzaile asko ikusi ditut crowdfunding plataformetan. Urte batean dena amaituko zutela uste zuten, baina egia esan beste sei urte behar zituzten.

Pixel artea hasiberrientzako: erabiltzeko argibideak
Metal Slug 3 (Arcade). SNK, 2000. urtea

Jende gehienak sortu nahi duen mailan pixel arteak denbora asko hartzen du, eta tutorial laburrak gutxi dira. 3D eredu batekin lan egiten duzunean, biratu, deformatu, bere zati indibidualak mugi ditzakezu, animazioak eredu batetik bestera kopiatu eta abar. Goi-mailako pixel arteak ia beti ahalegin handia eskatzen du fotograma bakoitzean pixelak zehatz-mehatz jartzeko.

Oro har, ohartarazi nuen.

Eta orain nire estiloari buruz pixka bat: bideo-jokoetarako pixel arta marrazten dut batez ere eta haietan inspirazioa aurkitzen dut. Batez ere, Famicom/NES, 16 biteko kontsolen eta 90eko hamarkadako arcade jokoen zalea naiz. Garai hartako nire joko gogokoenen pixel arta distiratsua, segurua eta garbia dela deskriba daiteke (baina ez gehiegi), ez da gogorra eta minimalista. Nik neuk estilo hau lantzen dut, baina erraz aplika ditzakezu tutorial honetako ideiak eta teknikak gauza guztiz desberdinak sortzeko. Arakatu artista ezberdinen lanak eta sortu maite duzun pixel arta!

Soft

Pixel artea hasiberrientzako: erabiltzeko argibideak

Pixel arterako oinarrizko tresna digitalak - Zooma (Zoom) eta Arkatza (Arkatza) pixelak jartzeko. Lerroa (Lerroa), Irudia (Forma), Hautatu (Hautatu), Mugitu (Mugitu) eta Bete (Paint Bucket) ere beharko dituzu. Doako eta ordainpeko software asko dago tresna multzo batekin. Ezagunenak eta neuk erabiltzen ditudanez hitz egingo dut.

Margotu (doan)

Windows badaukazu, Paint sartuta dago - programa primitiboa, baina pixel arterako tresna guztiak ditu.

piskele (doakoa da)

Arakatzailean zehar exekutatzen den pixel artearen editore ezusteko funtzionala. Zure lana PNG edo GIF animatuetara esporta dezakezu. Aukera bikaina hasiberrientzako.

GraphigsGale (doakoa da)

GraphicsGale animazio tresnak biltzen dituen pixel arterako bereziki diseinatutako editore bakarra da. HUMANBALANCE enpresa japoniarrak sortu zuen. 2017az geroztik, doan banatzen da eta oraindik ere eskatzen du, Asepriteren ospea gero eta handiagoa den arren. Zoritxarrez, Windows-en bakarrik funtzionatzen du.

Aseprita ($)

Beharbada, oraingo editore ezagunena. kode irekia, funtzio ugari, euskarria aktiboa, Windows, Mac eta Linuxerako bertsioak. Pixel-arteari buruz serio bazara eta oraindik ez baduzu editore egokia aurkitu, hau izan daiteke zuretzat.

Game Maker Studio 2 ($$+)

GameMaker Studio 2 2D tresna bikaina da, Sprite Editor on batekin. Zure jokoetarako pixel artea sortu nahi baduzu, oso erosoa da dena programa batean egitea. Orain software hau erabiltzen dut lanean 50. UFO, 50 retro-jokoz osatutako bilduma: spriteak eta animazioak sortzen ditut GameMaker-en, eta tile multzoak Photoshop-en.

Photoshop ($$$+)

Photoshop software garestia da, harpidetza bidez banatzen dena, ez dago pixel arterako diseinatua. Ez dut gomendatzen hau erostea bereizmen handiko ilustrazioak gustatzen bazaizkizu edo nik bezala irudien manipulazio konplexurik egin behar ez baduzu. Sprite estatikoak eta pixel artea sor ditzakezu bertan, baina nahiko konplexua da software espezializatuarekin alderatuta (GraphicsGale edo Aseprite, esaterako).

Beste

Pixel artea hasiberrientzako: erabiltzeko argibideak
Nire pixel art kit. Dena beltza da, konturatu naiz.

Tableta grafikoa ($$+)

Tableta grafikoak gomendatzen ditut ilustrazio digitalaren edozein lan egiteko, karpoko tunelaren sindromea saihesteko. Askoz errazagoa da prebenitzea sendatzea baino. Egunen batean mina sentituko duzu eta okerrera egingo du - zaindu zeure burua hasiera-hasieratik. Lehen saguarekin marrazten nuenez, gaur egun kosta egiten zait teklak sakatzea eskatzen duten jokoetan aritzea. Gaur egun Wacom Intuos Pro S erabiltzen dut.

Eskumuturraren euskarria ($)

Tabletarik lortu ezin baduzu, erosi gutxienez eskumuturreko kalibre bat. Nire gustukoena Mueller Green Fitted Wrist Brace da. Gainerakoak estuegiak dira edo laguntza nahikoa ez dute ematen. Kalibreak linean eska daitezke arazorik gabe.

96 Γ— 96 pixel

Pixel artea hasiberrientzako: erabiltzeko argibideak
azken borroka. Capcom, 1989

Has gaitezen! Has gaitezen 96x96 px karaktere sprite batekin. Adibide gisa, orko bat marraztu nuen eta Final Fight-eko pantaila-argazkian jarri nuen (goiko irudia), eskala lortzeko. Hau большой Sprite retro joko gehienetarako, pantaila-argazkiaren tamaina: 384 Γ— 224 pixel.

Hain sprite handi batean, errazagoa izango da hitz egin nahi dudan teknika erakustea. Era berean, pixelez pixel errendatzea gehiago ezagutzen dituzun arte-modu tradizionalak (adibidez, marrazkiak edo margoak) bezalakoak dira. Oinarrizko teknikak menderatuta, sprite txikiagoetara pasatuko gara.

1. Aukeratu paleta bat

Pixel artea hasiberrientzako: erabiltzeko argibideak

Pixela pixel artearen kontzeptu askoz sakonagoa da beste edozein eremu digitaletan baino. Pixel artea bere mugek definitzen dute, hala nola koloreek. Garrantzitsua da paleta egokia aukeratzea, zure estiloa definitzen lagunduko dizu. Baina hasieran, paletak ez pentsatzea eta lehendik daudenetako bat aukeratzea (edo ausazko kolore batzuk besterik ez) gomendatzen dut - edozein fasetan erraz alda dezakezu.

Tutorial honetarako, sortu dugun 32 kolore-paleta erabiliko dut 50. UFO. Pixel arterako, sarritan 32 edo 16 koloretatik muntatzen dira. Gurea Famicom eta PC Engineren artean ager daitekeen fikziozko kontsola baterako diseinatuta dago. Hartu dezakezu edo beste edozein - tutoriala ez da aukeratutako paletaren araberakoa.

2. Ingerada zakarrak

Pixel artea hasiberrientzako: erabiltzeko argibideak

Has gaitezen Arkatza tresnarekin marrazten. Marraz dezagun zirriborroa ohiko boligrafoz eta paperarekin egiten dugun moduan. Noski, pixel artea eta arte tradizionala gainjarri egiten dira, batez ere sprite handiei dagokienez. Nire behaketek erakusten dute pixel artearen artista indartsuak eskuz libreko marrazketan onak direla gutxienez eta alderantziz. Beraz, marrazteko trebetasunak garatzea beti da erabilgarria.

3. Ingerada

Pixel artea hasiberrientzako: erabiltzeko argibideak

Ingerada amaitzen dugu: pixel gehigarriak kendu eta lerro bakoitzaren lodiera pixel batera murriztu. Baina zer da zehazki erredundantea? Galdera honi erantzuteko, pixel-lerroak eta kolpeak ulertu behar dituzu.

kolpeak

Pixel artean oinarrizko bi lerro marrazten ikasi behar duzu: lerro zuzenak eta kurbak. Boligrafoarekin eta paperarekin muskuluen kontrola da, baina kolore-bloke txikiekin ari gara lanean.

Pixel-lerro egokiak marrazteko gakoa zimurtasuna da. Hauek lerroaren leuntasuna suntsitzen duten pixel bakarrak edo segmentu txikiak dira. Lehen esan dudan bezala, pixel bakar batek garrantzi handia du pixel artean, beraz, desnivelak estetika osoa honda dezake. Imajinatu paperean lerro zuzen bat marrazten ari zarela eta bat-batean norbaitek mahaia jotzen duela: pixel-arteko kolpeek ausazko zirriborro baten itxura dute.

Adibideak:

Pixel artea hasiberrientzako: erabiltzeko argibideak
Zuzentzeko

Pixel artea hasiberrientzako: erabiltzeko argibideak
Kurbak

Lerro-segmentuen luzera pixkanaka-pixkanaka handitzen edo gutxitzen ez denean agertzen da kurbetan.

Ezinezkoa da kolpeak guztiz saihestea: zure joko retro gogoko guztiek dituzte (salbu, noski, pixel artea forma sinpleek soilik osatzen duten). Helburua: irregulartasunak gutxitzea, behar duzun guztia erakutsiz.

4. Lehenengo koloreak aplikatuz

Pixel artea hasiberrientzako: erabiltzeko argibideak

Margotu zure pertsonaia betegarri batekin edo beste tresna egoki batekin. Paletak lanaren zati hau erraztuko du. Softwareak ez badu paletak erabiltzeko aukera ematen, zuzenean irudian jar dezakezu, goiko adibidean bezala, eta koloreak hauta ditzakezu kontagailu batekin.

Beheko ezkerreko izkinan, gure laguna marraztu nuen, ezagutu, hau Shar da. Horrekin, errazagoa izango da fase bakoitzean zer gertatzen den ulertzea.

5. Itzaltzea

Pixel artea hasiberrientzako: erabiltzeko argibideak

Itzalak errendatzeko garaia da - gehitu kolore ilunagoak spriteari. Beraz, irudiak hiru dimentsioko itxura izango du. Demagun haren ezkerraldean dagoen orkoaren gainean dagoen argi-iturri bat dugula. Horrek esan nahi du gure izaeraren gainean eta aurrean dagoen guztia argituko dela. Gehitu itzalak beheko eskuinaldean.

Forma eta bolumena

Pixel artea hasiberrientzako: erabiltzeko argibideak

Urrats hau zaila bada, imajinatu zure marrazkia hiru dimentsioko forma gisa, eta ez lerroak eta koloreak soilik. Formak XNUMXD espazioan daude eta itzalekin eraikitzen dugun bolumena izan dezakete. Horrek pertsonaia xehetasunik gabe bistaratzen lagunduko du eta pixelez ordez buztinez egina dagoela dirudi. Itzaltzea ez da kolore berriak gehitzea bakarrik, forma bat eraikitzea baizik. Ondo zehaztutako pertsonaia batean, xehetasunek ez dituzte oinarrizko formak iluntzen: begiak zurbiltzen badituzu, hainbat argi eta itzal multzo handi ikusiko dituzu.

Leuntzea (anti-aliasing, anti-aliasing)

Kolore berri bat erabiltzen dudan bakoitzean, antialiasing (AA) aplikatzen dut. Pixelak leuntzen laguntzen du bi lerro-segmentu elkartzen diren ertzetan tarteko koloreak gehituz:

Pixel artea hasiberrientzako: erabiltzeko argibideak

Pixel grisek lerroko "hausturak" leuntzen dituzte. Lerro-segmentua zenbat eta luzeagoa izan, orduan eta luzeagoa izango da AA segmentua.

Pixel artea hasiberrientzako: erabiltzeko argibideak
Honela ikusten du AA orkoaren sorbaldan. Bere muskuluen kurba adierazten duten lerroak leundu behar dira.

Antialiasing-ak ez du jokoan erabiliko den spritetik haratago joan behar edo kolorea ezezaguna den atzeko plano baten aurka. Esaterako, AA hondo argi bati aplikatzen bazaio, aliasaren aurkako itxura itsusia izango da hondo ilun batean.

6. Zirkuitu selektiboa

Pixel artea hasiberrientzako: erabiltzeko argibideak

Aurretik, eskemak guztiz beltzak ziren, eta horrek oso marrazki bizidun itxura ematen zion spriteari. Irudia segmentutan banatuta zegoela zirudien. Esaterako, besoko marra beltzek muskulatura oso kontraste erakusten dute, eta pertsonaiak ez du itxura sendoa.

Sprite naturalagoa bihurtzen bada, eta segmentazioa hain nabaria ez bada, orduan pertsonaiaren oinarrizko formak errazagoak izango dira irakurtzeko. Horretarako, eskema selektiboa erabil dezakezu - ordezkatu zati beltza eskema arin batekin. Spritearen argiztatutako zatian, kolore argienak erabil ditzakezu edo, spritea espazio negatiboarekin kontaktuan dagoenean, eskema guztiz kendu dezakezu. Beltzaren ordez, itzalerako aukeratutako kolorea erabili behar duzu - horrela segmentazioa gordeko da (giharrak, ilea eta abar bereizteko).

Etapa honetan ere itzal ilunagoak gehitu nituen. Orko baten azalean hiru berde maila atera ziren. Kolore berde ilunena ingerada selektiborako eta AArako erabil daiteke.

7. Azken ukituak

Pixel artea hasiberrientzako: erabiltzeko argibideak

Bukaeran, merezi du aipagarriak gehitzea (spritean dauden puntu argienak), xehetasunak (belarritakoak, txosnak, orbainak) eta bestelako hobekuntzak, pertsonaia prest egon arte edo hurrengora pasatu behar duzun arte.

Fase honetan aplika daitezkeen hainbat trikimailu erabilgarriak daude. Biratu marrazkia horizontalki, askotan proportzioetan eta itzaletan akatsak agerian uzten laguntzen du. Kolorea ere kendu dezakezu - saturazioa zeroan ezarri itzalak non aldatu behar dituzun ulertzeko.

Zarata sortzea (dithering, dithering)

Orain arte, gehienbat itzal adabaki handiak eta sendoak erabili ditugu. Baina bada beste teknika bat: dithering, kolore batetik bestera pasatzeko aukera ematen duena hirugarrenik gehitu gabe. Begira beheko adibidea.

Pixel artea hasiberrientzako: erabiltzeko argibideak

Goiko iluneko gradienteak ehunka urdin tonu ezberdin erabiltzen ditu.

Erdiko gradienteak bederatzi kolore baino ez ditu erabiltzen, baina oraindik kolore bereko tonu gehiegi ditu. Banding izeneko bat dago (ingelesezko bandatik - banda bat), zeinetan, marra uniforme lodiak direla eta, begiak koloreen kontaktu-puntuetan jartzen du arreta, koloreen ordez.

Beheko gradientean, bandak saihesten dituen eta bi kolore soilik erabiltzen dituen dither bat aplikatu dugu. Intentsitate ezberdineko zarata sortzen dugu koloreen gradazioa simulatzeko. Teknika hau inprimaketan erabiltzen den tonu erdiaren oso antzekoa da; bai eta punteratzea ere (puntadura - irudi pikortsua) - ilustrazioan eta komikietan.

Orkoan, nahiko ditheratu nuen ehundura transmititzeko. Pixel artista batzuek ez dute batere erabiltzen, beste batzuk, berriz, ez dira lotsatiak eta oso trebetasunez egiten dute. Kolore bakar batez betetako eremu handietan (begiratu zerura goiko Metal Slug-en pantaila-argazkian) edo zakar eta irregularra izan behar duten eremuetan (zikinkeria bezala) itxurarik onena iruditzen zait. Zeuk erabaki nola erabili.

Eskala handiko eta kalitate handiko dithering-aren adibide bat ikusi nahi baduzu, begiratu The Bitmap Brothers, 80ko hamarkadako britainiar estudio baten jokoak edo PC-98 ordenagailuko jokoak. Kontuan izan denak NSFW direla.

Pixel artea hasiberrientzako: erabiltzeko argibideak
Kakyusei (PC-98). Iratxoa, 1996
Irudi honetan 16 kolore baino ez daude!

8. Azken begirada

Pixel artea hasiberrientzako: erabiltzeko argibideak

Pixel artearen arriskuetako bat arina eta sinplea dirudiela da (bere egitura eta estilo-mugengatik). Baina, azkenean, denbora asko igaroko duzu zure spriteak doitzen. Ebatzi beharreko puzzle bat bezalakoa da, horregatik pixel arteak perfekzionistei erakartzen die. Gogoratu sprite batek ez duela denbora gehiegi behar izan behar; oso konplexua den pieza baten pieza txiki bat besterik ez da. Garrantzitsua da panorama handia ez galtzea.

Zure pixel arta jokoetarako ez bada ere, batzuetan merezi du zure buruari esatea: "Nahikoa da dagoeneko!" Eta aurrera. Gaitasunak garatzeko modurik onena prozesu osoa hasieratik amaierara ahalik eta aldi gehien egitea da, ahalik eta gai gehien erabiliz.

Eta batzuetan komeni da sprite bat pixka bat uztea, beranduago begi berriekin begiratu ahal izateko.

32Γ—32 pixel

Pixel artea hasiberrientzako: erabiltzeko argibideak

96x96 pixeleko sprite handia sortu genuen lehenik, tamaina horretan marraztea edo margotzea bezalakoa baita, baina pixelatua. Spritea zenbat eta txikiagoa izan, orduan eta itxura gutxiago du bistaratu beharko lukeena, eta orduan eta garrantzitsuagoa da pixel bakoitza.

Pixel artea hasiberrientzako: erabiltzeko argibideak

Super Mario Bros. Marioren begia bata bestearen gainean pilatutako bi pixel besterik ez dira. Eta bere belarria ere bai. Shigeru Miyamoto pertsonaien sortzaileak esan zuen bibotea beharrezkoa zela sudurra aurpegitik bereizteko. Beraz, Marioren aurpegiaren ezaugarri nagusietako bat pertsonaien diseinua ez ezik, trikimailu pragmatiko bat ere bada. Horrek jakituria zaharra berresten du - "beharra asmamenaren ama da".

Dagoeneko ezagutzen ditugu 32Γ—32 pixeleko sprite bat sortzeko fase nagusiak: zirriborroa, kolorea, itzalak, fintasun gehiago. Baina halako baldintzetan, hasierako zirriborro gisa, koloretako formak jasotzen ditut eskemak marraztu beharrean, tamaina txikiagatik. Koloreak paper garrantzitsuagoa du pertsonaien definizioan eskemak baino. Begira berriro Mariori, ez du batere ingeradarik. Ez dira biboteak bakarrik interesgarriak. Bere bizkarrek belarrien forma definitzen dute, mahukek besoak erakusten dituzte, eta forma orokorrak bere gorputz osoa islatzen du gutxi-asko argiro.

Sprite txikiak sortzea etengabeko truke-off bat da. Trazu bat gehitzen baduzu, baliteke itzalari lekua galtzea. Zure pertsonaiak besoak eta hankak argi eta garbi definituta baditu, baliteke burua oso handia ez izatea. Kolorea, marraztu selektiboa eta antialiasing eraginkortasunez erabiltzeak errendatutako objektua benetan dena baino handiagoa izango da.

Sprite txikientzat, chibi estiloa gustatzen zait: pertsonaiak oso politak dira, buru eta begi handiak dituzte. Espazio mugatu batean pertsonaia distiratsu bat sortzeko modu bikaina eta, oro har, estilo oso atsegina. Baina agian pertsonaiaren mugikortasuna edo indarra erakutsi behar duzu, orduan buruari leku gutxiago eman diezaiokezu gorputza indartsuagoa izan dadin. Guztia zure lehentasunen eta helburuen araberakoa da.

Pixel artea hasiberrientzako: erabiltzeko argibideak
Talde osoa hemen dago!

Fitxategi formatuak

Pixel artea hasiberrientzako: erabiltzeko argibideak
Horrelako emaitza batek edozein pixel artista urduri jarri dezake

Ikusten duzun argazkia irudia JPG gisa gordetzearen emaitza da. Datuen zati bat galdu egin da fitxategien konpresioaren algoritmoen ondorioz. Kalitate handiko pixel arteak itxura txarra izango du, eta jatorrizko paletara itzultzea ez da erraza izango.

Irudi estatiko bat kalitatea galdu gabe gordetzeko, erabili PNG formatua. Animazioetarako - GIF.

Nola partekatu pixel artea modu egokian

Sare sozialetan pixel arta partekatzea modu bikaina da iritzia jasotzeko eta estilo berean lan egiten duten beste artista batzuk ezagutzeko. Ez ahaztu #pixelart traola erabiltzea. Zoritxarrez, sare sozialek askotan PNG JPG bihurtzen dute galdetu gabe, zure lana okertuz. Eta ez dago beti argi zergatik bihurtu den zure argazkia.

Hainbat sare sozialetarako pixel artea kalitate egokian gordetzeko aholku batzuk daude.

Twitter

PNG fitxategia Twitter-en aldatu gabe mantentzeko, erabili 256 kolore baino gutxiago edo zihurtatuzure fitxategiak 900 pixel baino gutxiagoko luzera duela. Fitxategiaren tamaina gutxienez 512x512 pixelera igoko nuke. Eta eskalatzea 100en multiploa izan dadin (% 200, ez % 250) eta ertz zorrotzak gordetzen dira (Photoshop-en Nearest Neighbor).

Twitter-eko argitalpenetarako GIF animatuak muztioa 15 MB baino gehiago ez pisatu. Irudiak gutxienez 800x800 pixel izan behar du, begizta-animazioa hiru aldiz errepikatu behar da eta azken fotograma beste guztien denboraren erdia izan behar du - teoria ezagunena. Hala ere, ez dago argi zein neurritan bete behar diren baldintza horiek, Twitter etengabe aldatzen ari baita irudiak bistaratzeko algoritmoak.

Instagram

Nik dakidala, ezin da argazki bat argitaratu Instagram-en kalitatea galdu gabe. Baina, zalantzarik gabe, itxura hobea izango du gutxienez 512x512 pixelera handitzen baduzu.

Iturria: www.habr.com

Gehitu iruzkin berria