Skip to content
4-hafta · 10-dars

Ranglar nazariyasi va dizayn asoslari (3-qism): O'yin atmosferasiga mos rang palitrasi yaratish

Bir xil o'rmonni kunduzi quvnoq, tunda esa qo'rqinchli qilib ko'rsatish mumkin — faqat ranglarni almashtirib. Bugun o'yiningiz uchun o'z rang palitrangizni yaratamiz.

Dars xulosasi ​

  • Rang palitrasi — o'yin yoki lokatsiya uchun oldindan tanlangan 5–8 ta uyg'un rang. U yaxlit uslub, atmosfera va o'qiluvchanlik beradi.
  • Palitra yaratishning 6 bosqichi: kayfiyat jumlasi → mood board → asosiy rang → uyg'unlik sxemasi → value pog'onalari → saqlash va test.
  • Value — rangning och yoki to'qligi. O'yinchi obyektlarni avval yorug'lik farqidan ajratadi.
  • Kulrang test: Black & White adjustment layer bilan sahnani rangsiz tekshirish.
  • Hue shifting: soyada tus sovuqqa (ko'k/binafsha), yorug'likda issiqqa (sariq) siljiydi — qora qo'shilmaydi.
  • To'yinganlik ierarxiyasi: fon — xira, obyektlar — o'rtacha, qahramon va bonuslar — eng yorqin.
  • Cheklangan palitralar: Game Boy — 4 rang, PICO-8 — 16 rang.
  • Rang kodlash: qizil — xavf, yashil — sog'liq, oltin — mukofot, moviy — mana. Faqat rangga tayanmang — belgi ham qo'shing.
  • Saqlash: Swatches guruhi → Export Selected Swatches → .aco.

Qo'shimcha ma'lumot ​

1. Mood board qanday tuziladi? ​

Photoshop'da 1920×1080 xolst oching va unga 5–8 ta rasm joylang: tabiat fotosuratlari, kinokadrlar, sevimli o'yinlaringiz skrinshotlari. Keyin Eyedropper (I) bilan eng «kayfiyatli» ranglarni olib, chetga kvadratlar qilib chizing.

2. Hue shifting — misol ​

Pog'onaHueSaturationBrightness
Yorug'lik70°45%90%
Asosiy yashil100°60%65%
Soya140°65%35%

Soya ko'k-yashilga, yorug'lik sariq-yashilga siljigan — barg jonli ko'rinadi.

3. Lokatsiyalar palitralari ​

LokatsiyaKayfiyatRanglar
Sehrli o'rmonsirto'q yashil, binafsha + oltin aksent
Muz g'orisovuqlikoq, moviy, ko'k + olovrang mash'al
Cho'lissiqlikqum-sariq, terrakota + firuza voha
Kiberpanktun, texnologiyato'q ko'k + neon pushti va moviy

4. Palitra kartasi ​

Har bir rang kvadrati ostiga HEX kodini yozing (#1F4E79) va kartani PNG qilib saqlang — jamoadoshlaringiz aynan shu ranglardan foydalanadi.

5. Odatiy xatolar ​

  • 20 dan ortiq tasodifiy rang — uslub buziladi.
  • Soya uchun qora — rang «kir» bo'ladi.
  • Hamma narsa bir xil yorqin — ko'z qayerga qarashni bilmaydi.
  • Palitrani saqlamaslik — keyingi darslarda ikonka va spraytlar shu palitrada chiziladi.

Atamalar lug'ati ​

AtamaMa'nosi
Rang palitrasiO'yin uchun tanlangan cheklangan uyg'un ranglar to'plami
Mood boardKayfiyatni ko'rsatuvchi namunaviy rasmlar taxtasi
Asosiy rang (key color)Kayfiyatni eng yaxshi ifodalovchi markaziy rang
Aksent rangDiqqatni tortish uchun kam ishlatiladigan kontrast rang
ValueRangning yorug'lik darajasi (och yoki to'q)
Kulrang testSahnani rangsiz ko'rib, kontrastni tekshirish
Hue shiftingSoya va yorug'likda rang tusini siljitish
To'yinganlik (Saturation)Rangning yorqinlik-sofligi darajasi
Havo perspektivasiUzoqdagi narsalar xiraroq va ko'kimtir ko'rinishi
Rang kodlashRanglarga doimiy ma'no berish (qizil — xavf)
.acoPhotoshop Swatches palitrasi fayli

Bilasizmi? ​

  • Game Boy (1989) ekrani atigi 4 ta yashil tusdagi rangni ko'rsata olardi — lekin unda yuzlab mashhur o'yinlar yaratilgan.
  • PICO-8 fantaziya konsolida faqat 16 ta rang bor, va bu cheklov uni piksel-art ishqibozlari orasida mashhur qildi.
  • Erkaklarning taxminan 8 foizida rang ko'rish farqi (ko'pincha qizil-yashil) bor — shuning uchun yaxshi o'yinlar rangga qo'shimcha belgi qo'shadi.
  • Lospec saytida minglab tayyor piksel-art palitralari HEX kodlari bilan bepul berilgan.

Topshiriqlar ​

1. Kayfiyat jumlasi oson ​

Uch lokatsiya uchun (sehrli o'rmon, muz g'ori, cho'l) bittadan kayfiyat jumlasi yozing.

Kutiladigan natija: 3 ta aniq jumla.

2. Rang kodlash oson ​

O'yinda qizil, yashil, oltin va moviy ranglar qanday ma'no beradi? Har biriga o'yin buyumidan misol keltiring.

Kutiladigan natija: 4 qatorli jadval.

3. Mood board oson ​

Tanlagan lokatsiyangiz uchun 5–8 ta rasmdan iborat mood board tuzing.

Kutiladigan natija: bitta PSD/PNG xolst.

4. Asosiy va aksent oson ​

Mood board'dan Eyedropper bilan asosiy rang va aksent rangni oling, HEX kodlarini yozing.

Kutiladigan natija: 2 ta rang kvadrati va HEX kodlari.

5. 5 rangli palitra o'rta ​

Lokatsiyangiz uchun 5–8 rangli palitra tuzing va uyg'unlik sxemasini (analog, komplementar, triadik) ko'rsating.

Kutiladigan natija: palitra kartasi HEX kodlari bilan.

6. Hue shifting o'rta ​

Qizil olma uchun yorug'lik — asosiy — soya pog'onalarini HSB qiymatlari bilan tuzing (soya qora qo'shmasdan).

Kutiladigan natija: 3 ta kvadrat va HSB qiymatlari.

7. Kulrang test o'rta ​

Fon va qahramon chizilgan sahnada Black & White adjustment layer bilan test o'tkazing. Natijani tasvirlab, kerak bo'lsa tuzating.

Kutiladigan natija: «oldin/keyin» skrinshotlari va 2–3 jumla izoh.

8. Swatches guruhi o'rta ​

Palitrangizni Swatches panelida guruh qilib saqlang va .aco ga eksport qiling.

Kutiladigan natija: Lokatsiya_nomi.aco fayli.

9. Kun va tun qiyin ​

Bir lokatsiyaning kunduzgi va tungi palitrasini tuzing; qahramon ranglari ikkalasida bir xil qolsin.

Kutiladigan natija: 2 ta palitra kartasi va 2 ta .aco.

10. To'yinganlik ierarxiyasi qiyin ​

Sahnada fon, platforma va qahramonning to'yinganlik qiymatlarini (S, %) yozing va ierarxiya to'g'riligini asoslang.

Kutiladigan natija: 3 qatorli jadval va xulosa.

11. Cheklangan palitra challenge qiyin ​

Faqat 4 ta rang (Game Boy uslubida) bilan kichik sahna chizing: qahramon, fon, bitta bonus.

Kutiladigan natija: 4 rangli sahna PNG.

12. O'yin tahlili bonus ​

Sevimli o'yiningizdan 3 ta skrinshot olib, har birining asosiy, aksent ranglarini va kayfiyatini tahlil qiling.

Kutiladigan natija: 3 ta skrinshot va palitra tahlili.

O'zingizni tekshiring ​

  1. Rang palitrasi o'yinga qanday 3 ta foyda beradi?
  2. Palitra yaratishning 6 bosqichini ayting.
  3. Value nima va kulrang test nimani ko'rsatadi?
  4. Hue shifting qanday bajariladi?
  5. Fon va qahramonning to'yinganligi qanday farq qilishi kerak?
  6. Nega faqat rangga tayanib ma'no berish xavfli?
  7. Palitra Photoshop'da qanday saqlanadi va eksport qilinadi?

Uyga vazifa ​

O'z o'yiningiz uchun bitta lokatsiyaning 6–8 rangli palitrasini tuzing (asosiy, aksent, value pog'onalari), kulrang testdan o'tkazing va .aco hamda palitra kartasi (PNG) ko'rinishida saqlang. Batafsil: uyga-vazifa.md.