Skvelé pixel art. Adobe Photoshop: Nakreslite a animujte postavu pomocou Pixel Art

Časť 6: Vyhladzovanie
Časť 7: Textúry a rozostrenie
Časť 8: Svet dlaždíc

Predslov

Existuje mnoho definícií pixelového umenia, ale tu použijeme toto: pixelový obrázok, ak je úplne ručne vyrobený, a existuje kontrola nad farbou a polohou každého nakresleného pixelu. Nepochybne v pixelovom umení zahrnutie alebo používanie štetcov alebo nástrojov na rozmazanie alebo degradačných strojov (nie som si istý) a iné softvérové ​​​​možnosti, ktoré sú „moderné“, nepoužívame (v skutočnosti, ktoré máme k dispozícii, znamená „k našim likvidácia“ , ale logicky sa to zdá správnejšie takto). Obmedzuje sa na nástroje ako „ceruzka“ a „výplň“.

Nedá sa však povedať, že by pixel art alebo non-pixel art grafika boli viac či menej pekné. Je spravodlivejšie povedať, že pixel art je iný a vhodnejší pre retro hry (ako Super Nintendo alebo Game Boy). Techniky, ktoré sa tu naučíte, môžete tiež skombinovať s inými než pixelovými umeleckými efektmi a vytvoriť tak hybridný štýl.

Takže tu sa naučíte technickú časť pixel artu. Nikdy z vás však neurobím umelca...z jednoduchého dôvodu, že nie som ani umelec. Nebudem vás učiť ľudskú anatómiu ani štruktúru umenia a nepoviem veľa o perspektíve. V tejto príručke nájdete veľa informácií o technikách pixelového umenia. Nakoniec budete musieť byť schopní vytvárať postavy a scenérie pre svoje hry, ak budete venovať pozornosť, pravidelne cvičiť a uplatňovať tieto tipy.

- Tiež chcem upozorniť, že len niektoré obrázky použité v tejto príručke sú zväčšené. V prípade obrázkov, ktoré nie sú zväčšené, by bolo dobré, keby ste si našli čas na kopírovanie týchto obrázkov, aby ste si ich mohli podrobne preštudovať. Pixel art je podstatou pixelov, je zbytočné ich študovať z diaľky.

Na záver musím poďakovať všetkým umelcom, ktorí sa ku mne pri tvorbe tohto sprievodcu pripojili tak či onak: Shinovi za jeho špinavú prácu a perokresbu, Xenohydrogen, za jeho farebného génia, Lunnovi, za jeho znalosť perspektívy a Panda, prísny Ahruon, Dayo a Kryon za ich veľkorysé príspevky na ilustráciu týchto stránok.

Vráťme sa teda k veci.

Časť 1: Správne nástroje

Zlá správa: v tejto časti nenakreslíte ani jeden pixel! (A to nie je dôvod na to, aby ste to preskočili, však?) Ak existuje príslovie, ktoré nemôžem vystáť, je to „neexistujú zlé nástroje, iba zlí pracovníci“. V skutočnosti som si myslel, že nič nemôže byť ďalej od pravdy (možno okrem „čo ťa nezabije, to ťa posilní“) a pixel art, veľmi dobrý dôkaz. Cieľom tejto príručky je zoznámiť sa s rôznymi softvérmi používanými na vytváranie pixelových obrázkov a pomôcť vám vybrať si ten správny.

1.Niektoré staré veci

Pri výbere softvéru na vytváranie pixelových obrázkov si ľudia často myslia: „Výber softvéru? To je šialenstvo! Všetko, čo potrebujeme na vytvorenie pixel artu, je farba! (zrejme slovná hračka, kreslenie a program)“ Tragická chyba: Hovoril som o zlých nástrojoch, toto je prvý. Paint má jednu výhodu (a iba jednu): ak používate Windows, už ju máte. Na druhej strane má veľa nedostatkov. Toto je (neúplný) zoznam:

* Nemôžete otvoriť viac ako jeden súbor súčasne
* Žiadna správa paliet.
* Žiadne vrstvy alebo priehľadnosť
* Žiadne iné ako obdĺžnikové výbery
* Niekoľko klávesových skratiek
* Strašne nepríjemné

Na Paint môžete skrátka zabudnúť. Teraz uvidíme skutočný softvér.

2. Na záver...

Ľudia si potom myslia: "Dobre, Paint je pre mňa príliš obmedzený, takže použijem svojho priateľa Photoshop (alebo Gimp alebo PaintShopPro, to je to isté), ktorý má tisíce možností." To môže byť dobré alebo zlé: ak už poznáte jeden z týchto programov, môžete urobiť pixel art (vypnutie všetkých možností automatického vyhladzovania a vypnutie mnohých pokročilých funkcií). Ak tieto programy ešte nepoznáte, potom strávite veľa času ich učením, aj keď nepotrebujete celú ich funkcionalitu, čo by bola strata času. Skrátka, ak ich používate dlhšie, môžete vytvárať pixel art (ja osobne používam Photoshop zo zvyku), ale inak je oveľa lepšie používať programy, ktoré sa špecializujú na pixel art. Áno, existujú.

3. Krém

Existuje oveľa viac pixelových umeleckých programov, ako by sa mohlo zdať, ale tu budeme brať do úvahy len tie najlepšie. Všetky majú veľmi podobné vlastnosti (ovládanie palety, náhľad opakujúcich sa dlaždíc, priehľadnosť, vrstvy atď.). Rozdiely majú v pohodlí ... a cene.

Charamaker 1999 je dobrý program, ale zdá sa, že distribúcia je pozastavená.

Graphics Gale je oveľa zábavnejšie a ľahšie sa používa a jeho cena sa pohybuje okolo 20 dolárov, čo nie je také zlé. Dodám, že skúšobná verzia nie je časovo obmedzená a je dodávaná s dostatočnou súpravou na vytvorenie dostatočne dobrej grafiky. Len to nejde s .gif, čo nie je až taký problém, keďže .png je aj tak lepšie.

Pixel umelci najčastejšie používajú softvér ProMotion, ktorý je (jasne) pohodlnejší a rýchlejší ako Graphics Gale. A áno, je vzácna! Plnú verziu si môžete kúpiť za skromnú sumu... 50 eur (78 dolárov).
Nezabudnime na našich priateľov Mac! Pixen je dobrý program dostupný pre Macintosh a je zadarmo. Bohužiaľ vám nemôžem povedať viac, pretože nemám Mac. Poznámka prekladateľa (francúzština): Používatelia Linuxu (a iní) by mali vyskúšať , a GrafX2 . Vyzývam vás, aby ste si ich všetky vyskúšali v demo verziách a zistili, ktorá vám vyhovuje. Nakoniec je to vec vkusu. Len si uvedomte, že keď začnete používať program, môže byť veľmi ťažké prejsť na niečo iné.

Pokračovanie nabudúce…

Poznámky prekladateľa z francúzštiny do angličtiny

Toto je skvelý sprievodca pixelovým umením, ktorý napísal Phil Razorback z LesForges.org. Veľká vďaka Philovi Razorbackovi, že umožnil OpenGameArt.org preložiť tieto návody a uverejniť ich tu. (Od prekladateľa do ruštiny: Nepýtal som si povolenie, ak má niekto túžbu, môžete pomôcť, nemám dostatok skúseností s komunikáciou v angličtine, nieto vo francúzštine).

Poznámka prekladateľa z angličtiny do ruštiny

Som programátor, nie umelec ani prekladateľ, prekladám pre svojich priateľov umelcov, ale čo dobré sa stratí, nech je tu.
Originál vo francúzštine niekde tu www.lesforges.org
Preklad z francúzštiny do angličtiny tu: opengameart.org/content/les-forges-pixel-art-course
Prekladal som z angličtiny, pretože neviem po francúzsky.
A áno, toto je môj prvý príspevok, takže návrhy na dizajn sú vítané. Plus je otázka, či zvyšné časti majú vyjsť ako samostatné články, alebo je lepšie aktualizovať a doplniť tento?

"itemprop="image">

V tomto 10-krokovom návode Ako kresliť pixelové umenie vás naučím, ako vytvoriť „šprta“ (jedinú 2D postavu alebo objekt). Samotný termín, samozrejme, pochádza z videohier.

Naučil som sa vytvárať pixel art, pretože som ho potreboval pre grafiku v mojej hre. Po rokoch tréningu som si na to zvykol a začal chápať, že pixel art je viac umenie ako len nástroj. Dnes je pixel art veľmi populárny medzi hernými vývojármi a ilustrátormi.

Tento tutoriál bol vytvorený pred mnohými rokmi, aby sa ľudia naučili jednoduché koncepty pixel artu, ale bol mnohokrát rozšírený, takže sa výrazne líši od pôvodnej verzie. Na webe je veľa návodov na rovnakú tému, ale všetky sa mi zdajú príliš komplikované alebo zdĺhavé. Pixel art nie je veda. Pri vytváraní pixelových obrázkov nemusíte počítať vektory.

Nástroje

Jednou z hlavných výhod vytvárania pixel artu je, že nepotrebujete žiadne pokročilé nástroje – mal by stačiť grafický editor, ktorý je štandardne nainštalovaný na vašom počítači. Za zmienku stojí, že existujú programy určené špeciálne na vytváranie pixel artov, ako napríklad Pro Motion alebo Pixen (pre používateľov Mac). Sám som ich netestoval, ale počul som veľa pozitívnych ohlasov. V tomto návode budem používať Photoshop, ktorý, aj keď to stojí veľa, obsahuje veľa užitočných nástrojov na vytváranie umenia, z ktorých niektoré sú veľmi užitočné na pixelizáciu.

Ako kresliť pixelové umenie vo Photoshope

Pri používaní Photoshopu bude vašou hlavnou zbraňou nástroj Pencil Tool (kláves B), ktorý je alternatívou k nástroju Brush Tool. Ceruzka umožňuje vyfarbiť jednotlivé pixely bez pretlačenia farieb.

Užitočné sú dva ďalšie nástroje: Výber (kláves M) a Čarovná palička (kláves W) na výber a pretiahnutie alebo kopírovanie a prilepenie. Pamätajte, že podržaním klávesu Alt alebo Shift počas výberu môžete vybrané objekty pridať alebo ich vylúčiť z aktuálneho zoznamu výberu. To je potrebné mimochodom, keď potrebujete vybrať nerovné objekty.

Na prenos farieb môžete použiť aj kvapkadlo. Existuje tisíc dôvodov, prečo je dôležité zachovať farby v pixel art, takže budete musieť vziať niekoľko farieb a použiť ich znova a znova.

Nakoniec sa uistite, že si zapamätáte všetky klávesové skratky, pretože vám to môže ušetriť veľa času. Všimnite si "X" prepínanie medzi primárnymi a sekundárnymi farbami.

linky

Pixely sú rovnaké malé farebné štvorce. Najprv musíte zistiť, ako efektívne usporiadať tieto štvorce, aby ste vytvorili čiaru, ktorú potrebujete. Pozrieme sa na dva najbežnejšie typy čiar: rovné a zakrivené.

rovné čiary

Viem, čo ste si mysleli: všetko je tu také jednoduché, že nemá zmysel sa do niečoho hrabať. Pokiaľ však ide o pixely, problémom môžu byť aj rovné čiary. Musíme sa vyhnúť zubatým častiam - malým úlomkom linky, ktoré spôsobujú, že vyzerá zubaté. Zobrazia sa, ak je jedna z častí čiary väčšia alebo menšia ako ostatné, ktoré ju obklopujú.

zakrivené čiary

Pri kreslení zakrivených čiar sa musíte uistiť, že pokles alebo vzostup je rovnomerný po celej dĺžke. V tomto príklade má úhľadný riadok intervaly 6 > 3 > 2 > 1, ale riadok s intervalmi 3 > 1< 3 выглядит зазубренной.

Schopnosť kresliť čiary je kľúčovým prvkom pixelového umenia. Trochu ďalej vám poviem o anti-aliasingu.

Konceptualizácia

Ak chcete začať, potrebujete dobrý nápad! Skúste si predstaviť, čo budete robiť v pixel arte - na papieri alebo len vo svojej mysli. Ak máte predstavu o kresbe, môžete sa sústrediť na samotnú pixeláciu.

Témy na zamyslenie

• Na čo bude tento sprite slúžiť? Je to pre web alebo pre hru? Bude potrebné ho neskôr animovať? Ak áno, bude potrebné, aby bol menší a menej podrobný. Naopak, ak nebudete so spritom v budúcnosti pracovať, môžete k nemu pripojiť toľko detailov, koľko potrebujete. Preto sa vopred rozhodnite, na čo presne je tento sprite potrebný a vyberte optimálne parametre.
• Aké sú obmedzenia? Už skôr som spomenul dôležitosť zachovania farieb. Hlavným dôvodom je obmedzená paleta farieb kvôli systémovým požiadavkám (čo je v našej dobe krajne nepravdepodobné) alebo kvôli kompatibilite. Alebo pre presnosť, ak emulujete konkrétny štýl C64, NES atď. Tiež stojí za to zvážiť rozmery vášho sprite a či príliš nevyčnieva na pozadí potrebných predmetov.

Vyskúšajme!

V tomto návode nie sú žiadne obmedzenia, ale chcel som sa uistiť, že môj pixel art je dostatočne veľký, aby ste mohli podrobne vidieť, čo sa deje v každom z krokov. Na tento účel som sa rozhodol použiť ako vzor Lucha Lawyera, postavu zo sveta wrestlingu. Skvele by sa hodil do bojovej hry alebo dynamického akčného filmu.

Okruh

Čierny obrys bude dobrým základom pre vášho sprite, takže tam začneme. Zvolili sme čiernu, pretože vyzerá dobre, ale aj trochu tmavá. Neskôr v tutoriále vám ukážem, ako zmeniť farbu obrysu, aby ste zvýšili realizmus.

Existujú dva prístupy k vytváraniu osnovy. Cestu môžete nakresliť voľnou rukou a potom ju trochu doladiť, alebo môžete všetko nakresliť po jednotlivých pixeloch. Áno, pochopili ste správne, hovoríme o tisícke kliknutí.

Výber metódy závisí od veľkosti sprite a vašich pixelových zručností. Ak je sprite skutočne obrovský, potom by bolo logickejšie ho nakresliť ručne, aby sa vytvoril hrubý tvar, a potom ho orezať. Verte mi, je to oveľa rýchlejšie, ako sa snažiť hneď nakresliť dokonalý náčrt.

V mojom návode vytvorím pomerne veľký sprite, takže tu bude ukázaná prvá metóda. Bude jednoduchšie, ak všetko názorne ukážem a vysvetlím, čo sa stalo.

Prvý krok: Hrubý obrys

Pomocou myši alebo tabletu nakreslite hrubý obrys svojho sprite. Uistite sa, že NIE JE PRÍLIŠ surová, t. j. vyzerá asi tak, ako vidíte váš konečný produkt.

Môj náčrt sa takmer úplne zhodoval s tým, čo som plánoval.

Krok dva: vyleštite obrys

Začnite zväčšením obrázka 6 alebo 8 krát. Musíte jasne vidieť každý pixel. A potom vyčistite obrys. Dávajte si pozor najmä na „blúdiace pixely“ (celý obrys by nemal mať hrúbku viac ako jeden pixel), zbavte sa zubatých okrajov a pridajte drobné detaily, ktoré nám v prvom kroku chýbali.

Dokonca aj veľké škriatkovia zriedka presahujú 200 x 200 pixelov. Fráza „urobte viac s menej“ je skvelý spôsob, ako opísať proces pixelizácie. Čoskoro uvidíte, že aj na jednom pixeli záleží.

Zjednodušte svoj obrys čo najviac. Detaily budeme riešiť neskôr, teraz treba popracovať na hľadaní veľkých pixelov, ako je napríklad segmentácia svalov. Veci momentálne nevyzerajú veľmi dobre, ale buďte trochu trpezliví.

Farba

Keď je obrys pripravený, dostaneme akési sfarbenie, ktoré je potrebné naplniť farbami. K tomu nám pomôžu farby, výplne a ďalšie pomôcky. Priraďovanie farieb môže byť zložité, ale teória farieb zjavne nie je témou tohto článku. Nech je to akokoľvek, existuje niekoľko základných pojmov, ktoré budete potrebovať vedieť.

Farebný model HSB

Toto je anglická skratka zostavená zo slov „Hue, Saturation, Brightness“. Je to len jeden z mnohých počítačových farebných modelov (alebo číselných vyjadrení farieb). Pravdepodobne ste už počuli o iných príkladoch ako RGB a CMYK. Väčšina obrázkových editorov používa na výber farieb HSB, preto sa naň zameriame.

Hue Odtieň je to, čo sme zvykli nazývať farbou.

Sýtosť– Sýtosť – určuje intenzitu farby. Ak je hodnota 100 %, ide o maximálny jas. Ak ju znížite, vo farbe sa objaví matnosť a „zošedne“.

jas- svetlo, ktoré vyžaruje farbu. Napríklad pre čiernu farbu je tento indikátor 0%.

Výber farieb

Rozhodnutie, ktoré farby si vyberiete, je len na vás, no treba mať na pamäti niekoľko vecí:

• Mäkké a desaturované farby vyzerajú realistickejšie ako kreslené.
• Myslite na farebné koliesko: čím ďalej sú na ňom dve farby, tým horšie sa miešajú. Zároveň červená a oranžová, ktoré sú v tesnej blízkosti, spolu vyzerajú skvele.

• Čím viac farieb použijete, tým bude vaša kresba vyzerať rozmazanejšie. Preto si vyberte pár základných farieb a použite ich. Pamätajte, že Super Mario bol svojho času vytvorený výlučne z kombinácií hnedej a červenej.

Aplikácia kvetov

Nanášanie farby je veľmi jednoduché. Ak používate Photoshop, potom stačí vybrať požadovaný fragment, vybrať ho čarovným prútikom (kláves W) a potom ho vyplniť hlavnou farbou (Alt-F) alebo sekundárnou farbou Ctrl-F.

tienenie

Tieňovanie je jednou z najdôležitejších súčastí výpravy stať sa pixelovaným polobohom. V tomto štádiu škriatok buď začína vyzerať lepšie, alebo sa mení na zvláštnu hmotu. Postupujte podľa mojich pokynov a určite uspejete.

Prvý krok: vyberte zdroj svetla

Najprv si vyberieme zdroj svetla. Ak je váš sprite súčasťou väčšieho fragmentu, ktorý má svoje vlastné svetlá, ako sú lampy, baterky atď. A všetky z nich môžu ovplyvniť vzhľad sprite rôznymi spôsobmi. Výber vzdialeného zdroja svetla, akým je slnko, je však skvelý nápad pre väčšinu pixel artov. Napríklad pri hrách budete musieť vytvoriť čo najjasnejšieho sprita, ktorý sa potom dá prispôsobiť prostrediu.

Väčšinou volím vzdialené svetlo niekde hore pred spritom, takže svieti len predná a vrchná časť sprita a zvyšok je zatienený.

Druhý krok: Priame tieňovanie

Keď sme si vybrali zdroj svetla, môžeme začať stmavovať oblasti, ktoré sú od neho najďalej. Náš model osvetlenia naznačuje, že spodná časť hlavy, rúk, nôh atď. by mala byť pokrytá tieňom.

Pripomeňme si, že ploché veci nemôžu vrhať tieň. Vezmite si kus papiera, pokrčte ho a rozvaľkajte po stole. Ako vieš, že už nie je plochý? Práve si videl tiene okolo neho. Pomocou tieňovania zvýraznite záhyby na oblečení, svaly, srsť, farbu pleti atď.

Tretí krok: jemné tiene

Druhý odtieň, ktorý je svetlejší ako prvý, by sa mal použiť na vytvorenie jemných tieňov. Je to potrebné pre oblasti, ktoré nie sú priamo osvetlené. Môžu sa použiť aj na prechod zo svetla do tmy a na nerovné povrchy.

Krok štyri: osvetlené miesta

Zvýrazniť treba aj miesta, ktoré dostávajú priame lúče svetla. Stojí za zmienku, že svetiel by malo byť menej ako tieňov, inak spôsobia zbytočnú pozornosť, to znamená, že vyniknú.

Ušetrite si bolesti hlavy zapamätaním si jednoduchého pravidla: najprv tiene, potom svetlá. Dôvod je jednoduchý: ak nie sú žiadne tiene, odkryjú sa príliš veľké úlomky a keď tiene nanesiete, bude ich treba zmenšiť.

Niektoré užitočné pravidlá

Tiene sú pre začiatočníkov vždy ťažké, preto je tu niekoľko pravidiel, ktoré musíte pri tieňovaní dodržiavať.

1. Nepoužívajte prechody. Najčastejšia chyba nováčika. Prechody vyzerajú hrozne a ani sa nepribližujú tomu, ako sa svetlo hrá na povrchoch.
2. Nepoužívajte "mäkké tieňovanie". Hovorím o situácii, keď je tieň príliš ďaleko od obrysu, pretože potom vyzerá veľmi rozmazane a bráni odhaleniu zdroja svetla.
3. Nepoužívajte príliš veľa tieňov. Je ľahké si myslieť, že "čím viac farieb - tým realistickejší obraz." Nech je to akokoľvek, v reálnom živote sme zvyknutí vidieť veci v tmavých alebo svetelných spektrách a náš mozog odfiltruje všetko medzi tým. Použite len dve tmavé farby (tmavú a veľmi tmavú) a dve svetlé farby (svetlú a veľmi svetlú) a navrstvite ich na základnú farbu, nie na seba.
4. Nepoužívajte príliš podobné farby. Naozaj nie je potrebné používať takmer identické farby, okrem prípadov, keď chcete vytvoriť skutočne rozmazaného sprite.

dithering

Zachovanie farieb je to, čomu tvorcovia pixel artu skutočne musia venovať pozornosť. Ďalší spôsob, ako získať viac tieňov bez použitia viacerých farieb, sa nazýva „dithering“. Rovnako ako v tradičnej maľbe sa používa „šrafovanie“ a „šrafovanie“, to znamená, že v doslovnom zmysle získate niečo medzi dvoma farbami.

Jednoduchý príklad

Tu je jednoduchý príklad toho, ako možno rozložiť dve farby, aby sa vytvorili štyri možnosti tieňovania.

Pokročilý príklad

Porovnajte obrázok vyššie (vytvorený pomocou gradientu vo Photoshope) s obrázkom vytvoreným iba s tromi farbami pomocou rozkladu. Upozorňujeme, že na vytvorenie "susedných farieb" možno použiť rôzne vzory. Princíp ľahšie pochopíte, ak si niekoľko vzorov vytvoríte sami.

Aplikácia

Dithering môže dať vášmu sprite pekný retro vzhľad, pretože veľa prvých videohier túto techniku ​​intenzívne využívalo kvôli malému počtu dostupných farebných paliet (ak chcete vidieť veľa príkladov ditheringu, pozrite si hry vyvinuté pre Sega Genesis). Sám túto metódu veľmi často nepoužívam, ale na vzdelávacie účely vám ukážem, ako sa dá aplikovať na nášho šprtíka.

Dither môžete používať podľa vlastného uváženia, ale stojí za zmienku, že len málo ľudí ho skutočne úspešne používa.

Selektívne kontúrovanie

Selektívne kontúrovanie, ktoré sa nazýva aj selout (z anglického selected outlining), je poddruh obrysového tieňovania. Namiesto čiernej linky vyberáme farbu, ktorá bude na vašom spritovi pôsobiť harmonickejšie. Tiež meníme jas tejto cesty smerom k okrajom sprite, čo umožňuje zdroju farieb určiť, ktoré farby by sme mali použiť.

Až do tohto bodu sme používali čierny obrys. Na tom nie je nič zlé: čierna vyzerá skvele a tiež vám umožňuje kvalitatívne rozlíšiť sprite od pozadia jeho okolitých objektov. Ale použitím tejto metódy obetujeme určitý realizmus, ktorý by sme v niektorých prípadoch mohli potrebovať, keďže náš sprite aj naďalej vyzerá ako karikatúra. Selektívne kontúrovanie vám umožní zbaviť sa toho.

Všimnete si, že som použil seult na zmäkčenie jeho svalov. Nakoniec náš sprite začne vyzerať ako celok a nie ako veľké množstvo samostatných fragmentov.

Porovnajte to s originálom:

1. Vyhladzovanie

Princíp anti-aliasingu je jednoduchý: pridanie medziľahlých farieb do kinks, aby vyzerali hladšie. Ak máte napríklad čiernu čiaru na bielom pozadí, k jej zlomom pozdĺž okraja sa pridajú malé sivé pixely.

Technika 1: vyhladenie kriviek

Vo všeobecnosti je potrebné pridať stredné farby tam, kde sú prestávky, inak bude čiara vyzerať zubaté. Ak stále vyzerá nerovnomerne, pridajte ďalšiu vrstvu svetlejších pixelov. Smer nanášania medzivrstvy musí zodpovedať smeru krivky.

Myslím, že to neviem lepšie vysvetliť bez toho, aby som to skomplikoval. Stačí sa pozrieť na obrázok a pochopíte, čo tým myslím.

Technika 2: zaoblenie nerovností

Technika 3: Prepísanie konca riadku

Aplikácia

Teraz aplikujme antialiasing na našu tlač. Všimnite si, že ak chcete, aby váš sprite vyzeral dobre na akejkoľvek farbe pozadia, nevyhladzujte vonkajšiu časť linky. V opačnom prípade je váš sprite obklopený veľmi nevhodnou svätožiarou na križovatke s pozadím, a preto bude na akomkoľvek pozadí príliš zreteľne vystupovať.

Efekt je veľmi jemný, ale má veľký význam.

Prečo to musíte robiť ručne?

Možno sa pýtate: "Prečo na nášho sprite jednoducho nepoužijeme filter grafického editora, ak chceme, aby vyzeral hladko?" Odpoveď je tiež jednoduchá – žiadny filter neurobí váš šprt tak ostrý a čistý ako ručne vyrobený. Budete mať plnú kontrolu nielen nad použitými farbami, ale aj nad tým, kde ich použiť. Okrem toho viete lepšie ako ktorýkoľvek filter, kde bude vyhladávanie vhodné a kde sú oblasti, v ktorých pixely jednoducho stratia svoju kvalitu.

Dokončovanie

Wow, už sme veľmi blízko k tomu, aby sme mohli vypnúť počítač a vziať si studené pivo z chladničky. Ale ešte neprišiel! Posledná časť je o tom, čo delí energického amatéra od ostrieľaného profesionála.

Urobte krok späť a dobre sa pozrite na svojho sprite. Je tu možnosť, že stále vyzerá „surovo“. Nájdite si čas na zlepšenie a uistite sa, že je všetko dokonalé. Bez ohľadu na to, ako ste unavení, tá najzábavnejšia časť je pred vami. Pridajte podrobnosti, aby váš sprite vyzeral zaujímavejšie. Tu vstupujú do hry vaše pixelové zručnosti a skúsenosti.

Možno vás prekvapí, že náš právnik Lucha celý ten čas nemal oči alebo že balík, ktorý drží, je prázdny. V skutočnosti dôvod spočíva v tom, že som chcel počkať s malými detailmi. Všimnite si tiež ozdobu, ktorú som mu pridala na rukávniky, muchu na nohaviciach... no, čo by bol muž bez bradaviek? Trochu som mu stmavil aj spodnú časť trupu, aby ruka viac trčala na pozadí tela.

Konečne ste skončili! Lucha Lawyer súťaží v kategórii Lightweight, pretože má iba 45 farieb (možno je to ťažká váha v závislosti od vašich obmedzení palety) a jej rozlíšenie je približne 150 x 115 pixelov. Teraz môžete otvoriť pivo!

Celý pokrok:

Vždy je to smiešne. Tu je gif zobrazujúci vývoj nášho sprite.

1. Naučte sa základy umenia a praktizujte tradičné techniky. Všetky vedomosti a zručnosti potrebné na kreslenie a kreslenie je možné uplatniť pri pixelovaní.
2. Začnite s malými škriatkami. Najťažšou časťou je naučiť sa umiestniť veľa detailov s použitím čo najmenšieho počtu pixelov bez toho, aby boli sprity veľké ako ja.
3. Študujte diela umelcov, ktorých obdivujete, a nebojte sa byť neoriginálni. Najlepší spôsob, ako sa naučiť, je opakovať úryvky z práce iných ľudí. Vytvorenie vlastného štýlu si vyžaduje veľa času.
4. Ak tablet nemáte, kúpte si ho. Neustále nervové zrútenia a stres spôsobený neustálym klikaním ľavým tlačidlom myši nie sú zábavné a je nepravdepodobné, že by zapôsobili na predstaviteľov opačného pohlavia. Používam malý Wacom Graphire2 - páči sa mi jeho kompaktnosť a prenosnosť. Možno sa vám bude páčiť väčší tablet. Pred kúpou si urobte malú skúšobnú jazdu.
5. Podeľte sa o svoju prácu s ostatnými, aby ste získali ich názor. Môže to byť tiež dobrý spôsob, ako si nájsť nových geekovských priateľov.

P.S.

Pôvodný článok sa nachádza. Ak máte odkazy na skvelé návody, ktoré je potrebné preložiť, pošlite ich do našej párty miestnosti. Alebo píšte priamo do správ skupiny

Pixel Art (Pixel Art) – v preklade z angličtiny ako pixel art. Pixel je najmenší grafický prvok v digitálnom obrázku.

Pixel Art teda doslova znamená umenie maľovania pomocou pixelov.

Pre prehľadnosť sa pozrime na tento príklad:

Owlboy (pixlová umelecká hra)

Takto vyzerajú pixelartové hry.

Veľmi často sa takáto grafika používa v nezávislých hrách, pretože majú veľmi rozpoznateľný štýl počítačových hier.

Pixel Art však nie je len grafika, škriatok a obrázky pre hry, to je celý smer digitálneho a grafického umenia.

Krásne obrázky sú nakreslené pomocou pixel artu:

Tento retro grafický štýl si s ničím nepomýlite.

Niektoré maľby v tomto štýle sú celkom hodné, aby sa odohrávali na vašej pracovnej ploche.


Existujú aj veľmi cool umelci, ktorí pracujú v tomto štýle.

Pozrite sa na tento obrázok. Každý pixel tu bol nakreslený samostatne a ručne. Je to ako skladanie mozaiky, ako to robili kedysi a robia to aj teraz.

Ak tento obrázok zväčšíme, môžeme zblízka vidieť, ako sa všetko robí:

Jedinečný štýl pixelového umenia spočíva v tom, že existujú pomerne ostré farebné prechody a žiadne vyhladzovanie. Zoberme si napríklad inú prácu v digitálnej grafike na pomerne priemernej úrovni, pozrite si túto kresba dievčaťa s okuliarmi(18+) na blogu www.econdude.pw.

Ide o kresbu počítačovou myšou v programe SAI2.0.

Ak však priblížite tento obrázok, môžete vidieť rozklad:

Neexistujú žiadne jasné prechody farieb a odtieňov, ale v pixelovom umení sú prechody jasné.

Pozrite si napríklad, ako môžete urobiť prechody medzi farbami v pixel art:

Toto je približný obrázok, ak sa naň pozriete z diaľky s vysokým rozlíšením, prechod farieb bude celkom hladký, ale tu môžete vidieť jasnosť a konzistenciu štýlu.

Tu je ďalší príklad, toto je celkom klasická kresba picquel:

http://www.gamer.ru/everything/pixel-art-dlya-nachinayuschih

Keď priblížite, obrázky nevyzerajú veľmi pekne, ale ak sa na pixel art pozriete z diaľky, s vyšším rozlíšením, môže to vyzerať úžasne.

Viete si predstaviť, akú skvelú prácu títo umelci robia?

Niekedy hovoria, že Pixel Art sa robí preto, že je lacnejší, hovoria, že nezávislí vývojári jednoducho nemajú prostriedky na vytvorenie modernej 3D grafiky, a tak používajú to najjednoduchšie, čo ich napadne, kreslenie v základoch grafických editorov pixelov.

Každý, kto niekedy kreslil čokoľvek v štýle Pixel Art, vám však povie, že ide o grafický štýl takmer najnáročnejší na zdroje (v prvom rade na čas).

Animácia v štýle Pixel Art a celkovo pekelná práca.

http://www.dinofarmgames.com/a-pixel-artist-renounces-pixel-art/

Preto treba stále dokazovať, že Pixel Art je “lenivý štýl”, dokonca by som povedal, že to naopak nie je ten najlenivejší grafický štýl.

Nakresliť niečo jednoduché v štýle Pixel Art sa však môže naučiť každý a nepotrebujete na to žiadne špeciálne programy, stačí jednoduchý grafický editor.

Ak sa chcete naučiť kresliť týmto štýlom, potrebujete ako v každom inom prípade veľa cviku a môžete začať napríklad z článkov o Habrém: Kurz pixelového umenia

Nájdete tam aj základné princípy pixel artu.

Tu je jeden príklad, ako kresliť pixel art (zrýchlené video - rýchlosť kreslenia) na úrovni začiatočníkov, môžete sa naučiť kresliť takto už za týždeň:

Pixelart:: kresba vesmírnej lode

Niekedy sú v tomto štýle urobené úplne šialené kresby, nemôžem ani uveriť, že to niekto nakreslil a chcem vedieť, koľko času na tom strávil. Príklad:

https://www.youtube.com/watch?v=vChMzRnw-Hc

Vidíte tento obrázok Sarah Carrigan zo StarCraft? Čo je to podľa teba a ako sa to robí?

Tento muž postavil z kociek v hre minecraftb, práca trvala 23 týždňov.

V aproximácii môžete vidieť, že toto všetko sú samostatné bloky.

Formálne to už nie je pixel art, ale dokonca „minecraft block art“, ale podstata štýlu zostáva rovnaká a toto je podľa autora najväčšia kresba pixel art a svetový rekord.

V skutočnosti, ak analyzujete akúkoľvek fotografiu alebo obrázok v aproximácii, je zrejmé, že pozostáva aj z pixelov, ako každý obrázok vo všeobecnosti. Ale celý rozdiel je v tom, že pixel art sa vytvára ručne pre každý pixel.

Pre ďalší príklad, umelci a animátori Paul Robertson a Ivan Dixon vytvorili toto:

SIMPSONS PIXELY

Pripadá mi to ako gigantické dielo a aj s použitím niektorých doplnkových nástrojov (existujú filtre, ktoré z obrázkov urobia pixel art) by to trvalo veľmi dlho.

Osobne si myslím, že obrázky Pixel Art sú skutočným moderným umením v tom najlepšom zmysle slova.

Každý obrázok Pixel Art má veľmi jasnú hodnotu a môžete to vidieť, môžete to cítiť.

To vie oceniť aj človek, ktorý tomu dobre nerozumie.

Tento žáner umenia však, žiaľ, nie je veľmi populárny a dnes je považovaný za prekonaný a návrat k nemu v posledných rokoch v podobe mnohých hier od steamu v štýle pixel artu tiež začína ľudí otravovať. Aj keď osobne si myslím, že tento retro štýl grafiky je už klasika a skutočná klasika nikdy nezomrie.

Kreslenie na úrovni pixelov má vo výtvarnom umení svoje vlastné miesto. Pomocou jednoduchých pixelov vznikajú skutočné majstrovské diela. Samozrejme, môžete vytvárať takéto kresby na hárku papiera, ale je oveľa jednoduchšie a správnejšie vytvárať obrázky pomocou grafických editorov. V tomto článku budeme podrobne analyzovať každého zástupcu takéhoto softvéru.

Najpopulárnejší grafický editor na svete, ktorý je schopný pracovať na úrovni pixelov. Ak chcete vytvoriť takéto obrázky v tomto editore, stačí vykonať niekoľko krokov predkonfigurácie. Všetko, čo umelec potrebuje na tvorbu umenia, je tu.

Ale na druhej strane, na kreslenie pixel art nie je potrebné také množstvo funkcií, takže nemá zmysel preplácať program, ak ho budete používať iba na určitú funkciu. Ak ste jedným z týchto používateľov, odporúčame vám venovať pozornosť iným zástupcom, ktorí sa zameriavajú špeciálne na pixelovú grafiku.

PyxelEdit

Tento program má všetko, čo potrebujete na vytvorenie takýchto obrazov, a nie je presýtený funkciami, ktoré umelec nikdy nebude potrebovať. Nastavenie je celkom jednoduché, v palete farieb je možné zmeniť ľubovoľnú farbu na požadovaný tón a voľný pohyb okien vám pomôže prispôsobiť si program pre seba.

PyxelEdit má funkciu tile-to-canvas, ktorá sa môže hodiť pri vytváraní objektov s podobným obsahom. Skúšobná verzia je k dispozícii na stiahnutie na oficiálnych stránkach a nemá žiadne obmedzenia na používanie, takže si produkt pred kúpou môžete ohmatať.

Pixelformer

Z hľadiska vzhľadu a funkčnosti je to najbežnejší grafický editor, len má niekoľko ďalších funkcií na vytváranie pixelových obrázkov. Toto je jeden z mála programov, ktoré sú distribuované úplne zadarmo.

Vývojári neumiestňujú svoj produkt ako vhodný na vytváranie pixel artu, nazývajú to skvelý spôsob kreslenia log a ikon.

GraphicsGale

Takmer vo všetkých takýchto softvéroch sa snažia zaviesť systém animácie obrázkov, ktorý sa najčastejšie ukazuje ako jednoducho nepoužiteľný z dôvodu obmedzených funkcií a nesprávnej implementácie. V GraphicsGale tiež nie je všetko také dobré, ale aspoň sa s touto funkciou dá normálne pracovať.

Pokiaľ ide o kreslenie, všetko je úplne rovnaké ako vo väčšine editorov: základné funkcie, veľká farebná paleta, schopnosť vytvárať viac vrstiev a nič zbytočné, čo by mohlo prekážať pri práci.

charamaker

Character Maker 1999 je jedným z najstarších takýchto programov. Bol vytvorený na vytvorenie jednotlivých postáv alebo prvkov, ktoré by sa potom použili v iných programoch na animáciu alebo vložené do počítačových hier. Preto sa na tvorbu obrazov veľmi nehodí.

Rozhranie nie je veľmi dobré. Takmer žiadne okná nemožno presúvať ani meniť ich veľkosť a predvolené rozloženie nie je najlepšie. Dá sa však na to zvyknúť.

Pro Motion NG

Tento program je ideálny takmer vo všetkom, od premysleného rozhrania, kde je možné presúvať okná nezávisle od hlavného do ľubovoľného bodu a meniť ich veľkosť a končiac automatickým prechodom z kvapkadla na ceruzku, ktorá je len neuveriteľne pohodlná funkcia.

V opačnom prípade je Pro Motion NG len dobrý softvér na vytváranie pixelových obrázkov akejkoľvek úrovne. Skúšobnú verziu si môžete stiahnuť z oficiálnej stránky a otestovať, aby ste sa mohli rozhodnúť o ďalšom nákupe plnej verzie.

aseprit

Môže byť právom považovaný za najpohodlnejší a najkrajší program na vytváranie pixel art. Samotný dizajn rozhrania niečo stojí, ale to nie sú všetky výhody Aseprite. Má schopnosť animovať obrázok, ale na rozdiel od predchádzajúcich predstaviteľov je implementovaný správne a je vhodný na použitie. Je tu všetko pre vytvorenie krásnych GIF animácií.

V tomto návode sa naučíte, ako premeniť fotografiu osoby na pixel art ako fiktívnu postavu z arkádovej hry zo začiatku 90. rokov.
James May - aka Smudgethis - vyvinul tento štýl v roku 2011 pre hudobné video pre dubstepový rockový počin. Nerov prvý hit Me & You – kde vytvoril animáciu zobrazujúcu starú hru s dvoma Nerovými členmi. Hra bola 2D rytmická plošinovka so 16-bitovou grafikou podobnou Double Dragon, ale oveľa lepšia ako 8-bitové retro klasické hry ako Super Mario Bros.
Na vytvorenie tohto štýlu musia byť postavy stále hranaté, ale zložitejšie ako staršie hry. A hoci na dosiahnutie vzhľadu musíte použiť obmedzenú paletu farieb, nezabudnite, že tieto hry mali stále 65 536 farieb.
Tu vám James ukáže, ako vytvoriť postavu z fotografie pomocou jednoduchej farebnej palety a nástroja Ceruzka.
Rovnako ako sprievodca animáciou budete potrebovať aj fotografiu osoby. James použil fotografiu punka, ktorá je zahrnutá v súboroch projektu pre tento tutoriál.
Po dokončení si pozrite tento 16-bitový návod na animáciu After Effects, v ktorom vám James ukáže, ako vziať túto postavu do AE, animovať ju a aplikovať efekty retro hier.

Krok 1

Otvorte Sprievodcu animáciou (16 bit) .psd a 18888111.jpg (alebo fotografiu podľa vlastného výberu), ktorú môžete použiť ako základ pre postavu. Profilová fotografia v plnej dĺžke bude fungovať najlepšie a pomôže vám získať farebné palety a štýly pre váš 16-bitový tvar.
Sprievodca animáciou má niekoľko pozícií na samostatných vrstvách. Vyberte si tú, ktorá sa najlepšie hodí k póze na vašej fotke - keďže v ráme nemáme nohy, zvolil som štandardnú pózu na úrovni 1.

Krok 2

Pomocou nástroja Rectangular Marquee Tool (M) vyberte hlavu z vašej fotografie a skopírujte ju (Cmd /Ctrl + C) a vložte ju (Cmd /Ctrl + V) do Sprievodcu animáciou (16bit).psd.
Prispôsobte obrázok proporcionálne. Všimnete si, že keďže sú rozmery PSD veľmi malé, obraz začne okamžite kresliť pixel.

Krok 3

Vytvorte novú vrstvu a nakreslite obrys jednopixelovou čiernou ceruzkou (B), pričom použite sprievodcu animáciou, ktorý je v nej poskytnutý, a fotografiu ako základ. \ P
Dodávaný sprievodca pomáha rozvíjať rad postáv od väčších figúrok šéfov alebo tenších ženských. Toto je približný návod na skladanie a animáciu postáv z mojich pixelových umeleckých diel.

Krok 4

Pomocou nástroja kvapkadlo (I) otestujte oblasť s najtmavším odtieňom pokožky na fotografii a vytvorte malý farebný štvorec. Urobte to ešte trikrát, aby ste vytvorili štvortónovú paletu odtieňov pleti.
Vytvorte ďalšiu vrstvu pod obrysovou vrstvou a pomocou 1-pixelového štetca a 4-farebnej farebnej palety vytieňujte obrázok (ako sprievodcu opäť použite fotografiu). \ P
Najlepšie je ponechať si všetky prvky vášho umeleckého diela alebo rôzne vrstvy, pretože to uľahčuje ich opätovné použitie na iné tvary. Toto je obzvlášť užitočné pre „zloduchov“, pretože väčšina 16-bitových hier používa veľmi podobné čísla. Napríklad jeden kamarát môže mať červenú košeľu a nôž, zatiaľ čo ďalší je identický s výnimkou modrej košele a pištole.

Krok 5

Opakujte tento postup pre ostatné časti postavy, pričom látku vytieňujte tak, aby zodpovedala ostatným prvkom na pôvodnej fotografii. Nezabudnite pokračovať vo vzorkovaní pomocou nástroja kvapkadlo, aby ste najskôr vytvorili palety farieb, pretože to poskytuje konzistentnú sadu farieb, ktorá vyzerá skvele a vyhovuje relatívne obmedzenej palete farieb 16-bitových hier.

Krok 6

Pridajte údaje na vylepšenie svojej postavy pomocou odtieňov, tetovaní, náušníc a ďalších. Dajte si tu večeru a premýšľajte o tom, ako chcete, aby sa vaša postava objavila v hernom prostredí. Možno môžu používať sekeru alebo mať robotickú ruku?

Krok 7

Ak chcete oživiť svoju postavu, zopakujte predchádzajúce kroky pomocou ďalších piatich vrstiev sprievodcu animáciou. Zvládnutie tohto procesu a vytvorenie plynulých výsledkov môže chvíľu trvať, ale opätovným použitím prvkov z predchádzajúcich snímok sa dajú skrátiť. Napríklad v tejto sekvencii šiestich snímok zostáva hlava nezmenená.

Krok 8

Ak chcete skontrolovať, či je sekvencia animácie v poriadku, otvorte panel Animácia vo Photoshope a uistite sa, že je vybratá iba prvá snímka animácie. Pri vytváraní animácie môžete pridávať nové snímky a zapínať a vypínať vrstvy, ale najrýchlejším spôsobom je použiť príkaz „Vytvoriť snímky z vrstiev“ v rozbaľovacej ponuke panela (vpravo hore).
Prvý rámec je prázdne pozadie, takže ho vyberte a kliknutím na ikonu koša na paneli (v spodnej časti) ho odstráňte.