Eng yaxshi piksel san'ati. Pixel art: eng yaxshi asarlar va rassomlar




Pixel Art bugungi kunda ham o'yinlar uchun juda mashhur va buning bir qancha sabablari bor!

Shunday qilib, Pixel Art-ni nima o'ziga jalb qiladi:

  1. Idrok. Pixel Art ajoyib ko'rinadi! Spritedagi har bir piksel haqida ko'p narsalarni aytib berishingiz mumkin.
  2. Nostalji. Pixel Art Nintendo, Super Nintendo yoki Genesis (men kabi!) o'ynagan o'yinchilar uchun ajoyib nostaljik tuyg'uni qaytaradi.
  3. O'rganish qulayligi. Pixel Art - bu o'rganishning eng oson raqamli san'at turlaridan biri, ayniqsa siz rassomdan ko'ra ko'proq dasturchi bo'lsangiz;]

Shunday qilib, Pixel Art -da qo'lingizni sinab ko'rmoqchimisiz? O'z o'yiningizda foydalanishingiz mumkin bo'lgan oddiy, ammo samarali o'ynaladigan personajni qanday yaratishni ko'rsatayotganim uchun men bilan birga yuring! Bundan tashqari, bonus sifatida biz uni iPhone o‘yinlariga qanday qo‘shishni ko‘rib chiqamiz!

Muvaffaqiyatli o'rganish uchun sizga Adobe Photoshop kerak bo'ladi. Agar sizda yo'q bo'lsa, Adobe veb-saytidan yoki torrentdan bepul sinov versiyasini yuklab olishingiz mumkin.

Pixel Art nima?

Boshlashdan oldin, keling, Pixel Art nima ekanligini aniqlab olaylik, bu siz o'ylagandek ravshan emas. Pixel Art nima ekanligini aniqlashning eng oson yo'li nima bo'lmasligini, ya'ni piksellar avtomatik ravishda yaratilgan hamma narsani belgilashdir. Mana bir nechta misollar:

Gradient: Ikki rangni tanlang va ular orasidagi piksellar rangini hisoblang. Ajoyib ko'rinadi, lekin Pixel Art emas!

Xiralashtirish vositasi: Oldingi rasmning yangi versiyasini yaratish uchun piksellarni aniqlang va ularni takrorlang / tahrirlang. Shunga qaramay, piksel san'ati emas.

Silliqlash vositasi(asosan, biror narsani "silliq" qilish uchun turli xil ranglarda yangi piksellarni yaratish). Siz ulardan qochishingiz kerak!

Ba'zilar, hatto avtomatik ravishda yaratilgan ranglar ham Pixel Art emas, deyishadi, chunki ular effektlarni aralashtirish uchun qatlamni o'z zimmalariga oladilar (ma'lum bir algoritmga muvofiq ikkita qatlam o'rtasida piksellarni aralashtirish). Ammo ko'pchilik qurilmalar hozirda millionlab ranglar bilan shug'ullanganligi sababli, bu bayonotni e'tiborsiz qoldirish mumkin. Biroq, oz sonli ranglardan foydalanish Pixel artida yaxshi amaliyotdir.

Boshqa vositalar kabi (chiziq) yoki bo'yoq paqir vositasi(bo'yoq paqiri) ham avtomatik ravishda piksellar hosil qiladi, lekin siz ularni to'ldirilgan piksellarning chekkalarini tekislamaslik uchun sozlashingiz mumkinligi sababli, bu vositalar Pixel Art uchun qulay hisoblanadi.

Shunday qilib, biz Pixel Art -ni har bir pikselni sprite -ga, ko'pincha qo'lda va cheklangan ranglar palitrasida joylashtirishda katta e'tibor talab qilishini aniqladik. Endi ishga kirishaylik!

Ishning boshlanishi

Birinchi Pixel Art aktivini yaratishni boshlashdan oldin, Pixel Art-ni o'lchash mumkin emasligini bilishingiz kerak. Agar siz uni kamaytirishga harakat qilsangiz, hamma narsa loyqa ko'rinadi. Agar siz uni kattalashtirishga harakat qilsangiz, ko'p sonli 2 o'lchovdan foydalansangiz, hamma narsa yaxshi ko'rinadi (lekin, albatta, bu keskin bo'lmaydi).

Ushbu muammoning oldini olish uchun siz avval o'yin xarakteringiz yoki o'yin elementingiz qanchalik katta bo'lishi kerakligini tushunib olishingiz va keyin boshlashingiz kerak. Bu ko'pincha siz maqsad qilib qo'ygan qurilmaning ekran o'lchamiga va qancha "piksel" ko'rishni xohlashingizga bog'liq.

Misol uchun, agar siz iPhone 3GS ekranida o'yin ikki baravar kattaroq ko'rinishini xohlasangiz ("Ha, men o'z o'yinimga pikselli retro ko'rinishni bermoqchiman!"), Ekran o'lchamlari 480x320 piksel bo'lsa, unda sizga kerak bo'ladi. Yarim o'lchamda ishlaydi, bu holda u 240x160 piksel bo'ladi.

Yangi Photoshop hujjatini oching ( Fayl → Yangi ...) va oʻlchamni oʻyin ekraningiz oʻlchamiga oʻrnating, soʻngra xarakteringiz uchun oʻlchamni tanlang.

Har bir hujayra 32x32 pikseldan iborat!

Men 32 × 32 pikselni tanladim, chunki u nafaqat tanlangan ekran o'lchami uchun ajoyib, balki 32 × 32 piksel ham 2 ga ko'paytiriladi, bu o'yinchoq dvigatellari uchun qulaydir (plitka o'lchamlari ko'pincha 2 ga ko'paytiriladi, teksturalar tekislanadi). 2 ga ko'plik va boshqalar.

Agar siz ishlatayotgan dvigatel har qanday tasvir hajmini qo'llab -quvvatlasa ham, siz har doim bir xil pikselli piksellar bilan ishlashga harakat qilishingiz mumkin. Bunday holda, agar tasvirni masshtablash kerak bo'lsa, o'lcham yaxshiroq taqsimlanadi, bu oxir-oqibatda yaxshi ishlashga olib keladi.

Pixel Art xarakterini qanday chizish mumkin

Pixel Art aniq va oson o‘qiladigan grafiklar sifatida tanilgan: yuz xususiyatlarini, ko‘zlarini, sochlarini, tana qismlarini bir necha nuqta bilan aniqlash mumkin. Biroq, tasvirlarning o'lchami vazifani murakkablashtiradi: sizning xarakteringiz qanchalik kichik bo'lsa, ularni chizish shunchalik qiyin bo'ladi. Vazifaga amaliyroq yondashish uchun, xarakterning eng kichik xususiyatlarini tanlang. Men har doim ko'zlarni tanlayman, chunki ular xarakterga hayot berishning eng yaxshi usullaridan biridir.

Photoshop-da tanlang Qalam vositasi(Qalam vositasi). Agar uni topa olmasangiz, asbobni bosib ushlab turing Cho'tkasi vositasi(Brush Tool) va siz uni darhol ko'rasiz (u ro'yxatda ikkinchi bo'lishi kerak). Siz shunchaki uning o'lchamini 1px ga o'zgartirishingiz kerak (asboblar parametrlari panelini bosishingiz va uning hajmini o'zgartirishingiz mumkin yoki shunchaki [) tugmachasini bosib ushlab turing.

Sizga ham kerak bo'ladi O'chirish vositasi(Eraser Tool), shuning uchun ustiga bosing (yoki E tugmachasini bosing) va ochiladigan ro'yxatdan tanlash orqali uning sozlamalarini o'zgartiring. Rejim:(Rejim :) Qalam(Qalam) (chunki bu rejimda taxallusga qarshi vosita yo'q).

Endi piksellashni boshlaylik! Quyidagi rasmda ko'rsatilganidek, qoshlar va ko'zlarni chizing:


hey! Men pikselliman !!

Siz allaqachon Lineart -dan boshlashingiz mumkin (chizish chiziqlar yordamida amalga oshirilganda), lekin yanada amaliy usul - bu belgi siluetini chizish. Yaxshi xabar shundaki, bu bosqichda professional bo'lish shart emas, shunchaki tana qismlarining o'lchamlarini (bosh, tana, qo'llar, oyoqlar) va qahramonning boshlang'ich pozasini tasavvur qilishga harakat qiling. Kul rangda shunday bir narsa qilib ko'ring:


Ushbu bosqichda professional bo'lishingiz shart emas
E'tibor bering, men ham bo'sh joy qoldirdim. To'liq tuvalni to'ldirishning hojati yo'q, kelajakda suratga olish uchun joy qoldiring. Bunday holda, ularning barchasi uchun bir xil tuval o'lchamini saqlash juda foydali bo'ladi.

Siluetni tugatganingizdan so'ng, vaqt keladi ... Endi siz piksellarni joylashtirishda ehtiyot bo'lishingiz kerak, shuning uchun kiyim-kechak, qurol-aslaha va hokazolar haqida hali tashvishlanmang. Xavfsiz tomonda bo'lish uchun siz asl siluetingizni hech qachon yo'qotmaslik uchun yangi qatlam qo'shishingiz mumkin.


Agar siz qalam asbobini chizish uchun juda sekin deb hisoblasangiz, har doim foydalanishingiz mumkin (Chiziq vositasi), shuni esda tutingki, siz piksellarni qalam bilan aniq joylashtira olmaysiz. Siz sozlashingiz kerak bo'ladi quyida ko'rsatilganidek:

Iltimos tanlang bosib ushlab turish orqali To'rtburchaklar vositasi(To'rtburchaklar vositasi)

Ochiladigan ro'yxatdagi asboblar parametrlari paneliga o'ting Asboblar rejimini tanlang(Chizma kontur rejimi) Pixel-ni tanlang, o'zgartiring Og'irligi(Qalinligi) 1px (agar bajarilmagan bo'lsa) va belgini olib tashlang Anti-alias(tekislash). Sizda shunday bo'lishi kerak:

E'tibor bering, men oyoqlar uchun pastki konturni qilmaganman. Bu ixtiyoriy, chunki oyoqlar ajralib turish uchun oyoqlarning unchalik muhim qismi emas va bu sizga tuvaldagi bir qator piksellarni tejash imkonini beradi.

Ranglar va soyalarni qo'llang

Endi siz bizning xarakterimizni bo'yashni boshlashga tayyormiz. To'g'ri ranglarni tanlash haqida tashvishlanmang, ularni keyinroq o'zgartirish juda oson bo'ladi, faqat har bir kishi o'z rangiga ega ekanligiga ishonch hosil qiling. Yorliqdagi standart ranglardan foydalaning Namunalar(Oyna → Swatches).

Xarakteringizni quyidagi rasmdagi kabi ranglang (lekin ijodkorlik bilan shug'ullaning va o'z rangingizdan foydalaning!)


Chiroyli, qarama-qarshi rang aktivingizning o'qilishini yaxshilaydi!
E'tibor bering, men hali kiyim yoki soch konturlarini tuzmaganman. Har doim esda tuting: keraksiz konturlardan iloji boricha ko'proq piksellarni saqlang!

Har bir pikselni bo'yashga vaqt sarflamang. Ishingizni tezlashtirish uchun bir xil rangdagi chiziqlardan foydalaning yoki Paqirni bo'yash vositasi(Bo'yoq paqir vositasi) bo'shliqlarni to'ldirish uchun. Aytgancha, uni ham sozlash kerak bo'ladi. Iltimos tanlang Paqirni bo'yash vositasi asboblar panelida (yoki shunchaki G tugmasini bosing) va o'zgartiring Bardoshlik(Tolerantlik) 0 ga, shuningdek, katakchani olib tashlang Anti-alias(tekislash).

Agar biror marta foydalanish kerak bo'lsa Sehrli tayoqchalar vositasi(Sehrli tayoqcha vositasi) - juda foydali vosita bo'lib, u bir xil rangdagi barcha piksellarni tanlaydi, so'ngra uni Paint Bucket vositasi bilan bir xil tarzda sozlaydi - tolerantlik yoki anti-aliasing yo'q.

Sizdan ba'zi bilimlarni talab qiladigan keyingi qadam yorug'lik va soya qilishdir. Agar siz yorug'lik va qorong'u tomonlarni qanday ko'rsatishni bilmasangiz, quyida men sizga kichik ko'rsatma beraman. Agar sizda uni o'rganishga vaqtingiz va xohishingiz bo'lmasa, siz ushbu bosqichni o'tkazib yuborishingiz va "Palitrangizni ziravor qilish" bo'limiga o'tishingiz mumkin, chunki siz mening misolimdagi kabi soyangizni yaratishingiz mumkin!


Butun ob'ekt uchun bir xil yorug'lik manbasidan foydalaning

Shaklni xohlaganingizcha berishga harakat qiling / mumkin, chunki shundan keyin aktiv yanada qiziqarli ko'rinishni boshlaydi. Masalan, endi siz burun, burishgan ko'zlar, sochlarning shoki, shimlarning burmalari va boshqalarni ko'rishingiz mumkin. Bundan tashqari, unga engil joylarni qo'shishingiz mumkin, bu yanada yaxshi ko'rinadi:


Soya qilishda bir xil yorug'lik manbasidan foydalaning

Va endi, men va'da qilganimdek, yorug'lik va soyalar bo'yicha kichik qo'llanma:

Palitrangizni ziravor qiling

Ko'p odamlar standart palitrasi ranglarini ishlatishadi, lekin ko'pchilik bu ranglardan foydalangani uchun biz ularni ko'plab o'yinlarda ko'rishimiz mumkin.

Photoshop o'zining standart palitrasida ranglarning katta tanloviga ega, ammo siz unga juda ko'p ishonmasligingiz kerak. Asboblar panelining pastki qismidagi asosiy palitrani bosish orqali o'zingizning ranglaringizni yaratganingiz ma'qul.

Keyin, Rang tanlash oynasida rangni tanlash uchun o'ng yon panelni ko'rib chiqing va kerakli yorqinlikni (ochroq yoki quyuqroq) va to'yinganlikni (to'yinganroq yoki xiraroq) tanlash uchun asosiy maydonni ko'rib chiqing.


Istaganingizni topgach, OK va tugmasini bosing Paint Bucket asbobini qayta sozlang... Xavotir olmang, shundan so'ng siz shunchaki "Qo'shni" katagiga belgini olib tashlashingiz mumkin va siz yangi rang bilan bo'yasangiz, bir xil fon rangiga ega bo'lgan har qanday yangi piksel ham bo'yaladi.

Bu oz sonli ranglar bilan ishlash va har doim bir xil element (ko'ylak, soch, dubulg'a, zirh va boshqalar) uchun bir xil rangdan foydalanish muhimligining yana bir sababidir. Ammo boshqa joylar uchun turli xil ranglardan foydalanishni unutmang, aks holda bizning chizilgan rasmimiz ortiqcha bo'yalgan bo'ladi!

Tanlangan piksellarni bir xil rangga bo'yash uchun "Qo'shni" belgisini olib tashlang

Agar xohlasangiz, ranglarni o'zgartiring va yanada jozibali belgi oling! Siz hatto konturlarni qayta bo'yashingiz mumkin, shunchaki ular fon bilan yaxshi uyg'unligiga ishonch hosil qiling.


Nihoyat, fon rangi testini bajaring: xarakteringiz ostida yangi qatlam yarating va uni turli ranglar bilan to'ldiring. Bu sizning xarakteringiz yorug'lik, qorong'ilik, issiq va sovuq fonda ko'rinishini ta'minlash uchun kerak.


Ko'rib turganingizdek, men hozirgacha ishlatgan barcha vositalarda antialiasingni o'chirib qo'ydim. Buni boshqa vositalarda ham qilishni unutmang, masalan, Elliptik marquee(Oval marquee) va Lasso(Lasso).

Ushbu asboblar yordamida siz tanlangan qismlarning o'lchamlarini osongina o'zgartirishingiz yoki hatto ularni aylantirishingiz mumkin. Buni amalga oshirish uchun istalgan tanlash vositasidan foydalaning (yoki M tugmachasini bosing), hududni tanlang, sichqonchaning o'ng tugmachasini bosing va tanlang Bepul aylantirish(Bepul aylantirish) yoki shunchaki Ctrl + T tugmalarini bosing. Tanlov hajmini o'zgartirish uchun o'zgartirish maydonining perimetri bo'ylab tutqichlardan birini torting. Proporsiyalarni saqlab qolgan holda tanlov hajmini o'zgartirish uchun Shift tugmachasini bosib ushlab turing va burchak tutqichlaridan birini torting.

Biroq, Photoshop funksiya bilan tahrirlangan hamma narsani avtomatik ravishda tekislaydi Bepul aylantirish shuning uchun tahrirlashdan oldin ga o'ting Tartibga solish -> Tanlovlar -> Umumiy(Ctrl + K) va o'zgartiring Rasm interpolyatsiyasi(Rasm interpolyatsiyasi) yoqilgan Eng yaqin qo'shni(Eng yaqin qo'shni). Bir so'z bilan aytganda, bilan Eng yaqin qo'shni yangi pozitsiya va o'lcham juda qo'pol hisoblab chiqiladi, yangi ranglar yoki shaffoflar qo'llanilmaydi va siz tanlagan ranglar saqlanib qoladi.


Pixel Art-ni iPhone o'yinlariga integratsiya qilish

Ushbu bo'limda siz Cocos2d o'yin tizimidan foydalanib, pikselli san'atimizni iPhone o'yiniga qanday qo'shishni o'rganasiz. Nega men faqat iPhone haqida o'ylayapman? Chunki Unity haqidagi bir qator maqolalar (masalan: yoki Unity 2D-da Jetpack Joyride uslubida o'ynash) tufayli siz Unity-da ular bilan qanday ishlashni va Crafty (Brauzer o'yinlari: Snake) haqidagi maqolalardan allaqachon bilasiz. va Impact (Brauzer Impact o'yinlarini yaratishga kirish) siz ularni kanvas ichiga joylashtirish va brauzer o'yinlarini yaratishni o'rgandingiz.

Agar siz Cocos2D yoki umuman iPhone ilovalarini ishlab chiqishda yangi bo'lsangiz, men sizga Cocos2d va iPhone qo'llanmalaridan birini boshlashingizni maslahat beraman. Agar sizda Xcode va Cocos2d o'rnatilgan bo'lsa, o'qing!

Yangi loyiha yarating iOS → cocos2d v2.x → cocos2d iOS shabloni, uni PixelArt deb nomlang va qurilmangiz sifatida iPhone-ni tanlang. Yaratilgan piksel tasvirini sprite_final.png kabi loyihangizga torting va keyin oching HelloWorldLayer.m va ishga tushirish usulini quyidagi bilan almashtiring:

- (id) init (agar ((o'zini =)) (CCSprite * qahramon =; hero.position = ccp (96, 96); hero.flipX = YES ;;) o'zini qaytarish;)

Biz spraytni ekranning chap tomoniga joylashtiramiz va uni o'ng tomonga qaratib aylantiramiz. Kompilyatsiya qiling, ishga tushiring va keyin ekranda spraytingizni ko'rasiz:


Biroq, esda tutingki, biz ushbu qo'llanmada avvalroq muhokama qilganimizdek, biz har bir piksel boshqalardan sezilarli darajada ajralib turishi uchun piksellarni sun'iy ravishda kattalashtirishni xohladik. Shunday qilib, init usuli ichida ushbu yangi qatorni qo'shing:

Hero.scale = 2.0;

Hech qanday murakkab narsa yo'q, to'g'rimi? Kompilyatsiya qiling, yuguring va ... kuting, bizning sprite xira!

Buning sababi shundaki, sukut bo'yicha, Cocos2d rasmni o'lchaganda tekislaydi. Bu bizga kerak emas, shuning uchun quyidagi qatorni qo'shing:

Bu chiziq Cocos2d-ni antialiasingsiz tasvirlarni masshtablash uchun sozlaydi, shuning uchun bizning yigitimiz hali ham "pikselli" ko'rinadi Kompilyatsiya qiling, ishga tushiring va ... ha, u ishlaydi!


Pixel Art grafiklaridan foydalanishning afzalliklariga e'tibor bering - biz ekranda ko'rsatilganidan kichikroq tasvirni ishlatishimiz mumkin, bu esa juda ko'p tekstura xotirasini tejash imkonini beradi. Retina displeylari uchun alohida tasvirlar yaratishimiz shart emas!

Keyingisi nima?

Umid qilamanki, sizga ushbu qo'llanma yoqdi va piksel san'ati haqida bir oz ko'proq ma'lumotga ega bo'ldingiz! Ajralishdan oldin men sizga ba'zi maslahatlar bermoqchiman:

  • Har doim aktivlaringiz uchun anti-aliasing, gradient yoki juda ko'p ranglardan foydalanmaslikka harakat qiling. Bu sizning foydangiz uchun, ayniqsa siz hali ham yangi boshlovchi bo'lsangiz.
  • Agar siz haqiqatan ham retro uslubiga taqlid qilmoqchi bo'lsangiz, 8 yoki 16 bitli konsol o'yinlaridagi rasmlarga qarang.
  • Ba'zi uslublar qorong'u konturlardan foydalanmaydi, boshqalari yorug'lik yoki soyaning ta'sirini hisobga olmaydi. Hammasi uslubga bog'liq! Bizning darsimizda biz soyalarni chizmadik, lekin bu ularni ishlatmaslik kerak degani emas.

Yangi boshlanuvchilar uchun Pixel Art o'rganish uchun eng oson grafik bo'lishi mumkin, lekin aslida u ko'rinadigan darajada oddiy emas. O'z mahoratingizni oshirishning eng yaxshi usuli - bu amaliyot, amaliyot, amaliyot. Men o'z ishingizni Pixel Art forumlarida joylashtirishni tavsiya qilaman, shunda boshqa rassomlar sizga maslahat berishi mumkin - bu sizning texnikangizni yaxshilashning ajoyib usuli! Kichikdan boshlang, ko'p mashq qiling, fikr-mulohazalarni oling va sizga ko'p pul va quvonch keltiradigan ajoyib o'yin yaratishingiz mumkin!

20-asrda kompyuter o'yinlari piksel grafikasini qo'llashning keng maydoniga aylandi, ayniqsa 90-yillarda. 3D-grafikaning rivojlanishi bilan pikselli san'at pasaya boshladi, ammo keyin veb-dizaynning rivojlanishi, mobil telefonlar va mobil ilovalarning paydo bo'lishi tufayli hayotga qaytdi.

Pixel art - bu bitmap grafik muharrirlarida bajariladigan raqamli shaklda tasvirni yaratish uchun maxsus texnika bo'lib, unda rassom bitmap raqamli tasvirning eng kichik birligi - piksel bilan ishlaydi. Bunday tasvir kichik o'lchamlari bilan ajralib turadi, bunda har bir piksel aniq ko'rinadi. Piksel san'ati rasmning murakkabligiga qarab uzoq vaqt va mashaqqatli bajariladi - piksel piksel.

Piksel san'atining asosiy qoidalari

Piksel san'atining eng muhim tarkibiy qismi bu chiziqli san'at deb ataladigan narsa - boshqacha aytganda, uning konturlari. Piksel san'ati chiziqlar yordamida amalga oshiriladi - tekis va kavisli.

To'g'ri chiziqlar

Piksel san'atida chiziqlar chizish qoidasi shundaki, ular chizish paytida bir pikselni yon tomonga siljitadigan segmentlardan iborat bo'lishi kerak. Piksel san'atini boshlagan rassomlarning asosiy xatosidan qoching: piksellar bir-biriga tegmasligi va to'g'ri burchak hosil qilishi kerak.

To'g'ri chiziqlar bo'lsa, siz qiyshiq to'g'ri chiziqlarning taniqli naqshlaridan birini ishlatib, o'zingizni osonlashtirishingiz mumkin:

Rasmdan ko'rinib turibdiki, unda ko'rsatilgan barcha to'g'ri chiziqlar yon tomonga bir piksel masofaga siljigan bir xil pikselli segmentlardan iborat bo'lib, eng mashhurlari bir, ikki va to'rt pikselli segmentlardir. Piksel san'atidagi bunday oddiy to'g'ri chiziqlar "ideal" deb ataladi.

To'g'ri chiziqlar boshqa naqshga ega bo'lishi mumkin, masalan, siz ikkita pikselli segmentlarni bitta segment bilan almashtirishingiz mumkin, ammo bunday chiziqlar unchalik chiroyli ko'rinmaydi, ayniqsa tasvir kattalashtirilganda, garchi ular piksel san'ati qoidalarini buzmasa ham. .

Egri chiziqlar

To'g'ri chiziqlarni chizish osonroq, chunki ular burilishdan saqlanadilar, bu esa egri chiziqlar uchun emas. Ularning qurilishi qiyinroq, ammo egri chiziqlar tekis chiziqlarga qaraganda tez-tez chizilgan bo'lishi kerak.

Piksellardan to'g'ri burchak hosil qilishni taqiqlashdan tashqari, egri chiziqlarni chizishda ularning joy almashish tabiati haqida eslash kerak. Piksel segmentlarining uzunligi bir tekisda, asta-sekin o'zgarishi kerak - silliq ko'tariladi va xuddi shunday silliq tushadi. Pikselli grafiklar bukilishlarga yo'l qo'ymaydi.

Qo'lingizning bir harakati bilan siz hech qanday qoidalarni buzmasdan mukammal egri chiziq chiza olmaysiz, shuning uchun siz ikkita usuldan foydalanishingiz mumkin: bitta pikselni ikkinchisiga chizish orqali chiziqlarni bajaring yoki oddiy egri chizib, keyin to'g'rilang. Bu tugagan "ramka" dan qo'shimcha piksellarni olib tashlash orqali.

Dithering

Piksel san'atida dithering kabi narsa mavjud. Bu rang o'tish effektini yaratish uchun turli rangdagi piksellarni aralashtirishning o'ziga xos usuli.

Yoritishning eng mashhur usuli - bu pog'onali piksellar:

Bu usul rang palitrasida texnik cheklovlar tufayli paydo bo'lgan, chunki binafsha rangni olish uchun shaxmat taxtasida qizil va ko'k piksellarni chizish kerak edi:

Keyinchalik, dithering ko'pincha tasvirlardagi yorug'lik va soya tufayli tovushni etkazish uchun ishlatilgan:

To'q rangli pikselli san'at yaxshi ishlashi uchun ranglarni aralashtirish maydoni kengligi kamida ikki piksel bo'lishi kerak.

Pixel art dasturiy ta'minot

San'atni pikselli tarzda yaratishni o'zlashtirish uchun siz ushbu rasm turini qo'llab-quvvatlaydigan har qanday grafik muharriridan foydalanishingiz mumkin. Barcha rassomlar o'zlarining xohishlariga ko'ra turli xil dasturlar bilan ishlaydilar.

Bugungi kunga qadar ko'p odamlar Windows operatsion tizimining taniqli standart dasturi - Microsoft Paint-da piksellar bilan bo'yashni afzal ko'rishadi. Ushbu dasturni o'rganish haqiqatan ham oson, lekin bu ham uning kamchiligi - bu juda ibtidoiy, masalan, qatlamlar va ularning shaffofligi bilan ishlashni qo'llab-quvvatlamaydi.

Demo versiyasini Internetda bepul topish mumkin bo'lgan yana bir oson pikselli san'at dasturi - GraphicsGale. Dasturning kamchiliklari, ehtimol, pikselli san'atni .gif formatida saqlashni qo'llab -quvvatlamasligidir.

Mac foydalanuvchilari bepul Pixen dasturini sinab ko'rishlari mumkin. Linux operatsion tizimining foydalanuvchilari esa GrafX2 va JDraw dasturlarini o'zlari sinab ko'rishlari kerak.

Va, albatta, pikselli san'at yaratishning ajoyib varianti - bu Adobe Photoshop dasturi bo'lib, u keng imkoniyatlarga ega, qatlamlar bilan ishlashga imkon beradi, shaffoflikni qo'llab-quvvatlaydi va palitra bilan oson ishlashni ta'minlaydi. Ushbu dastur yordamida biz pikselli tasvirni o'zimiz chizishning oddiy misollarini ko'rib chiqamiz.

Photoshop-da piksellarni qanday chizish mumkin

An'anaviy tasviriy san'atda bo'lgani kabi, piksel san'atida ham shakl, soya va yorug'lik juda muhim, shuning uchun pikselli san'atni qanday chizishni o'rganishdan oldin, chizmachilik asoslari bilan tanishish uchun qiynaling - qog'ozga qalam bilan chizishni mashq qiling.

"Balon" chizish

Keling, eng oddiy narsadan boshlaylik - oddiy sharni chizamiz. Photoshop-da 72 dpi tezlikda yangi fayl yarating. Tasvirning o'lchamlarini katta o'rnatishning ma'nosi yo'q - bu piksel san'ati. Qattiq va shaffof bo'lmagan cho'tkani tanlang, o'lchamini 1 pikselga o'rnating.

Chapdan o'ngga, pastdan yuqoriga kichik yarim yoy egri chizig'ini torting. Piksel san'ati qoidalarini eslang: segmentlarning bir xil nisbatlarini saqlang, ularni piksel bilan yon tomonga siljiting, hech qanday burmalar yoki to'g'ri burchaklar qoldirmang. Keyin to'pning yuqori qismini chizish orqali bu yoyni aks ettiring.

Xuddi shu printsipdan foydalanib, to'pning pastki qismini va ipni torting. Paint Bucket asbobi yordamida sharni qizil rang bilan to'ldiring. Endi hajm qo'shish kerak - bizning to'pimiz juda tekis ko'rinadi. Balonning pastki o'ng tomoniga to'q qizil chiziq torting, so'ngra bu sohaga o'ting. Balonning yuqori chap burchagida oq piksellar bilan ajratib ko'rsatish.

Ko'ryapsizmi, bu qanchalik oson - to'p tayyor!

"Robot" chizish

Keling, an'anaviy tarzda rasm chizishga harakat qilaylik va shundan keyingina biz piksel san'ati qoidalarini buzadigan piksellarni tozalaymiz.

Yangi hujjatni ochish, kelajakdagi robotning taxminiy eskizini yaratish:

Endi siz to'sqinlik qiladigan hamma narsani tozalashingiz va kerak bo'lganda piksellarni bo'yashingiz mumkin:

Xuddi shu tarzda robotning pastki tanasini torting. To'g'ri joylarda "mukammal" to'g'ri chiziqlar chizish imkoniyatini qo'ldan boy bermang.

Robotning tanasini batafsil ko'rsating. Ko'pgina tajribali rassomlar sizga ishni boshlashdan oldin o'zingizga palitrani tayyorlashni maslahat berishadi - asaringizni pikselli tarzda yaratishda foydalanadigan ranglar to'plami. Bu tasvirning yaxlitligini ta'minlashga imkon beradi. Photoshop ish maydonining bo'sh maydonida palitrani yarating - masalan, kvadratchalar yoki rangli dog'lar shaklida. Shundan so'ng, kerakli rangni tanlash uchun uni Damlatish vositasi bilan bosing.

Siz konturlarni to'ldirishni boshlashingiz mumkin. Robotning korpusidagi asosiy rangni "bo'yash". Bizda bu rang bor - lavanta ko'k.

Konturning rangini o'zgartiring - uni quyuq ko'k bilan to'ldiring. Chizmangizda yorug'lik manbai qayerda ekanligini aniqlang. Bizda u robotning yuqorisida va o'ng tomonida joylashgan. Keling, hajm qo'shib, xarakterimizning ko'kragini chizamiz:

O'ng tomonda, tananing konturidan o'tib, rasmdagi eng chuqur soyani belgilang. Bu soyadan, qirralardan markazgacha yorug'lik manbasining mo'ljallangan joylarida yo'qoladigan engilroq soyani bo'yab qo'ying:

Yorug'likni aks ettirishi kerak bo'lgan barcha sohalarda robotga diqqatga sazovor joylarni qo'shing:

Robotning oyoqlariga soya va yorug'lik bilan silindrsimon ko'rinish bering. Xuddi shu tarzda, robotning ko'kragidagi doiralardan teshiklar qiling:

Keling, yuqorida muhokama qilgan pikselli art elementni - ditheringni tananing soyali joylariga qo'shish orqali rasmni yaxshilaylik.

Oyoqlarda bo'lgani kabi, diqqatga sazovor joylardan ham qochish mumkin - ular allaqachon juda kichik. Robotning boshidagi tishlar o'rniga perchinlar qatorini tasvirlash uchun quyuq va ochiq piksellardan foydalaning, shuningdek, kulgili antennani qo'shing. Bizga robotning qo'li unchalik yaxshi chizilmagandek tuyuldi - agar siz ham xuddi shunday muammoga duch kelsangiz, Photoshop-da ob'ektni kesib oling va uni pastga siljiting.

Hammasi shu - bizning kulgili pikselli robotimiz tayyor!

Va bu video yordamida siz Photoshop -da pikselli art -animatsiya qilishni o'rganasiz:


O'zingiz uchun oling, do'stlaringizga ayting!

Bizning veb -saytimizda ham o'qing:

ko'proq ko'rsatish

Hozirgi kunda Photoshop, Illustrator, Korel kabi dasturlar dizayner va illyustrator ishini osonlashtiradi. Ularning yordami bilan siz o'tgan asrning oxirida bo'lgani kabi, piksellarni joylashtirish bilan chalg'itmasdan to'liq ishlashingiz mumkin. Barcha kerakli hisob-kitoblar dasturiy ta'minot - grafik muharrirlar tomonidan amalga oshiriladi. Ammo boshqa yo'nalishda emas, balki butunlay qarama-qarshi yo'nalishda ishlaydigan odamlar bor. Ya'ni, ular o'zlarining ishlarida noyob natija va atmosferani olish uchun piksellarni o'sha eski maktab tartibi bilan shug'ullanishadi.

Pikselli san'at namunasi. Fragment.

Ushbu maqolada biz piksel san'ati bilan shug'ullanadigan odamlar haqida gapirmoqchimiz. Ularning eng yaxshi asarlarini diqqat bilan ko'rib chiqing, ularni amalga oshirishning murakkabligi uchun, mubolag'asiz, zamonaviy san'at asarlari deb atash mumkin. Nafasingizni olib ketadigan asarlar.

Pixel Art. Eng yaxshi asarlar va rassomlar


Shahar. Muallif: Zoggles


Ertak qal'asi. Muallif: Tinuleaf


O'rta asr qishlog'i. Muallif: Docdoom


Bobilning osilgan bog'lari. Muallif: Oy tutilishi


Turar joy maydoni. Muallif:

Pikselli san'at(defissiz yozilgan) yoki pikselli grafika- piksel darajasida tasvirlarni yaratishdan iborat bo'lgan raqamli san'at yo'nalishi (ya'ni tasvirni tashkil etadigan minimal mantiqiy birlik). Hamma rastrli tasvirlar pikselli tasvir emas, garchi ularning barchasi piksellardan iborat. Nega? Chunki, oxir-oqibat, pikselli san'at tushunchasi nafaqat natijani, balki illyustratsiyani yaratish jarayonini ham o'z ichiga oladi. Piksel-piksel, va shunchaki. Agar siz raqamli suratga tushsangiz, uni kattaroq kichraytiring (piksellar ko'rinadigan bo'lsin) va uni noldan chizganingizni da'vo qiling - bu haqiqiy soxtalik bo'ladi. Garchi mashaqqatli mehnatingiz uchun sizni maqtaydigan sodda odamlar bo'lsa ham.

Ushbu texnikaning aynan qachon tug'ilganligi hozir noma'lum, ildizlar 1970-yillarning boshlarida bir joyda yo'qolgan. Biroq, kichik elementlardan tasvirlar yaratish texnikasi mozaika, o'zaro to'qish, gilam to'qish va boncuk kabi san'atning ancha qadimiy turlariga borib taqaladi. Piksel san'atining ta'rifi bilan bir xil "piksel san'ati" iborasi birinchi marta ACM Communications jurnalidagi (1982 yil dekabr) Adele Goldberg va Robert Flegalning maqolasida ishlatilgan.

Piksel san'ati kompyuter o'yinlarida eng keng qo'llaniladigan dasturni oldi, bu ajablanarli emas - bu sizga resurslarga muhtoj bo'lmagan va ayni paytda juda chiroyli ko'rinishga ega bo'lgan tasvirlarni yaratishga imkon berdi (rassomdan ko'p vaqt talab qiladigan va ma'lum mahorat talab qiladigan, va shuning uchun yaxshi maoshni nazarda tutadi) ... Rivojlanishning eng yuqori nuqtasi bo'lgan gullash davri rasmiy ravishda 2 va 3-avlod konsollarida (1990-yillarning boshlari) video o'yinlar deb ataladi. Texnologiyaning keyingi rivojlanishi, birinchi navbatda 8 bitli rangning paydo bo'lishi, keyin esa Haqiqiy rang, uch o'lchovli grafikaning rivojlanishi - bularning barchasi vaqt o'tishi bilan piksel san'atini ikkinchi va uchinchi rejalarga olib keldi va keyin butunlay pikselli san'at mavjud bo'lib tuyuldi. oxiriga yetsin.

G'alati, ammo 90-yillarning o'rtalarida pikselli grafikani so'nggi o'rinlarga ko'targan va keyinroq uni o'yinga qaytargan janob Ilmiy-texnika taraqqiyoti - mobil telefonlar va PDA ko'rinishidagi mobil qurilmalarni dunyoga ko'rsatgan. Axir, yangi paydo bo'lgan qurilma qanchalik foydali bo'lmasin, siz ham, men ham bilamizki, agar siz unda solitaire o'ynay olmasangiz, u hech narsaga arzimaydi. Xo'sh, past piksellar soniga ega ekran bo'lgan joyda piksel san'ati mavjud. Ular aytganidek, yana xush kelibsiz.

Albatta, turli xil retrograd sozlangan elementlar pikselli grafikani qaytarishda o'z rolini o'ynadi, bolalikdagi yaxshi eski o'yinlarga achinishni yaxshi ko'rardi, shu bilan birga: "Oh, ular hozir bunday qilmaydilar"; piksel san'atining go'zalligini baholay oladigan estetalar va zamonaviy grafik go'zallikni sezmaydigan hind ishlab chiquvchilari (va ba'zida kamdan -kam hollarda, ularni o'z loyihalarida qanday amalga oshirishni bilmaydilar), shuning uchun ular piksel san'atini haykaltarosh qilishadi. . Biroq, keling, hali ham sof tijorat loyihalarini - mobil qurilmalar uchun ilovalar, reklama va veb-dizayn uchun chegirma qilaylik. Shunday qilib, endi pikselli san'at, ular aytganidek, tor doiralarda keng tarqalgan va "hamma uchun emas" o'ziga xos san'at maqomiga ega bo'lgan. . Garchi bu oddiy odam uchun juda qulay bo'lsa -da, chunki bu texnikada ishlash uchun qo'lda kompyuter va oddiy grafik muharriri bo'lsa kifoya! (Aytgancha, chizish qobiliyati ham zarar qilmaydi) Yetarli so'zlar, nuqtaga o'ting!

2. Asboblar.

Pixel art yaratish uchun nima kerak? Yuqorida aytib o'tilganidek, piksel darajasida ishlashga qodir kompyuter va har qanday grafik muharrir etarli. Siz istalgan joyda, hatto Game Boy-da, hatto Nintendo DS-da yoki hatto Microsoft Paint-da chizishingiz mumkin (ikkinchisida chizish juda noqulay ekanligi boshqa masala). Bitmap muharrirlarining xilma-xilligi juda ko'p, ularning ko'plari bepul va etarlicha funktsionaldir, shuning uchun har bir kishi dasturiy ta'minotni mustaqil ravishda tanlashi mumkin.

Men Adobe Photoshop -da rasm chizaman, chunki bu qulay va uzoq vaqt. Men yolg'on gapirmayman va yolg'on jag'imni qimirlatib aytmayman: "Men eslayman, Photoshop hali juda kichik edi, u Makintoshda edi va 1.0 raqami bilan edi" Bu unday emas edi. Lekin men Photoshop 4.0 ni eslayman (va Macda ham). Shuning uchun, men uchun tanlov masalasi hech qachon bo'lmagan. Va shuning uchun yo'q, yo'q, lekin men Photoshop bo'yicha tavsiyalar beraman, ayniqsa uning imkoniyatlari ijodkorlikni sezilarli darajada soddalashtirishga yordam beradi.

Shunday qilib, sizga bitta kvadrat pikselda asbob yordamida chizish imkonini beradigan har qanday grafik muharrir kerak (piksellar kvadrat bo'lmagan, masalan, yumaloq ham bo'lishi mumkin, ammo ular bizni hozir qiziqtirmaydi). Agar muharriringiz har qanday ranglar to'plamini qo'llab-quvvatlasa, ajoyib. Agar u sizga fayllarni saqlashga ham imkon bersa, bu juda yaxshi. Agar men ham qatlamlar bilan ishlay olsam yaxshi bo'lardi, chunki juda murakkab rasm ustida ishlayotganda, uning elementlarini turli qatlamlarga ajratish qulayroq, lekin umuman bu odat va qulaylik masalasidir.

Boshlaymizmi? Ehtimol, siz pikselli san'atni qanday chizishni o'rgatadigan ba'zi maxfiy texnikalar, tavsiyalar ro'yxatini kutyapsizmi? Va haqiqat shundaki, umuman olganda, bunday narsa yo'q. Pikselli rasm chizishni o'rganishning yagona yo'li - o'zingizni chizish, sinash, sinash, qo'rqmaslik va tajriba qilish. Boshqa odamlarning ishini takrorlashdan tortinmang, g'ayrioddiy ko'rinishdan qo'rqmang (shunchaki boshqa birovning ishini sizniki deb o'ylamang, hehe). Ustalarning ishini (mening emas) diqqat bilan va o'ylab tahlil qiling va chizish, bo'yash, bo'yash. Maqolaning oxirida sizni bir nechta foydali havolalar kutmoqda.

3. Umumiy tamoyillar.

Va shunga qaramay, bir nechta umumiy printsiplar bor, ular bilishga zarar bermaydi. Haqiqatan ham ular juda oz, men ularni qonunlar emas, balki "tamoyillar" deb atayman, chunki ular tabiatan maslahatchi xarakterga ega. Oxir-oqibat, agar siz barcha qoidalarni chetlab o'tib, yorqin pikselli rasm chizishga muvaffaq bo'lsangiz - kim ularga g'amxo'rlik qiladi?

Eng asosiy printsipni quyidagicha shakllantirish mumkin: tasvirning minimal birligi pikseldir va iloji bo'lsa, kompozitsiyaning barcha elementlari unga mutanosib bo'lishi kerak. Men shifrlayman: siz chizgan hamma narsa piksellardan iborat va piksel hamma narsada o'qilishi kerak. Bu rasmda umuman elementlar bo'lmasligi mumkin degani emas, masalan, 2x2 piksel yoki 3x3. Lekin baribir tasvirni alohida piksellardan yaratish afzalroqdir.

Strok va umuman chizmaning barcha satrlari qalinligi bir piksel bo'lishi kerak (kamdan-kam istisnolardan tashqari).

Men buni noto'g'ri deb taklif qilmayman. Ammo bu hali juda chiroyli emas. Va uni chiroyli qilish uchun yana bir qoidani eslaylik: bukmasdan chizish, silliq dumaloq qilish... Burmalar kabi narsa bor - umumiy tartibdan ajralib turadigan bo'laklar, ular chiziqlarga notekis, jingalak ko'rinish beradi (piksel rassomlarining ingliz tilida so'zlashadigan muhitida ular jaggies deb ataladi):

Yoriqlar chizmani tabiiy silliqligi va go'zalligidan mahrum qiladi. Va agar 3, 4 va 5-qismlar aniq bo'lsa va ularni osongina tuzatish mumkin bo'lsa, boshqalar bilan vaziyat yanada murakkablashadi - u erda zanjirdagi bitta bo'lakning uzunligi buzilgan bo'lsa, bu arzimas, ammo sezilarli arzimas narsa bo'lib tuyuladi. Bunday joylarni ko'rish va ulardan qochishni o'rganish uchun ozgina mashq qilish kerak. Kink 1 chiziqdan chiqarib tashlandi, chunki u bitta pikselli - chiziq joylashtirilgan joyda esa 2 pikselli segmentlardan iborat. Undan xalos bo'lish uchun men yuqori segmentni 3 pikselga cho'zish va butun chiziqni 2 pikselli segmentlarga qayta chizish orqali egri chiziqni egri chiziqqa yumshatib qo'ydim. Kinks 2 va 6 bir-biriga o'xshash - ular allaqachon bitta piksellar tomonidan qurilgan maydonlarda 2 piksel uzunlikdagi bo'laklardir.

Deyarli har bir pikselli san'at darsligida topiladigan qiyshiq chiziqlarning oddiy misollar to'plami (meniki bundan mustasno emas) chizishda bunday burilishlarning oldini oladi:

Ko'rib turganingizdek, to'g'ri chiziq bir xil uzunlikdagi segmentlardan iborat bo'lib, chizilganida bir pikselga siljiydi - bu chiziqlilik effektiga erishishning yagona yo'li. Segment uzunligi 1, 2 va 4 piksel bo'lgan eng keng tarqalgan qurilish usullari (boshqalar ham bor, ammo taqdim etilgan variantlar deyarli har qanday badiiy g'oyani amalga oshirish uchun etarli bo'lishi kerak). Bu uchtadan eng mashhurini ishonch bilan 2 pikselli segmentning uzunligi deb atash mumkin: segmentni chizish, qalamni 1 pikselga siljitish, boshqa segmentni chizish, qalamni 1 pikselga siljitish, boshqa segmentni chizish:

Qiyin emas, to'g'rimi? Bu shunchaki odat tusiga kiradi. Egri chiziqlarni 2 pikselli bosqichda chizish qobiliyati izometrikda yordam beradi, shuning uchun keyingi safar biz bu haqda batafsilroq to'xtalamiz. Umuman olganda, to'g'ri chiziqlar juda yaxshi - lekin vazifa mo''jizaviy narsalarni chizishgacha. Bu erda bizga egri chiziqlar kerak va juda ko'p turli xil egri chiziqlar. Va biz egri chiziqlarni yaxlitlash uchun oddiy qoidani qabul qilamiz: egri elementlarning uzunligi asta-sekin kamayishi / ortishi kerak.

To'g'ri chiziqdan yaxlitlashga chiqish muammosiz amalga oshiriladi, men har bir segmentning uzunligini belgilab qo'ydim: 5 piksel, 3, 2, 2, 1, 1, 2 yana (allaqachon vertikal), 3, 5 va boshqalar. Sizning ishingiz bir xil ketma -ketlikni ishlatishi shart emas, barchasi kerakli silliqlikka bog'liq. Yana bir yaxlitlash misoli:

Shunga qaramay, rasmni buzadigan burmalardan qoching. Agar olingan materialni tekshirish istagi bo'lsa, menda noma'lum muallif tomonidan Winamp uchun chizilgan terim bor, bo'sh joy:

Rasmda qo'pol xatolar bor va shunchaki muvaffaqiyatsiz filetolar va burmalar paydo bo'ladi - siz allaqachon bilgan narsangiz asosida rasmni tuzatishga harakat qiling. Bu menda chiziqlar bilan bor narsa, men biroz chizishni taklif qilaman. Va misollarning soddaligi bilan adashmang, siz faqat chizish orqali chizishni o'rganishingiz mumkin - hatto bunday oddiy narsalar.

4.1. Biz tirik suv bilan shishani chizamiz.

1. Ob'ektning shakli, agar siz rangdan foydalana olmaysiz.

2. Qizil suyuqlik.

3. Stakan rangini ko'k rangga o'zgartiring, qabariq ichidagi soyali joylarni va suyuqlikning mo'ljallangan yuzasida engil maydonni qo'shing.

4. Suyuqlik qabariq devorlari bilan chegaradosh bo‘lgan joylarga pufakchaga oq yorug‘lik va 1 piksel kenglikdagi to‘q qizil soya qo‘shing. Yaxshi ko'rinadi, a?

5. Xuddi shu tarzda ko'k suyuqlik bilan shishani torting - bu erda bir xil rangdagi shisha, ortiqcha suyuqlik uchun uchta ko'k rang.

4.2. Biz tarvuz chizamiz.

Keling, doira va yarim doira chizamiz - bu tarvuz va kesilgan bo'lak bo'ladi.

2. Tarvuzning o'zida kesilgan joyni, bo'lakda esa - qobiq va pulpa orasidagi chegarani belgilaymiz.

3. To'ldirish. Palitradagi ranglar, o'rtacha yashil - qobig'ining rangi, o'rtacha qizil - go'shtning rangi.

4. Yer qobig'idan pulpaga o'tish joyini belgilaymiz.

5. Tarvuzdagi engil chiziqlar (nihoyat, u o'ziga o'xshaydi). Va, albatta, - urug'lar! Agar tarvuzni tarakan bilan kesib o'tsangiz, ular o'z -o'zidan taraladi.

6. Biz eslaymiz. Bo'limdagi urug'lar ustidagi yorqin nuqtalarni ko'rsatish uchun och pushti rangdan foydalanamiz va piksellarni shaxmat taxtasi shaklida qo'yish orqali biz kesilgan bo'lakdan ovoz balandligining qandaydir o'xshashligiga erishamiz (usul dithering deb ataladi, bu haqda keyinroq). . Tarvuzning kesilgan qismidagi soyali joylarni ko'rsatish uchun quyuq qizil rangdan foydalanamiz va tarvuzning o'ziga hajm qo'shish uchun quyuq yashil rangdan (yana shashka naqshidagi piksellar) foydalanamiz.

5. Dithering.

Dithering yoki aralashtirish - bu har xil rangdagi ikkita chegaradosh sohada piksellarni aniq tartiblangan (har doim ham emas) tarzda aralashtirish usuli. Eng oddiy, eng keng tarqalgan va samarali usul - shaxmat taxtasi naqshidagi piksellarni almashtirish:

Texnika texnik cheklovlar tufayli (aniqrog'i, aksincha) paydo bo'ldi - cheklangan palitralarga ega platformalarda dithering ikki xil rangdagi piksellarni aralashtirish orqali palitrada bo'lmagan uchinchisini olishga imkon berdi:

Endi, cheksiz texnik imkoniyatlar davrida, ko'pchilik aytadiki, rang berish zarurati o'z -o'zidan yo'qoldi. Biroq, undan oqilona foydalanish sizning san'at asaringizga eski video o'yinlarning barcha muxlislari tomonidan tan olinadigan o'ziga xos retro ko'rinishni berishi mumkin. Shaxsan men ditheringdan foydalanishni yaxshi ko'raman. Men juda yaxshi gapirmayman, shunga qaramay, men uni yaxshi ko'raman.

Dithering uchun yana ikkita variant:

Uni ishlatish uchun dither haqida nimalarni bilishingiz kerak. Aralash zonasining minimal kengligi kamida 2 piksel bo'lishi kerak (o'sha shashka). Ko'proq mumkin. Kamroq qilmaslik yaxshiroqdir.

Quyida muvaffaqiyatsiz dithering misoli keltirilgan. Bunday texnikani ko'pincha video o'yinlardagi spritlarda topish mumkinligiga qaramasdan, televizor ekrani tasvirni sezilarli darajada silliqlashini va bunday taroq va hatto harakatda ham ko'z bilan o'rnatilmaganligini bilishingiz kerak:

Xo'sh, etarli nazariya. Men biroz ko'proq mashq qilishni taklif qilaman.

Raster grafikalar bilan ishlash uchun har qanday dasturda pikselli san'atni chizish mumkin, bu shaxsiy xohish va tajriba masalasi (albatta moliyaviy imkoniyatlar bilan bir qatorda). Kimdir eng oddiy Paint -dan foydalanadi, men buni Photoshop -da bajaraman - chunki, birinchidan, men u erda uzoq vaqt ishlaganman, ikkinchidan, men o'zimni qulayroq his qilaman. Qanday bo'lmasin, men bepul Paint.NET -ni sinab ko'rishga qaror qildim, bu menga yoqmadi - xuddi mashinada bo'lgani kabi, Zaporojetsda avtomat uzatma qutisi bo'lgan chet el mashinasini o'tirishi dargumon. Mening ish beruvchim meni litsenziyalangan dasturiy ta'minot bilan ta'minlaydi, shuning uchun Adobe korporatsiyasi oldida mening vijdonim toza ... Garchi ularning dasturlari uchun narxlar aqlga sig'maydi va ular buning uchun do'zaxda yonadilar.

1. Ishga tayyorgarlik.

Har qanday sozlamalar bilan yangi hujjat yarating (uning kengligi 60 piksel, balandligi 100 piksel bo'lsin). Piksel rassomining asosiy vositasi qalam ( Qalam vositasi, tezkor tugma orqali chaqiriladi B). Agar asboblar panelida cho'tka (va cho'tka belgisi) yoqilgan bo'lsa, kursorni uning ustiga olib boring, bosing va ushlab turing LMB- kichik ochiladigan menyu paydo bo'ladi, unda siz qalam tanlashingiz kerak. Qalam o'lchamini 1 pikselga o'rnating (chapdagi yuqori panelda, ochiladigan menyuda). Cho'tkasi):

Yangi boshlanuvchilar uchun piksel san'ati. | Kirish.

Yangi boshlanuvchilar uchun piksel san'ati. | Kirish.

Yana bir nechta foydali kombinatsiyalar. " Ctrl+ "Va" Ctrl- "kattalashtiradi va kichraytiradi. Bosishni bilish ham foydalidir Ctrl va "(tirnoq-Rojdestvo daraxti yoki ruscha kalit") NS") To'rni yoqadi va o'chiradi, bu piksel tasvirini chizishda katta yordam beradi. Tarmoqli qadam ham o'zingiz uchun sozlanishi kerak, bu 1 pikselli bo'lsa, kimdir uchun qulayroq, men 2 pikselli hujayra kengligiga o'rganib qolganman. Durang Ctrl + K(yoki o'ting Tahrirlash->Afzalliklar), nuqtaga o'ting Qo'llanmalar, panjara va bo'laklar va o'rnating Gridline har 1 piksel(takror aytaman, bu men uchun qulayroq 2).

2. Chizish.

Nihoyat, biz chizishni boshlaymiz. Nima uchun yangi qavat yaratish ( Ctrl + Shift + N), qora qalam rangiga o'ting (bosish D standart ranglarni o'rnatadi, qora va oq) va qahramonning boshini torting, mening holimda bu nosimmetrik ellips:

Yangi boshlanuvchilar uchun piksel san'ati. | Kirish.


Yangi boshlanuvchilar uchun piksel san'ati. | Kirish.

Uning pastki va yuqori asoslari 10 piksel uzunlikda, keyin 4 pikselli segmentlar, uch, uch, bir, bitta va balandligi 4 piksel bo'lgan vertikal chiziq mavjud. Photoshop-da to'g'ri chiziqlar qisqich bilan chizish uchun qulay Shift Piksel san'atida tasvirning miqyosi minimal bo'lsa-da, bu texnika ba'zan ko'p vaqtni tejaydi. Agar siz xatoga yo'l qo'ygan bo'lsangiz va juda ko'p chizgan bo'lsangiz, biron bir joyga ko'tarilgan bo'lsangiz - tushkunlikka tushmang, o'chirish vositasiga o'ting ( Eraser ham l yoki " E») Va keraksizlarni o'chirib tashlang. Ha, oʻchirgichni ham 1 pikselli qalam oʻlchamiga qoʻyganingizga ishonch hosil qiling, shunda u piksel-piksel va qalam rejimini oʻchiradi ( Rejim: qalam), aks holda u noto'g'ri narsani o'chiradi. Qalamga qaytsak, sizga eslatib o'taman, " B»

Umuman olganda, bu ellips pikselli san'at qoidalariga qat'iy ravishda chizilgan emas, lekin badiiy dizayn buni talab qiladi. Chunki bu kelajakdagi bosh, ko'zlar, burun, og'iz uning ustida joylashgan bo'ladi - oxir-oqibat tomoshabinning e'tiborini o'ziga qaratadigan va boshning shakli nega bunchalik notekis ekanligini so'rash istagini yo'qotadigan etarlicha tafsilotlar.

Chizishni davom ettirib, burun, antenna va og'iz qo'shing:

Yangi boshlanuvchilar uchun piksel san'ati. | Kirish.

Yangi boshlanuvchilar uchun piksel san'ati. | Kirish.

Endi ko'zlar:

Yangi boshlanuvchilar uchun piksel san'ati. | Kirish.

Yangi boshlanuvchilar uchun piksel san'ati. | Kirish.

E'tibor bering, bunday kichik o'lchamda ko'zlar yumaloq bo'lishi shart emas - mening holatimda bu burchak nuqtalari chizilmagan yon uzunligi 5 piksel bo'lgan kvadratlardir. Agar siz asl shkalaga qaytsangiz, ular juda yumaloq bo'lib ko'rinadi, bundan tashqari, sharlar taassurotini soyalar yordamida yaxshilash mumkin (bu haqda keyinroq, darsning 3 -bo'limiga qarang). Shu bilan birga, men bir joyda bir nechta pikselni artib, boshqa joyga chizish orqali boshning shaklini biroz tuzataman:

Yangi boshlanuvchilar uchun piksel san'ati. | Kirish.

Yangi boshlanuvchilar uchun piksel san'ati. | Kirish.

Biz qoshlarni chizamiz (ular havoda osilgan hech narsa - menda shunday uslub bor) va og'iz burchaklaridagi burmalarni taqlid qilib, tabassumni yanada yorqinroq qilamiz:

Yangi boshlanuvchilar uchun piksel san'ati. | Kirish.

Yangi boshlanuvchilar uchun piksel san'ati. | Kirish.

Burchaklar hali unchalik yaxshi ko'rinmaydi, piksel san'atining qoidalaridan biri, zarba va elementlarning har bir pikseli ikkitadan ko'p bo'lmagan qo'shni piksellarga tegishi mumkinligini aytadi. Ammo agar siz 80-yillarning oxiri - 90-yillarning boshlaridagi o'yinlardagi spritlarni diqqat bilan o'rgansangiz, bu xatoni u erda tez-tez uchratish mumkin. Xulosa - agar qila olmasangiz, lekin chindan ham xohlasangiz, unda mumkin. Bu tafsilotni keyinroq soyalar yordamida to'ldirish mumkin, shuning uchun hozircha biz yana chizamiz. Torso:

Yangi boshlanuvchilar uchun piksel san'ati. | Kirish.

Yangi boshlanuvchilar uchun piksel san'ati. | Kirish.

Hozircha to'piqlarga e'tibor bermang, bu noqulay ko'rinadi, biz to'ldirganimizda tuzatamiz. Kichkina tuzatish: kasık sohasiga kamar va burmalar qo'shing, shuningdek, tizza bo'g'imlarini tanlang (oyoq chizig'idan chiqadigan 2 pikselli kichik bo'laklardan foydalangan holda):

Yangi boshlanuvchilar uchun piksel san'ati. | Kirish.

Yangi boshlanuvchilar uchun piksel san'ati. | Kirish.

3. To'ldiring.

Har bir belgi elementi uchun hozircha bizga uchta rang etarli bo'ladi - asosiy rang, soya rangi va chizish rangi. Umuman olganda, piksel san'atida ranglar nazariyasi bo'yicha maslahat berish uchun juda ko'p narsa bor, dastlabki bosqichda ustalarning ishlariga josuslik qilishdan va ranglarni qanday tanlashlarini tahlil qilishdan tortinmang. Har bir elementning zarbasi, albatta, qora rangda qoldirilishi mumkin, lekin bu holda, ehtimol, elementlar birlashadi, men elementning asosiy rangiga yaqin, lekin to'yinganligi past bo'lgan mustaqil ranglardan foydalanishni ma'qul ko'raman. Eng qulay usul - bu sizning xarakteringiz yonidagi biron bir joyga kichik palitrani chizish va undan keyin tomchilar vositasi yordamida ranglarni olish ( Ko'z tomchilari vositasi, I.):

Kerakli rangni tanlagandan so'ng, "paqir" vositasini yoqing ( Bo'yoq paqir, G.). Shuningdek, sozlamalarda Anti-alias funksiyasini o'chirib qo'yganingizga ishonch hosil qiling, chizilgan konturlar ichida aniq ishlashi va ulardan tashqariga chiqmaslik uchun bizga to'ldirish kerak:

Yangi boshlanuvchilar uchun piksel san'ati. | Kirish.


Yangi boshlanuvchilar uchun piksel san'ati. | Kirish.

Biz fe'l -atvorimizni to'ldirolmaydigan narsani to'ldiramiz - qalam bilan qo'l bilan chizamiz.

Yangi boshlanuvchilar uchun piksel san'ati. | Kirish.

Yangi boshlanuvchilar uchun piksel san'ati. | Kirish.

To'piqlarga e'tibor bering - bu joylarning qalinligi atigi 2 piksel bo'lgani uchun, men ikki tomondan zarbadan voz kechishga majbur bo'ldim va men uni faqat belgilangan soyaning chizig'idan tortib, asosiy rang chizig'ini 1 piksel qalinlikda qoldirdim. Shuni ham yodda tutingki, men qoshlarni qora qoldirdim, garchi bu muhim emas.

Photoshop-da rang bo'yicha qulay tanlov mavjud ( Tanlang-> Rang diapazoni Istalgan rangdagi ko'z tomchisi bilan urib, biz bir xil rangdagi barcha joylarni tanlaymiz va ularni bir zumda to'ldirish imkoniyatini olamiz, ammo buning uchun siz o'zingizning xarakteringizning elementlarini turli qatlamlarda bo'lishingiz kerak, shuning uchun hozircha biz bu funksiya ilg'or Photoshop foydalanuvchilari uchun foydali deb hisoblaydi):

Yangi boshlanuvchilar uchun piksel san'ati. | Kirish.


Yangi boshlanuvchilar uchun piksel san'ati. | Kirish.

4. Soya va xiralashish.

Endi biz soyaning ranglarini tanlaymiz va qalamga o'tamiz ( B) soyali joylarni ehtiyotkorlik bilan joylashtiring. Menimcha, yorug'lik manbai chap va tepada, belgining oldida joylashgan - shuning uchun biz o'ng tomonlarini soyaga diqqat qilib, pastki qismiga urg'u beramiz. Yuz soyaga eng boy bo'ladi, chunki bir tomondan soyalar yordamida relyefda ajralib turadigan ko'plab kichik elementlar mavjud, ikkinchidan esa ular o'zlari soya qiladilar (ko'zlar, burunlar, yuz burmalari):

Yangi boshlanuvchilar uchun piksel san'ati. | Kirish.

Yangi boshlanuvchilar uchun piksel san'ati. | Kirish.

Soya - bu juda kuchli vizual vosita, yaxshi belgilangan soya qahramonning tashqi ko'rinishiga va tomoshabinda qoladigan taassurotga foydali ta'sir ko'rsatadi. Piksel san'atida bitta piksel noto'g'ri joylashishi butun ishni buzishi mumkin, ammo bunday kichik tuzatishlar tasvirni yanada chiroyli qilishi mumkin.

kelsak xiralashgan"Ammo, bunday miniatyura o'lchamlari bilan tasvirda, menimcha, bu mutlaqo ortiqcha. Usulning o'zi ikkita qo'shni rangni "aralashtirish" dan iborat bo'lib, bunga piksellarning ketma -ket joylashuvi orqali erishiladi. Biroq, texnika haqida tasavvurga ega bo'lish uchun, men hali ham kichik aralashtirish joylarini, shimlarda, ko'ylakda va biroz yuzda kiritaman:

Yangi boshlanuvchilar uchun piksel san'ati. | Kirish.

Yangi boshlanuvchilar uchun piksel san'ati. | Kirish.

Umuman olganda, siz ko'rib turganingizdek, ayniqsa murakkab narsa yo'q. Pikselli san'at Shu qadar jozibaliki, ba'zi naqshlarni o'zlashtirgan holda, har kim o'zini juda yaxshi chizishi mumkin - shunchaki ustalarning ishini sinchkovlik bilan o'rganib. Ha bo'lsa-da, chizish va rang nazariyasi asoslari bo'yicha ba'zi bilimlar hali ham zarar qilmaydi. Olg'a!

Ertalab Internetda sayr qilib, men Pixel Art haqida post yozmoqchi bo'ldim, materialni qidirib, men ushbu ikkita maqolani topdim.