AXV

2D Grafika va Photoshop Interfeysi

Spraytlar, tayllar, parallaks manzaralari va kompyuter grafikasi turlari

9-sinfGame Design2-hafta · 5-dars
01

2D Grafikaning O'yindagi O'rni

Ikki o'lchamli fazoda virtual olam yaratish asoslari

2D Grafika nima?

X va Y O'qlari Tekisligi

Kenglik va balandlikdan iborat tekis tasvirlar san'ati.

Pikselli retro o'yinlardan to zamonaviy chizilgan san'at asarlarigacha.

O'yin Elementlari

Spraytlar, tayl xaritalari, fon manzaralari va foydalanuvchi interfeysi (UI).

Har bir element o'yin dvijogida qatlamlar ko'rinishida yig'iladi.

Spraytlar va Tayl Xaritalari

Spraytlar (Sprites)

Qahramon, dushmanlar, qurollar va tangalarning 2D rasmlari.

Alohida kadrlardan tuzilib, harakatli animatsiyalarga aylanadi.

Tayllar (Tiles & Tilemaps)

Xaritalarni mozaika kabi terish uchun kichik kvadrat bloklar (32x32 px).

Bir necha megabayt xotira evaziga ulkan o'yin olamlarini qurish imkoni.

2D O'yin Sahnasi Tuzilishi

4-Qatlam: Uzoq Osmon va Bulutlar (Harakatsiz) 3-Qatlam: Uzoqdagi Tog'lar va O'rmon (Sekin harakat) 2-Qatlam: O'yin Maydoni (Qahramon va Dushmanlar sprayti) 1-Qatlam: Oldingi Dekoratsiyalar va HUD (Tez harakat)
02

Grafika Turlari

Rastr, Vektor va Fraktal grafika taqqoslanishi

Rastr grafikasi (Raster)

Piksellar To'ri

Tasvir rangli nuqtalar (piksellar) mozaikasidan iborat.

Millionlab rang tuslari, soyalar va fotografik detallar.

Masshtablash Cheklovi

Kattalashtirilganda (zoom) piksellar bo'rtib chiqadi va tasvir xiralashadi.

Asosiy formatlar: PNG, JPEG, PSD, WebP.

Vektor grafikasi (Vector)

Matematik Formulalar

Nuqtalar, to'g'ri va egri chiziqlar formulasiga asoslangan geometrik shakllar.

Kompyuter har safar tasvirni formuladan qayta chizadi.

Cheksiz Masshtab

Qanchalik kattalashtirsangiz ham sifati mutlaqo buzilmaydi, o'lchami juda ixcham.

Asosiy formatlar: SVG, AI, EPS.

Rastr vs Vektor Mikroskop Ostida

Rastr (PNG / JPEG) Kattalashtirilganda kataklar ko'rinadi Vektor (SVG / AI) Chiziqlar doimo 100% silliq va o'tkir

Rastr vs Vektor

Rastr Grafikasi

Piksellar to'ri. Ranglar va soyalarga boy.

Masshtablanganda xiralashadi. Fotosuratlar va o'yin spraytlari.

Vektor Grafikasi

Matematik chiziqlar. Cheksiz masshtablanadi.

Ikonkalar, logotiplar va shriftlar uchun ideal tanlov!

03

Adobe Photoshop Interfeysi

Professional rassom va o'yin dizayneri ish muhiti

Photoshop Ishchi Muhiti

Menu Bar: File | Edit | Image | Layer | Filter Options Bar: Joriy vosita xususiyatlari (Size, Opacity, Hardness) Tools V, B, E, P CANVAS (Ishchi Xolst: 1920 x 1080) Chizish va dizayn maydoni LAYERS Qatlamlar Ierarxiya

Canvas Parametrlari

Full HD O'lchami

Zamonaviy ekranlar uchun kenglik 1920 px, balandlik 1080 px tanlanadi.

Pikselli (Pixel Art) o'yinlar uchun esa 320x180 px kabi ixcham hajm olinadi.

72 DPI va RGB Rang

Elektron displeylar uchun 72 DPI (Pixels/Inch) to'liq yetarli.

Rang rejimi doimo RGB (Red, Green, Blue) bo'lishi shart.

Asosiy Vositalar (Tools)

Move Tool (V)

Obyektlar va qatlamlarni maydon bo'ylab erkin siljitish vositasi.

Eng ko'p ishlatiladigan tugma.

Brush Tool (B)

Chizish mo'yqalami: spraytlar, to'qimalar va illyustratsiyalar yaratish.

O'lcham va qattiqlik sozlamasi.

Eraser Tool (E)

O'chirish uskunasi: xatolarni tozalash va ortiqcha foni yo'qotish.

Shaffoflikni tiklash.

Asset Yaratish Bosqichlari

1

Canvas Ochish (Ctrl+N)

O'yin talabiga mos piksellar o'lchami, 72 DPI va shaffof fon tanlanadi.

2

Yangi Qatlam Olish

Hech qachon asosiy fonga chizilmaydi: har bir detal alohida qatlamda turadi.

3

Chizish va Detallashtirish

Brush va Shape vositalari bilan sprayt chiziladi, soyalar beriladi.

4

PNG Eksport Qilish

Shaffoflikni saqlagan holda o'yin dvijogi uchun PNG formatida saqlanadi.

04

Parallaks Fon Arxitekturasi

2D o'yinlarda 3D chuqurlik illyuziyasini yaratish siri

Parallaks Harakat Modeli

Uzoq Osmon Tezlik: 0.1x Harakatsiz O'rta Tog'lar Tezlik: 0.4x Sekin siljish Oldingi Daraxt Tezlik: 1.0x To'liq tezlik

Bilimingizni sinang

Qaysi grafika turi matematik formulalarga tayanib, cheksiz masshtablanganda ham sifatini yo'qotmaydi?
Rastr grafikasi
Vektor grafikasi
Piksel grafikasi
Voksel grafikasi

Amaliy topshiriqlar

Oson

Rastr va vektor grafikasi o'rtasidagi 2 ta eng muhim farqni ayting.

O'rta

O'yin xaritasi uchun 32x32 pikselli tayllardan foydalanishning texnik foydasini tushuntiring.

Qiyin

Photoshopda 1920x1080 px o'lchamli yangi loyiha oching va 3 qatlamli Parallaks fon eskizini chizing.

Dars xulosasi

Bugun Nimalarni Bildik?

2D grafika elementlari: Sprayt, Tayl, Parallaks fon.

Grafika turlari: Rastr, Vektor, Fraktal.

Photoshop interfeysi, Canvas va Layers paneli.

Uyga Vazifa

Rastr va vektor solishtirma jadvalini tuzish hamda parallaks fon rejasini chizish.

Keyingi dars: Photoshop vositalari — Tanlash, Qatlamlar va Maskalar!