Pixel art algajatele: kasutusjuhised

Pixel art algajatele: kasutusjuhised

Indie-arendajad peavad sageli kombineerima mitut rolli korraga: mängudisainer, programmeerija, helilooja, kunstnik. Ja mis puutub visuaalidesse, siis paljud valivad pikslikunsti – esmapilgul tundub see lihtne. Kuid selleks, et see oleks ilus, on vaja palju kogemusi ja teatud oskusi. Leidsin õpetuse neile, kes on alles hakanud selle stiili põhitõdesid mõistma: koos spetsiaalse tarkvara kirjelduse ja joonistustehnikate kirjeldusega, kasutades näitena kahte spraiti.

Фон

Pikslikunst on digitaalse kunsti vorm, milles muudatusi tehakse pikslite tasemel. Seda seostatakse enamasti 80ndate ja 90ndate videomängude graafikaga. Siis pidid artistid arvestama mälupiirangute ja madala eraldusvõimega. Nüüd on pikslikunst endiselt populaarne mängudes ja kunstistiilina üldiselt, hoolimata võimalusest luua realistlikku 3D-graafikat. Miks? Isegi kui nostalgia kõrvale jätta, on lahedate tööde loomine nii jäigas raamistikus tore ja rahuldust pakkuv väljakutse.

Pikslikunsti turule sisenemise barjäär on võrreldes traditsioonilise kunsti ja 3D-graafikaga suhteliselt madal, mis tõmbab indie-arendajaid ligi. Kuid see ei tähenda, et see oleks lihtne lõpetama mäng selles stiilis. Olen ühisrahastusplatvormidel näinud paljusid indie-arendajaid, kellel on pikslikunsti metroidvaniad. Nad arvasid, et saavad aastaga kõik valmis, aga tegelikult oli vaja veel kuus aastat.

Pixel art algajatele: kasutusjuhised
Metal Slug 3 (Arcade). SNK, 2000. aasta

Pikslikunst tasemel, mida enamik inimesi soovib luua, on aeganõudev ja lühikesi õpetusi on vähe. 3D-mudeliga töötades saate seda pöörata, deformeerida, liigutada selle üksikuid osi, kopeerida animatsioone ühelt mudelilt teisele jne. Kõrgetasemeline pikslikunst nõuab peaaegu alati palju vaeva, et pikslid igale kaadrile täpselt paigutada.

Üldiselt hoiatasin.

Ja nüüd natuke minu stiilist: ma joonistan peamiselt videomängude jaoks pikslikunsti ja leian neist inspiratsiooni. Eelkõige olen Famicom/NESi, 16-bitiste konsoolide ja 90ndate arkaadmängude fänn. Minu ajastu lemmikmängude pikslikunsti võib kirjeldada kui säravat, enesekindlat ja puhast (kuid mitte ülemäära), see pole raske ja minimalistlik. Töötan ise selles stiilis, kuid saate hõlpsalt rakendada selle õpetuse ideid ja tehnikaid täiesti erinevate asjade loomiseks. Tutvuge erinevate kunstnike loominguga ja looge endale meelepärane pikslikunst!

Tarkvara

Pixel art algajatele: kasutusjuhised

Põhilised digitaalsed tööriistad pikslite tegemiseks – suum (suum) ja pliiats (pliiats) pikslite paigutamiseks. Teil on vaja ka joont (joont), joonist (kuju), vali (vali), teisalda (teisalda) ja täitke (värviämber). Sellise tööriistakomplektiga on palju tasuta ja tasulisi tarkvara. Räägin kõige populaarsematest ja neist, mida ise kasutan.

Värv (tasuta)

Kui teil on Windows, on Paint sellesse sisse ehitatud - algeline programm, kuid sellel on kõik pikslite kunsti tööriistad.

Vile (on vaba)

Ootamatult toimiv pikslipildi redaktor, mis jookseb läbi brauseri. Saate eksportida oma tööd PNG-vormingusse või animeeritud GIF-i. Suurepärane võimalus algajatele.

GraphigsGale (on vaba)

GraphicsGale on ainus redaktor, millest olen kuulnud, et see on loodud spetsiaalselt pikslite kunsti jaoks ja sisaldab animatsioonitööriistu. Selle lõi Jaapani ettevõte HUMANBALANCE. Alates 2017. aastast on seda levitatud tasuta ja see on vaatamata Aseprite populaarsuse kasvule endiselt nõutud. Kahjuks töötab see ainult Windowsis.

Asepriit ($)

Võib-olla hetkel populaarseim toimetaja. Avatud lähtekoodiga, palju funktsioone, aktiivne tugi, Windowsi, Maci ja Linuxi versioonid. Kui suhtute pikslikunsti tõsiselt ja pole ikka veel õiget redaktorit leidnud, võib see olla teie jaoks sobiv.

Gamemaker Studio 2 ($$+)

GameMaker Studio 2 on suurepärane 2D-tööriist, millel on hea Sprite Editor. Kui soovite oma mängude jaoks luua pikslite kunsti, on väga mugav teha kõike ühes programmis. Nüüd kasutan seda tarkvara oma töös UFO-d 50, 50 retromängu kogumik: loon GameMakeris spraite ja animatsioone ning Photoshopis plaatide komplekte.

Photoshop ($$$+)

Photoshop on kallis tarkvara, mida levitatakse tellimuse alusel ja mis pole mõeldud pikslite jaoks. Ma ei soovita seda osta, välja arvatud juhul, kui teile meeldivad suure eraldusvõimega illustratsioonid või kui te ei pea tegema keerulisi pilditöötlusi nagu mina. Selles saate luua staatilisi spraite ja pikslite kunsti, kuid see on spetsialiseeritud tarkvaraga (nt GraphicsGale või Aseprite) võrreldes üsna keeruline.

Muu

Pixel art algajatele: kasutusjuhised
Minu pikslite kunstikomplekt. Kõik on must, alles märkasin.

Graafiline tahvelarvuti ($$+)

Graafika tahvelarvuteid soovitan igaks digiillustratsioonitööks, et vältida karpaalkanali sündroomi. Seda on palju lihtsam ennetada kui ravida. Ühel päeval tunned valu ja see läheb ainult hullemaks – hoolitse enda eest juba algusest peale. Kuna ma varem joonistasin hiirega, on mul nüüd raske mängida mänge, mis nõuavad klahvide vajutamist. Hetkel kasutan Wacom Intuos Pro S.

Randmetugi ($)

Kui tahvelarvutit ei saa, ostke vähemalt randmesadula. Minu lemmik on Mueller Green Fitted Wrist Brace. Ülejäänud on kas liiga pingul või ei paku piisavalt tuge. Sadulaid saab Internetist ilma probleemideta tellida.

96 × 96 pikslit

Pixel art algajatele: kasutusjuhised
viimane võitlus. Capcom, 1989

Alustame! Alustame 96x96 px tegelaskujuga. Näitena joonistasin orki ja panin selle Final Fighti ekraanipildile (pilt ülal), et saaksite skaala. See большой sprite enamiku retromängude jaoks, ekraanipildi suurus: 384 × 224 pikslit.

Nii suurel spraitil on lihtsam näidata tehnikat, millest ma rääkida tahan. Samuti sarnaneb pikslite kaupa renderdamine rohkem traditsioonilistele kunstivormidele (nt joonistamine või maalimine), millega võite olla tuttavam. Olles omandanud põhitehnikad, liigume edasi väiksemate spraitide juurde.

1. Valige palett

Pixel art algajatele: kasutusjuhised

Piksel on pikslikunstis palju sügavam mõiste kui üheski teises digitaalvaldkonnas. Pikslikunsti määravad selle piirangud, näiteks värvid. Oluline on valida õige palett, see aitab määratleda teie stiili. Kuid alguses soovitan mitte mõelda palettidele ja valida üks olemasolevatest (või lihtsalt mõned juhuslikud värvid) - saate seda igal etapil hõlpsasti muuta.

Selle õpetuse jaoks kasutan meie loodud 32 värvipaletti UFO-d 50. Pikslikunsti jaoks on need sageli kokku pandud 32 või 16 värvist. Meie konsool on mõeldud väljamõeldud konsooli jaoks, mis võib ilmuda kuskil Famicomi ja PC Engine'i vahele. Võite võtta selle või mis tahes muu - õpetus ei sõltu üldse valitud paletist.

2. Karedad kontuurid

Pixel art algajatele: kasutusjuhised

Alustame joonistamist pliiatsi tööriistaga. Joonistame eskiisi samamoodi nagu tavalise pliiatsi ja paberiga. Muidugi kattuvad pikslikunst ja traditsiooniline kunst, eriti kui tegemist on selliste suurte spraitidega. Minu tähelepanekud näitavad, et tugevad pikslikunstnikud on vähemalt head vabakäejoonistamises ja vastupidi. Nii et joonistamisoskuse arendamine on alati kasulik.

3. Kontuurimine

Pixel art algajatele: kasutusjuhised

Lõpetame kontuurid: eemaldame lisapikslid ja vähendame iga rea ​​paksust ühe pikslini. Aga mis täpselt on üleliigne? Sellele küsimusele vastamiseks peate mõistma pikslite jooni ja konarusi.

muhke

Peate õppima, kuidas joonistada pikslikunstis kahte põhijoont: sirgeid ja kõveraid. Pliiatsi ja paberi puhul on kõik seotud lihaste kontrollimisega, kuid me töötame väikeste värviplokkidega.

Õigete pikslijoonte joonistamise võti on karedus. Need on üksikud pikslid või väikesed segmendid, mis hävitavad joone sileduse. Nagu ma enne ütlesin, on pikslikunstis suur tähtsus ühel pikselil, mistõttu võib ebatasasus rikkuda kogu esteetika. Kujutage ette, et joonistate paberile sirget joont ja järsku tabab keegi lauda: pikslikunsti konarused näevad välja nagu suvaline vingerpuss.

Näited:

Pixel art algajatele: kasutusjuhised
Otsene

Pixel art algajatele: kasutusjuhised
Kurvid

Sakilisus ilmneb kõveratel, kui joonelõikude pikkus ei suurene ega vähene järk-järgult.

Konarusi täielikult vältida on võimatu – need on olemas kõigil teie lemmikretromängudel (muidugi juhul, kui pikslikunst ei koosne ainult lihtsatest kujunditest). Eesmärk: minimeerida ebakorrapärasusi, näidates samal ajal kõike, mida vajate.

4. Esimeste värvide pealekandmine

Pixel art algajatele: kasutusjuhised

Värvige oma tegelane täidise või muu sobiva tööriistaga. Palett lihtsustab seda tööosa. Kui tarkvara ei võimalda palettide kasutamist, saate selle otse pildile panna, nagu ülaltoodud näites, ja valida värvid tilgutiga.

Vasakusse alumisse nurka joonistasin meie sõbra, saage tuttavaks, see on Shar. Selle abil on lihtsam mõista, mis igas etapis täpselt toimub.

5. Varjutus

Pixel art algajatele: kasutusjuhised

On aeg renderdada varje – lihtsalt lisage spraiti tumedamad värvid. Nii et pilt näeb välja kolmemõõtmeline. Oletame, et meil on üks valgusallikas, mis asub orki kohal sellest vasakul. See tähendab, et kõik, mis on meie tegelase kohal ja ees, valgustatakse. Lisage varjud all paremale.

Vorm ja maht

Pixel art algajatele: kasutusjuhised

Kui see samm on teile raske, kujutage oma joonist ette kolmemõõtmeliste kujunditena, mitte ainult joonte ja värvidena. Kujundid eksisteerivad XNUMXD-ruumis ja neil võib olla ruumala, mille loome varjudega. See aitab tegelast ilma detailideta visualiseerida ja jätta mulje, nagu oleks see pikslite asemel savist. Varjutamine ei seisne ainult uute värvide lisamises, vaid kujundi loomises. Üksikasjaliku tegelase puhul ei varja detailid põhikujusid: kui kissitada silmi, näete mitut suurt valguse ja varju kobarat.

Silumine (antialiasing, antialiasing)

Iga kord, kui kasutan uut värvi, rakendan antialiasi (AA). See aitab piksleid siluda, lisades vahevärvid nurkadesse, kus kaks joonesegmenti kohtuvad:

Pixel art algajatele: kasutusjuhised

Hallid pikslid pehmendavad rea "katkesi". Mida pikem on joon, seda pikem on AA lõik.

Pixel art algajatele: kasutusjuhised
Selline näeb AA välja orki õlal. See on vajalik tema lihaste kõverat kujutavate joonte silumiseks.

Antialias ei tohiks ületada mängus kasutatavat spraiti ega taustal, mille värv on teadmata. Näiteks kui rakendate AA-d heledale taustale, näeb antialias tumedal taustal kole välja.

6. Selektiivahel

Pixel art algajatele: kasutusjuhised

Varem olid piirjooned üleni mustad, mis muutis spraiti väga multikalikuks. Pilt tundus olevat segmentideks jagatud. Näiteks käe mustad jooned näitavad lihaskonda liiga kontrastselt ja tegelane näeb välja vähem soliidne.

Kui sprait muutub loomulikumaks ja segmenteerimine pole nii ilmne, on tegelase põhivorme lihtsam lugeda. Selleks võid kasutada valikulist kontuuri – asendada must kontuur osaliselt heledamaga. Spraidi valgustatud osas saate kasutada heledamaid värve või kui sprait puudutab negatiivset ruumi, saate kontuuri täielikult eemaldada. Musta asemel peate kasutama varju jaoks valitud värvi – nii säilib segmenteeritus (lihaste, karusnaha jms eristamiseks).

Ka selles etapis lisasin tumedamad varjud. Orki nahal selgus kolm rohelist gradatsiooni. Selektiivse kontuuri ja AA jaoks saab kasutada kõige tumedamat rohelist värvi.

7. Viimistlus

Pixel art algajatele: kasutusjuhised

Lõppu tasub lisada esiletõstmisi (heledaimad kohad spraitil), detaile (kõrvarõngad, trukid, armid) ja muid parandusi, kuni tegelane on valmis või kuni peate liikuma järgmise juurde.

Selles etapis saab rakendada mitmeid kasulikke nippe. Pöörake joonist horisontaalselt, see aitab sageli paljastada proportsioonide ja varjutamise vigu. Võite ka värvi eemaldada – määrake küllastus nulliks, et mõista, kus peate varje muutma.

Müra tekitamine (närimine, segamine)

Seni oleme kasutanud peamiselt suuri, kindlaid varjulaike. Kuid on veel üks tehnika - dithering, mis võimaldab teil minna ühelt värvilt teisele ilma kolmandat lisamata. Vaadake allolevat näidet.

Pixel art algajatele: kasutusjuhised

Ülemine tumedast heledani gradient kasutab sadu erinevaid siniseid toone.

Keskmine gradient kasutab ainult üheksat värvi, kuid sellel on siiski liiga palju sama värvi toone. On olemas nn banding (inglise keelest band - riba), mille puhul jämedate ühtlaste triipude tõttu keskendub silm värvide endi asemel värvide kokkupuutepunktidele.

Alumisel gradiendil kasutasime triibutust, mis väldib triibutamist ja kasutab ainult kahte värvi. Loome erineva intensiivsusega müra, et simuleerida värvide gradatsiooni. See tehnika on väga sarnane trükkimisel kasutatava pooltooniga; samuti stippling (stippling - teraline pilt) - illustratsioonis ja koomiksites.

Orki peal tegin tekstuuri edasiandmiseks üsna palju segadust. Mõned pikslikunstnikud ei kasuta seda üldse, teised aga pole häbelikud ja teevad seda väga osavalt. Leian, et värvimine näeb kõige paremini välja suurtel aladel, mis on täidetud ühe värviga (vaadake ülaltoodud Metal Slugi ekraanipildil taevast) või aladel, mis peaksid välja nägema karedad ja ebaühtlased (nagu mustus). Otsustage ise, kuidas seda kasutada.

Kui soovite näha näidet suuremahulisest ja kvaliteetsest ditheringist, vaadake Briti 80ndate stuudio The Bitmap Brothersi mänge või PC-98 arvuti mänge. Pidage lihtsalt meeles, et need kõik on NSFW.

Pixel art algajatele: kasutusjuhised
Kakyusei (PC-98). Päkapikk, 1996
Sellel pildil on ainult 16 värvi!

8. Viimane pilk

Pixel art algajatele: kasutusjuhised

Pikslikunsti üks ohte on see, et see tundub kerge ja lihtne (oma struktuuri ja stiilipiirangute tõttu). Kuid lõpuks kulutate palju aega oma spraitide viimistlemisele. See on nagu mõistatus, mis vajab lahendamist, mistõttu pikslikunst meeldib perfektsionistidele. Pidage meeles, et üks sprait ei tohiks liiga kaua aega võtta – see on vaid pisike tükike äärmiselt keerulisest tükkide kogust. Oluline on mitte kaotada silmist suurt pilti.

Isegi kui teie pikslikunst pole mängimiseks mõeldud, tasub mõnikord endale öelda: "See on juba piisavalt hea!" Ja liigu edasi. Parim viis oskuste arendamiseks on läbida kogu protsess algusest lõpuni võimalikult palju kordi, kasutades võimalikult paljusid teemasid.

Ja vahel on kasulik sprait mõneks ajaks maha jätta, et seda veidi hiljem värske pilguga vaadata.

32 × 32 pikslit

Pixel art algajatele: kasutusjuhised

Lõime kõigepealt suure 96x96 piksliga spraiti, sest sellises suuruses sarnaneb see pigem joonistamise või maalimisega, aga piksliga. Mida väiksem sprite, seda vähem näeb see välja nagu see, mida see kuvama peaks, ja seda olulisem on iga piksel.

Pixel art algajatele: kasutusjuhised

Filmis Super Mario Bros. Mario silm on vaid kaks pikslit, mis on üksteise kohal. Ja tema kõrv ka. Tegelaste looja Shigeru Miyamoto ütles, et vuntsid olid vajalikud selleks, et eraldada nina ülejäänud näost. Nii et üks Mario näo põhijooni pole mitte ainult karakterikujundus, vaid ka pragmaatiline trikk. Mis kinnitab vana tarkust – "vajadus on leidlikkuse ema".

Oleme juba tuttavad 32×32 piksliga spraitide loomise põhietappidega: visand, värv, varjud, edasine viimistlemine. Aga sellistes tingimustes võtan väiksuse tõttu esialgse visandina üles värvilisi kujundeid, mitte piirjooni joonistada. Värv mängib tähemärgi määratlemisel olulisemat rolli kui piirjooned. Vaata veel kord Mariot, tal pole üldse piirjooni. Huvitavad pole mitte ainult vuntsid. Kõrvapõletused määravad tema kõrvade kuju, varrukad näitavad käsi ja üldine kuju peegeldab enam-vähem selgelt kogu keha.

Väikeste spraitide loomine on pidev kompromiss. Kui lisate löögi, võite kaotada ruumi varju jaoks. Kui teie tegelasel on selgelt määratletud käed ja jalad, ei ole pea tõenäoliselt väga suur. Tõhusa värvi, valikulise silitamise ja antialiasi kasutamine muudab renderdatud objekti tegelikust suuremana.

Väikeste spraitide puhul meeldib mulle chibi stiil: tegelased näevad väga armsad välja, neil on suured pead ja silmad. Suurepärane võimalus luua piiratud ruumis särav karakter ja üldiselt väga meeldiv stiil. Aga võib-olla tuleb näidata tegelase liikuvust või tugevust, siis saab peale vähem ruumi anda, et keha võimsam välja näeks. Kõik sõltub teie eelistustest ja eesmärkidest.

Pixel art algajatele: kasutusjuhised
Kogu meeskond on kohal!

Failivormingud

Pixel art algajatele: kasutusjuhised
Selline tulemus võib iga pikslikunstniku närvi ajada

Pilt, mida näete, on pildi JPG-vormingus salvestamise tulemus. Osa andmetest läks failitihendusalgoritmide tõttu kaduma. Kvaliteetne pikslikunst näeb lõpuks halb välja ja selle algsele paletile tagastamine ei ole lihtne.

Staatilise pildi salvestamiseks kvaliteeti kaotamata kasutage PNG-vormingut. Animatsioonide jaoks - GIF.

Kuidas pikslipilti õigesti jagada

Pikslite kunsti jagamine sotsiaalmeedias on suurepärane viis tagasiside saamiseks ja teiste samas stiilis töötavate kunstnikega kohtumiseks. Ärge unustage kasutada hashtagi #pixelart. Kahjuks teisendavad suhtlusvõrgustikud sageli PNG-vormingus JPG-vormingus ilma küsimata, halvendades sellega teie tööd. Ja alati pole selge, miks teie pilt teisendati.

Siin on mõned näpunäited, kuidas salvestada erinevate sotsiaalvõrgustike jaoks õige kvaliteediga pikslipilti.

puperdama

PNG-faili muutmiseks Twitteris kasutage vähem kui 256 värvi või tee kindlakset teie fail on alla 900 piksli pikk. Suurendaksin faili suurust vähemalt 512x512 pikslini. Ja nii, et skaleerimine oleks 100-kordne (200%, mitte 250%) ja teravad servad säiliksid (Photoshopis lähim naaber).

Animeeritud GIF-id Twitteri postituste jaoks olema ei kaalu rohkem kui 15 MB. Pilt peab olema vähemalt 800x800 pikslit, silmusanimatsiooni tuleb korrata kolm korda ja viimane kaader peab olema kõigist teistest poole väiksem – kõige populaarsem teooria. Samas pole selge, mil määral need nõuded peaksid olema täidetud, arvestades, et Twitter muudab pidevalt oma pildi kuvamise algoritme.

Instagramis

Minu teada pole võimalik Instagrami pilti postitada ilma kvaliteedi kadumiseta. Kuid see näeb kindlasti parem välja, kui tõstate selle vähemalt 512x512 pikslini.

Allikas: www.habr.com

Lisa kommentaar