|
|
7 months ago | |
|---|---|---|
| .. | ||
| solution | 7 months ago | |
| your-work | 7 months ago | |
| README.md | 7 months ago | |
| assignment.md | 7 months ago | |
README.md
Sukurkite kosmoso žaidimą 6 dalis: pabaiga ir perkūrimas
journey
title Jūsų žaidimo užbaigimo kelionė
section Užbaigimo sąlygos
Apibrėžti laimėjimo/pralaimėjimo būsenas: 3: Student
Įgyvendinti sąlygų tikrinimą: 4: Student
Valdyti būsenų perėjimus: 4: Student
section Žaidėjo patirtis
Kurti atsiliepimų sistemas: 4: Student
Kurti perkrovimo mechanizmus: 5: Student
Tobulinti naudotojo sąsają: 5: Student
section Sistemos integracija
Valdyti žaidimo gyvavimo ciklą: 5: Student
Tvarkyti atminties valymą: 5: Student
Kurti pilną patirtį: 5: Student
Kiekvienas puikus žaidimas turi aiškias pabaigos sąlygas ir sklandų perkūrimo mechanizmą. Jūs sukūrėte įspūdingą kosmoso žaidimą su judėjimu, kova ir taškų skaičiavimu – dabar metas pridėti paskutinius elementus, kurie suteiks žaidimui užbaigtumo jausmą.
Jūsų žaidimas šiuo metu veikia neribotai, kaip ir Voyager zondai, kuriuos NASA paleido 1977 metais – jie vis dar keliauja per kosmosą po kelių dešimtmečių. Nors tai tinkama kosmoso tyrinėjimams, žaidimai turi turėti aiškias pabaigos ribas, kad sukurtų patenkinamą patirtį.
Šiandien įdiegsime tinkamas pergalės/pralaimėjimo sąlygas ir perkūrimo sistemą. Šios pamokos pabaigoje turėsite išbaigtą žaidimą, kurį žaidėjai galės įveikti ir žaisti iš naujo, panašiai kaip klasikiniai arkadiniai žaidimai, kurie apibrėžė šią mediją.
mindmap
root((Žaidimo Užbaigimas))
End Conditions
Victory States
Defeat Conditions
Progress Tracking
State Validation
Player Feedback
Visual Messages
Color Psychology
Clear Communication
Emotional Response
State Management
Game Loop Control
Memory Cleanup
Object Lifecycle
Event Handling
Restart Systems
Input Handling
State Reset
Fresh Initialization
User Experience
Polish Elements
Message Display
Smooth Transitions
Error Prevention
Accessibility
Priešpaskaitinis testas
Žaidimo pabaigos sąlygų supratimas
Kada turėtų baigtis jūsų žaidimas? Šis esminis klausimas formavo žaidimų dizainą nuo ankstyvojo arkadinių žaidimų laikotarpio. Pac-Man baigiasi, kai jus pagauna vaiduokliai arba išvalote visas taškelius, o Space Invaders – kai ateiviai pasiekia apačią arba juos visus sunaikinate.
Kaip žaidimo kūrėjas, jūs nustatote pergalės ir pralaimėjimo sąlygas. Mūsų kosmoso žaidimui yra patikrintos strategijos, kurios kuria įtraukiantį žaidimą:
flowchart TD
A["🎮 Žaidimo pradžia"] --> B{"Patikrinti sąlygas"}
B --> C["Priešo skaičius"]
B --> D["Herojaus gyvybės"]
B --> E["Taškų ribinė vertė"]
B --> F["Lygio pažanga"]
C --> C1{"Priešų = 0?"}
D --> D1{"Gyvybių = 0?"}
E --> E1{"Taškai ≥ Tikslas?"}
F --> F1{"Užduotys įvykdytos?"}
C1 -->|Taip| G["🏆 Pergalė"]
D1 -->|Taip| H["💀 Pralaimėjimas"]
E1 -->|Taip| G
F1 -->|Taip| G
C1 -->|Ne| B
D1 -->|Ne| B
E1 -->|Ne| B
F1 -->|Ne| B
G --> I["🔄 Perkrauti parinktį"]
H --> I
style G fill:#e8f5e8
style H fill:#ffebee
style I fill:#e3f2fd
- Sunaikinta
Npriešo laivų: Tai gana įprasta, kai žaidimą skirstote į lygius, ir norint užbaigti lygį reikia sunaikintiNpriešo laivus - Jūsų laivas sunaikintas: Yra žaidimų, kuriuose pralaimite, jei jūsų laivas sunaikinamas. Kita įprasta strategija – gyvybių konceptas. Kiekvieną kartą, kai jūsų laivas sunaikinamas, prarandate gyvybę. Kai visas gyvybes prarandate, pralaimite žaidimą.
- Surinkote
Ntaškų: Kita įprasta pabaigos sąlyga yra surinkti taškus. Kaip taškus gaunate – jūsų pasirinkimas, bet dažnai taškai suteikiami už tokias veiklas kaip priešo laivo sunaikinimas ar daiktų surinkimas, kuriuos daiktai išmeta būdami sunaikinti. - Užbaigti lygį: Tai gali apimti kelias sąlygas, pavyzdžiui,
Xpriešo laivų sunaikinimą,Ytaškų surinkimą ar tam tikro daikto surinkimą.
Žaidimo perkūrimo funkcionalumo įgyvendinimas
Geri žaidimai skatina kartotinį žaidimą per sklandžius perkūrimo mechanizmus. Kai žaidėjai baigia žaidimą (arba pralaimi), dažnai nori iš karto bandyti dar kartą – siekdami pagerinti savo rezultatus ar pasirodymą.
stateDiagram-v2
[*] --> Playing: Žaidimo pradžia
Playing --> Victory: Visi priešai sunaikinti
Playing --> Defeat: Gyvybės = 0
Victory --> MessageDisplay: Rodyti pergales pranešimą
Defeat --> MessageDisplay: Rodyti pralaimėjimo pranešimą
MessageDisplay --> WaitingRestart: Paspauskite Enter
WaitingRestart --> Resetting: Enter mygtukas paspaustas
Resetting --> CleanupMemory: Išvalyti intervalus
CleanupMemory --> ClearEvents: Pašalinti klausytojus
ClearEvents --> InitializeGame: Šviežias startas
InitializeGame --> Playing: Naujas žaidimas prasideda
note right of MessageDisplay
Spalvotu kodu pateikta informacija:
Žalia = Pergalė
Raudona = Pralaimėjimas
end note
note right of Resetting
Pilnas būsenos atstatymas
užkerta kelią atminties nutekėjimui
end note
Tetris tai puikiai iliustruoja: kai jūsų blokai pasiekia viršų, galite iš karto pradėti naują žaidimą be sudėtingų meniu naršymo. Mes sukursime panašią perkūrimo sistemą, kuri švariai atkurs žaidimo būseną ir greitai grąžins žaidėjus į kovą.
✅ Apmąstymas: Pagalvokite apie žaidimus, kuriuos žaidėte. Kokios sąlygos juos baigia ir kaip jums siūloma perkrauti žaidimą? Kas daro perkūrimo patirtį sklandžią, o kas – erzina?
Ką sukursite
Įgyvendinsite paskutines funkcijas, kurios pavers jūsų projektą pilnu žaidimu. Šie elementai atskiria išbaigtus žaidimus nuo pagrindinių prototipų.
Štai ką šiandien pridėsime:
- Pergalės sąlyga: Sunaikinkite visus priešininkus ir sulaukite tinkamo šventimo (jūs to nusipelnėte!)
- Pralaimėjimo sąlyga: Praraskite visas gyvybes ir susitaikykite su pralaimėjimo ekranu
- Perkūrimo mechanizmas: Spaudykite Enter, kad iš karto pradėtumėte iš naujo – nes vieno žaidimo niekada nepakanka
- Būsenos valdymas: Kiekvieną kartą švarus lapas – be likusių priešų ar keistų klaidų iš paskutinio žaidimo
Pradedame
Pasiruoškite savo kūrimo aplinką. Turėtumėte turėti visus kosminio žaidimo failus iš ankstesnių pamokų.
Jūsų projektas turėtų atrodyti maždaug taip:
-| assets
-| enemyShip.png
-| player.png
-| laserRed.png
-| life.png
-| index.html
-| app.js
-| package.json
Paleiskite savo kūrimo serverį:
cd your-work
npm start
Ši komanda:
- Paleidžia vietinį serverį adresu
http://localhost:5000 - Tinkamai aptarnauja jūsų failus
- Automatiškai atnaujina puslapį, kai darote pakeitimus
Atidarykite http://localhost:5000 naršyklėje ir patikrinkite, ar žaidimas veikia. Turėtumėte galėti judėti, šaudyti ir sąveikauti su priešininkais. Patvirtinus, galime tęsti įgyvendinimą.
💡 Profesionalus patarimas: Norėdami išvengti įspėjimų Visual Studio Code, deklaruokite
gameLoopIdfailo viršuje kaiplet gameLoopId;, o ne funkcijojewindow.onload. Tai atitinka šiuolaikines JavaScript kintamųjų deklaravimo praktikas.
flowchart TD
A["1. Sąlygų sekimas"] --> B["2. Įvykių tvarkyklės"]
B --> C["3. Žinučių konstantos"]
C --> D["4. Perkrovimo valdikliai"]
D --> E["5. Žinučių rodymas"]
E --> F["6. Sistemos atstatymas"]
G["arHerojMirė()\narPriešaiMirė()"] --> A
H["Susidūrimų įvykiai\nŽaidimo pabaigos įvykiai"] --> B
I["ŽAIDIMO_PABAIGA_PERGALĖ\nŽAIDIMO_PABAIGA_PRALAIMĖ"] --> C
J["Įvesties klavišas\nPerkrovimo paleidiklis"] --> D
K["Pergalės/Pralaimėjimo\nSpalvomis koduotas tekstas"] --> E
L["Būsenos išvalymas\nNauja inicializacija"] --> F
F --> M["🎮 Pilnas žaidimas"]
style A fill:#e3f2fd
style B fill:#e8f5e8
style C fill:#fff3e0
style D fill:#f3e5f5
style E fill:#e0f2f1
style F fill:#fce4ec
style M fill:#e1f5fe
Įgyvendinimo žingsniai
1 žingsnis: Sukurkite pabaigos sąlygų stebėjimo funkcijas
Reikia funkcijų, kurios stebėtų, kada žaidimas turėtų baigtis. Kaip ir tarptautinėje kosminėje stotyje veikiantys jutikliai, nuolat tikrinantys kritines sistemas, šios funkcijos nuolat stebės žaidimo būseną.
function isHeroDead() {
return hero.life <= 0;
}
function isEnemiesDead() {
const enemies = gameObjects.filter((go) => go.type === "Enemy" && !go.dead);
return enemies.length === 0;
}
Štai kas vyksta užkulisiuose:
- Tikrina, ar mūsų herojus liko be gyvybių (auč!)
- Skaičiuoja, kiek priešų dar gyvi ir veiksnūs
- Grąžina
true, kai laukas išvalytas nuo priešų - Naudoja paprastą tiesos/netiesos logiką, kad viskas būtų aišku
- Filtruoja per visus žaidimo objektus, kad rastų išlikusius
2 žingsnis: Atnaujinkite įvykių apdorojimo funkcijas pabaigos sąlygoms
Dabar sujungsime šiuos patikrinimus su žaidimo įvykių sistema. Kiekvieną kartą įvykus susidūrimui, žaidimas įvertins, ar tai sukelia pabaigos sąlygą. Tai suteikia tiesioginį atsaką į svarbius žaidimo įvykius.
sequenceDiagram
participant Collision
participant GameLogic
participant Conditions
participant EventSystem
participant Display
Collision->>GameLogic: Lazeris pataiko priešui
GameLogic->>GameLogic: Sunaikinti objektus
GameLogic->>Conditions: Patikrink isEnemiesDead()
alt Visi priešai įveikti
Conditions->>EventSystem: Išsiųsti GAME_END_WIN
EventSystem->>Display: Rodyti pergalės pranešimą
else Priešai liko
Conditions->>GameLogic: Tęsti žaidimą
end
Collision->>GameLogic: Priešas pataiko į herojų
GameLogic->>GameLogic: Sumažinti gyvybes
GameLogic->>Conditions: Patikrink isHeroDead()
alt Gyvybių = 0
Conditions->>EventSystem: Išsiųsti GAME_END_LOSS
EventSystem->>Display: Rodyti pralaimėjimo pranešimą
else Gyvybių liko
GameLogic->>Conditions: Patikrink isEnemiesDead()
alt Visi priešai įveikti
Conditions->>EventSystem: Išsiųsti GAME_END_WIN
end
end
eventEmitter.on(Messages.COLLISION_ENEMY_LASER, (_, { first, second }) => {
first.dead = true;
second.dead = true;
hero.incrementPoints();
if (isEnemiesDead()) {
eventEmitter.emit(Messages.GAME_END_WIN);
}
});
eventEmitter.on(Messages.COLLISION_ENEMY_HERO, (_, { enemy }) => {
enemy.dead = true;
hero.decrementLife();
if (isHeroDead()) {
eventEmitter.emit(Messages.GAME_END_LOSS);
return; // pralaimėjimas prieš pergalę
}
if (isEnemiesDead()) {
eventEmitter.emit(Messages.GAME_END_WIN);
}
});
eventEmitter.on(Messages.GAME_END_WIN, () => {
endGame(true);
});
eventEmitter.on(Messages.GAME_END_LOSS, () => {
endGame(false);
});
Kas čia vyksta:
- Lazeris pataiko į priešą: Abu dingsta, gaunate taškų, patikriname, ar laimėjote
- Priešas pataiko į jus: Prarandate gyvybę, patikriname, ar dar kvėpuojate
- Protinga eiga: Pirmiausia tikriname pralaimėjimą (niekas nenori laimėti ir pralaimėti vienu metu!)
- Momentiniai atsakai: Kai tik svarbus įvykis įvyksta, žaidimas apie tai iškart sužino
3 žingsnis: Pridėkite naujus žinučių konstantus
Reikės pridėti naujų žinučių tipų prie Messages konstantų objekto. Šios konstantos padeda palaikyti nuoseklumą ir išvengti klaidų įvykių sistemoje.
GAME_END_LOSS: "GAME_END_LOSS",
GAME_END_WIN: "GAME_END_WIN",
Aukščiau mes:
- Pridėjome konstantas žaidimo pabaigos įvykiams, kad būtų nuoseklu
- Naudojome aprašomuosius pavadinimus, aiškiai nurodančius įvykio paskirtį
- Vadovavomės esama žinučių pavadinimų konvencija
4 žingsnis: Įgyvendinkite perkūrimo valdiklius
Dabar pridėsite klaviatūros valdiklius, leidžiančius žaidėjams perkrauti žaidimą. Enter klavišas yra natūralus pasirinkimas, nes jis dažnai susijęs su veiksmų patvirtinimu ir naujo žaidimo pradžia.
Pridėkite Enter klavišo aptikimą esamam keydown įvykių klausytuvui:
else if(evt.key === "Enter") {
eventEmitter.emit(Messages.KEY_EVENT_ENTER);
}
Pridėkite naują žinutės konstantą:
KEY_EVENT_ENTER: "KEY_EVENT_ENTER",
Reikia žinoti:
- Išplečia esamą klaviatūros įvykių apdorojimo sistemą
- Naudoja Enter klavišą kaip perkūrimo signalą, kad vartotojui būtų paprasta
- Išmeta nestandartinį įvykį, kurį gali laikyti kitos žaidimo dalys
- Išlaiko tą pačią kitų klaviatūros valdiklių struktūrą
5 žingsnis: Sukurkite žinučių rodymo sistemą
Žaidimas turi aiškiai perduoti rezultatus žaidėjams. Mes sukursime žinučių sistemą, kuri rodo pergalę ir pralaimėjimą spalvotu tekstu, panašiai kaip ankstyvųjų kompiuterių terminalų sąsajos, kur žalia reiškė sėkmę, o raudona – klaidas.
Sukurkite funkciją displayMessage():
function displayMessage(message, color = "red") {
ctx.font = "30px Arial";
ctx.fillStyle = color;
ctx.textAlign = "center";
ctx.fillText(message, canvas.width / 2, canvas.height / 2);
}
Žingsnis po žingsnio, kas vyksta:
- Nustato šrifto dydį ir rūšį aiškiam, lengvai skaitomam tekstui
- Taiko spalvos parametrą, kur numatytoji – „raudona“ įspėjimams
- Centruoja tekstą horizontaliai ir vertikaliai ant drobės
- Naudoja modernius JavaScript numatytuosius parametrus lankstiems spalvos nustatymams
- Panaudoja 2D drobės kontekstą tiesioginiam teksto atvaizdavimui
Sukurkite funkciją endGame():
function endGame(win) {
clearInterval(gameLoopId);
// Nustatykite uždelsimą, kad užtikrintumėte, jog visi laukiamieji atvaizdavimai būtų baigti
setTimeout(() => {
ctx.clearRect(0, 0, canvas.width, canvas.height);
ctx.fillStyle = "black";
ctx.fillRect(0, 0, canvas.width, canvas.height);
if (win) {
displayMessage(
"Victory!!! Pew Pew... - Press [Enter] to start a new game Captain Pew Pew",
"green"
);
} else {
displayMessage(
"You died !!! Press [Enter] to start a new game Captain Pew Pew"
);
}
}, 200)
}
Ką ši funkcija daro:
- Sustabdo viską vietoje – jokių judančių laivų ar lazerių
- Imasi trumpo pauzės (200 ms), kad paskutinis kadras pilnai nupieštų
- Išvalo ekraną, nudažo juodai dramatiškam efektui
- Rodo skirtingas žinutes laimėtojams ir pralaimėtojams
- Spalvinama – žalia sėkmei, raudona – ne taip gerai
- Nurodo žaidėjams, kaip vėl pradėti žaidimą
🔄 Pedagoginis patikrinimas
Žaidimo būsenos valdymas: Prieš įgyvendinant perkūrimą, įsitikinkite, kad suprantate:
- ✅ Kaip pabaigos sąlygos sukuria aiškius žaidimo tikslus
- ✅ Kodėl vizualinis atsiliepimas yra būtinas žaidėjų supratimui
- ✅ Kaip tinkamas valymas apsaugo nuo atminties nutekėjimų
- ✅ Kaip įvykių architektūra leidžia sklandžiai keisti žaidimo būsenas
Greitas savitestavimas: Kas nutiktų, jei nesutvarkytumėte įvykių klausytojų perkūrimo metu? Atsakymas: atminties nutekėjimai ir pasikartojantys įvykių apdorotojai sukeltų nenuspėjamą elgseną
Žaidimo dizaino principai: Dabar įgyvendinate:
- Aiškius tikslus: žaidėjai žino, kas reiškia sėkmę ar nesėkmę
- Momentinį atsiliepimą: žaidimo būsenos pasikeitimai rodomi iškart
- Naudotojo kontrolę: žaidėjai gali restartuoti, kai pasiruošę
- Sistemos patikimumą: tinkamas valymas apsaugo nuo klaidų ir našumo problemų
6 žingsnis: Įgyvendinkite žaidimo perkūrimo funkciją
Perkūrimo sistema turi visiškai sutvarkyti esamą žaidimo būseną ir inicializuoti naują žaidimo sesiją. Tai užtikrina, kad žaidėjai pradės švarų žaidimą be likusių duomenų iš ankstesnio.
Sukurkite funkciją resetGame():
function resetGame() {
if (gameLoopId) {
clearInterval(gameLoopId);
eventEmitter.clear();
initGame();
gameLoopId = setInterval(() => {
ctx.clearRect(0, 0, canvas.width, canvas.height);
ctx.fillStyle = "black";
ctx.fillRect(0, 0, canvas.width, canvas.height);
drawPoints();
drawLife();
updateGameObjects();
drawGameObjects(ctx);
}, 100);
}
}
Išanalizuokime kiekvieną dalį:
- Tikrina, ar žaidimo ciklas šiuo metu vyksta prieš perkraunant
- Nutraukia esamą žaidimo ciklą, sustabdydamas žaidimą
- Pašalina visus įvykių klausytojus, kad nebūtų atminties nutekėjimų
- Inicializuoja žaidimo būseną su naujais objektais ir kintamaisiais
- Paleidžia naują žaidimo ciklą su visomis pagrindinėmis žaidimo funkcijomis
- Išlaiko tą patį 100 ms intervalą, kad veikimas būtų pastovus
Pridėkite Enter klavišo įvykio apdorojimą prie initGame() funkcijos:
eventEmitter.on(Messages.KEY_EVENT_ENTER, () => {
resetGame();
});
Pridėkite clear() metodą prie EventEmitter klasės:
clear() {
this.listeners = {};
}
Svarbiausios mintys:
- Sujungia Enter klavišo paspaudimą su žaidimo perkūrimo funkcija
- Registruoja šį įvykių klausytuvą žaidimo inicializacijos metu
- Pateikia aiškią priemonę pašalinti visus įvykių klausytuvus perkūrimo metu
- Užkerta kelią atminties nutekėjimams, išvalydamas apdorotojus tarp žaidimų
- Atstato klausytojų objektą į tuščią būseną naujai inicializacijai
Sveikiname! 🎉
👽 💥 🚀 Jūs sėkmingai sukūrėte visiškai veikiantį žaidimą nuo nulio. Kaip programuotojai, kurie kūrė pirmuosius vaizdo žaidimus 1970-aisiais, jūs pavertėte kodo eilutes interaktyvia patirtimi su tinkamais žaidimo mechanizmais ir vartotojo atsiliepimais. 🚀 💥 👽
Jūs pasiekėte:
- Įgyvendinote pilnas pergalės ir pralaimėjimo sąlygas su vartotojo atsiliepimais
- Sukūrėte sklandžią perkūrimo sistemą nenutrūkstamam žaidimui
- Sukūrėte aiškią vizualinę komunikaciją žaidimo būsenoms
- Valdėte sudėtingas žaidimo būsenų kaitas ir valymą
- Surenkėte visas dalis į vieningą, žaidimui tinkamą visumą
🔄 Pedagoginis patikrinimas
Pilnas žaidimo kūrimo ciklas: Pasidžiaukite savo meistriškumu pilname žaidimo kūrimo cikle:
- ✅ Kaip pabaigos sąlygos kuria patenkinamą žaidėjų patirtį?
- ✅ Kodėl tinkamas būsenos valdymas yra būtinas žaidimo stabilumui?
- ✅ Kaip vizualinis atsiliepimas pagerina žaidėjo supratimą?
- ✅ Kokį vaidmenį perkūrimo sistema atlieka žaidėjų išlaikymui?
Sistemos valdymas: Jūsų pilnas žaidimas rodo:
- Visapusišką žaidimo kūrimą: nuo grafikos iki įvesties ir būsenos valdymo
- Profesionali architektūra: įvykių sistema su tinkamu valymu
- Vartotojo patirties dizainą: aiškų atsiliepimą ir intuityvius valdiklius
- Veikimo optimizavimą: efektyvų atvaizdavimą ir atminties valdymą
- Išbaigtumą: visas detales, kurios sukuria užbaigtumo pojūtį
Pramoninės įgūdžių bazė: Jūs įdiegėte:
- Žaidimo ciklo architektūrą: realaus laiko sistemas su pastoviu veikimu
- Įvykių valdymą: atskirtas sistemas, kurios efektyviai skalėja
- Būsenos valdymą: sudėtingą duomenų apdorojimą ir gyvavimo ciklo valdymą
- Vartotojo sąsają: aiškų bendravimą ir reaguojančius valdiklius
- Testavimą ir derinimą: iteratyvų vystymą ir problemų sprendimą
⚡ Ką galite padaryti per artimiausias 5 minutes
- Žaidimas pilną žaidimą ir išbandykite visas pergalės ir pralaimėjimo sąlygas
- Eksperimentuokite su įvairiais pabaigos sąlygų parametrais
- Pabandykite pridėti console.log išrašus, kad sektumėte žaidimo būsenos pokyčius
- Pasidalykite žaidimu su draugais ir gaukite atsiliepimų
🎯 Ką galite nuveikti per šią valandą
- Užbaigti po pamokos testą ir apmąstyti savo žaidimų kūrimo kelionę
- Pridėti garso efektų pergalės ir pralaimėjimo būsenoms
- Įgyvendinti papildomas pabaigos sąlygas, pvz., laiko ribojimą ar papildomus tikslus
- Sukurti skirtingus sunkumo lygius su skirtingu priešo skaičiumi
- Patobulinti vizualinį pateikimą su geresniais šriftais ir spalvomis
📅 Jūsų savaitės trukmės žaidimų kūrimo meistriškumas
- Užbaigti išplėstinį kosmoso žaidimą su keliais lygiais ir progresavimu
- Pridėti pažangias funkcijas, tokias kaip galių efektai, skirtingi priešo tipai ir specialieji ginklai
- Sukurti aukščiausių rezultatų sistemą su nuolatine saugykla
- Sukurti vartotojo sąsajas meniu, nustatymams ir žaidimo pasirinkimams
- Optimizuoti veikimą skirtingiems įrenginiams ir naršyklėms
- Talpinti žaidimą internete ir dalintis jį bendruomenei
🌟 Jūsų Mėnesio Trukmės Žaidimų Kūrimo Karjera
- Sukurkite kelis pilnus žaidimus, tyrinėdami skirtingus žanrus ir mechanikas
- Išmokite pažangius žaidimų kūrimo karkasus, tokius kaip Phaser ar Three.js
- Prisidėkite prie atviro kodo žaidimų kūrimo projektų
- Studijuokite žaidimų dizaino principus ir žaidėjų psichologiją
- Sukurkite portfelį, demonstruojantį jūsų žaidimų kūrimo įgūdžius
- Užmegzkite ryšius su žaidimų kūrėjų bendruomene ir toliau mokykitės
🎯 Jūsų Pilnas Žaidimų Kūrimo Meistriškumo Laiko Planas
timeline
title Pilnas žaidimų kūrimo mokymosi procesas
section Pagrindai (Pamokos 1-2)
Žaidimo architektūra: Projekto struktūra
: Išteklių valdymas
: Tapyklės pagrindai
: Įvykių sistemos
section Sąveikos sistemos (Pamokos 3-4)
Žaidėjo valdymas: Įvesties apdorojimas
: Judėjimo mechanika
: Susidūrimo aptikimas
: Fizikos simuliacija
section Žaidimo mechanika (Pamoka 5)
Atsiliepimų sistemos: Taškų skaičiavimo mechanizmai
: Gyvybės valdymas
: Vizualinė komunikacija
: Žaidėjo motyvacija
section Žaidimo užbaigimas (Pamoka 6)
Poliravimas ir srautas: Pabaigos sąlygos
: Būsenos valdymas
: Perkrovimo sistemos
: Vartotojo patirtis
section Pažangios funkcijos (1 savaitė)
Tobulinimo įgūdžiai: Garso integracija
: Vizualiniai efektai
: Lygio progresavimas
: Veikimo optimizavimas
section Profesinis vystymasis (1 mėnuo)
Pramonės pasirengimas: Sistemos įvaldymas
: Komandos bendradarbiavimas
: Portfelio kūrimas
: Bendruomenės įsitraukimas
section Karjeros pažanga (3 mėnesiai)
Specializacija: Pažangūs žaidimų varikliai
: Platformų diegimas
: Monetizacijos strategijos
: Pramonės tinklaveika
🛠️ Jūsų Pilno Žaidimų Kūrimo Įrankių Rinkinys
Baigus visą šią kosminio žaidimo seriją, jūs išmokote:
- Žaidimų architektūra: Įvykių varomi sistemos, žaidimų ciklai ir būsenų valdymas
- Grafikos programavimas: Canvas API, sprite'ų atvaizdavimas ir vizualiniai efektai
- Įvesties sistemos: Klaviatūros valdymas, susidūrimų aptikimas ir reagavimas į valdymą
- Žaidimų dizainas: Žaidėjo atsiliepimai, progresijos sistemos ir įsitraukimo mechanikos
- Veikimo optimizavimas: Efektyvus atvaizdavimas, atminties valdymas ir kadrų dažnio kontrolė
- Vartotojo patirtis: Aiškus bendravimas, intuityvūs valdikliai ir išbaigti detalės
- Profesionalūs modeliai: Švarus kodas, derinimo metodai ir projekto organizavimas
Tikslinės taikymo sritys: Jūsų žaidimų kūrimo įgūdžiai tiesiogiai pritaikomi:
- Interaktyvios žiniatinklio programos: Dinamiškos sąsajos ir realaus laiko sistemos
- Duomenų vizualizacija: Animacinės diagramos ir interaktyvi grafika
- Mokslinė technologija: Žaidybinimas ir įtraukiančios mokymosi patirtys
- Mobilioji kūrimas: Jutiklinės sąveikos ir veikimo optimizavimas
- Simuliacinė programinė įranga: Fizikos varikliai ir realaus laiko modeliavimas
- Kūrybinės industrijos: Interaktyvi menas, pramogos ir skaitmeninės patirtys
Įgyti profesionalūs įgūdžiai: Dabar galite:
- Projektuoti sudėtingas interaktyvias sistemas nuo nulio
- Derinti realaus laiko programas naudodami sistemingus metodus
- Optimizuoti veikimą sklandžiai vartotojo patirčiai
- Kūrti įtraukiančias vartotojo sąsajas ir sąveikos modelius
- Bendradarbiauti efektyviai techniniuose projektuose su tinkama kodo organizacija
Įvaldyti žaidimų kūrimo konceptai:
- Realaus laiko sistemos: Žaidimų ciklai, kadrų dažnio valdymas ir veikimas
- Įvykių varoma architektūra: Atjungtos sistemos ir pranešimų perdavimas
- Būsenų valdymas: Sudėtingas duomenų tvarkymas ir gyvavimo ciklo valdymas
- Vartotojo sąsajos programavimas: Canvas grafika ir reaguojantis dizainas
- Žaidimų dizaino teorija: Žaidėjo psichologija ir įsitraukimo mechanikos
Kitas lygis: Jūs pasiruošę tyrinėti pažangius žaidimų karkasus, 3D grafiką, daugelio žaidėjų sistemas arba pereiti į profesionalaus žaidimų kūrimo pozicijas!
🌟 Pasiekimas atrakintas: Sėkmingai įveikėte visą žaidimų kūrimo kelionę ir sukūrėte profesionalios kokybės interaktyvią patirtį nuo nulio!
Sveiki atvykę į žaidimų kūrėjų bendruomenę! 🎮✨
GitHub Copilot Agent Užduotis 🚀
Naudokite Agent režimą norėdami įvykdyti šią užduotį:
Aprašymas: Pagerinkite kosminį žaidimą, įgyvendindami lygio progresavimo sistemą su didėjančiu sudėtingumu ir papildomomis funkcijomis.
Užduotis: Sukurkite daugiapakopę kosminio žaidimo sistemą, kur kiekviename lygyje būtų daugiau priešų laivų su didesniu greičiu ir gyvybėmis. Pridėkite taškų daugiklį, kuris didėja su kiekvienu lygiu, ir įgyvendinkite galios papildus (pvz., greitą šaudymą arba skydą), atsitiktinai atsirandančius sunaikinus priešus. Pridėkite lygio užbaigimo premiją ir ekrane parodykite esamą lygį kartu su esamu tašku ir gyvybėmis.
Daugiau sužinokite apie agent režimą čia.
🚀 Neprivaloma Tobulinimo Užduotis
Pridėkite garsus į savo žaidimą: Pagerinkite žaidimo patirtį įgyvendindami garso efektus! Apsvarstykite galimybę pridėti garsus:
- Lazerio šūviai kai žaidėjas šaudo
- Priešo sunaikinimas kai laivai yra pataikomi
- Heros žala kai žaidėjas gauna smūgių
- Pergalės muzika kai žaidimas laimėtas
- Pralaimėjimo garsas kai žaidimas prarandamas
Garso įgyvendinimo pavyzdys:
// Sukurkite garso objektus
const laserSound = new Audio('assets/laser.wav');
const explosionSound = new Audio('assets/explosion.wav');
// Leiskite garsus žaidimo įvykių metu
function playLaserSound() {
laserSound.currentTime = 0; // Grąžinti į pradžią
laserSound.play();
}
Ką turite žinoti:
- Sukuria garso objektus skirtingiems garso efektams
- Nustato
currentTimeiš naujo, leidžiant greitai kartotis garso efektams - Valdo naršyklės automatinio paleidimo taisykles, garsus paleidžiant naudotojo sąveikose
- Tvarko garso garsumą ir laiką geresnei žaidimo patirčiai
💡 Mokymosi šaltinis: Ištirkite šį garsų pavyzdį, kad sužinotumėte daugiau apie garso įgyvendinimą JavaScript žaidimuose.
Po paskaitos testas
Peržiūra ir savarankiškas mokymasis
Jūsų užduotis – sukurti naują pavyzdinį žaidimą, tad apžiūrėkite keletą įdomių žaidimų ir pažiūrėkite, kokio tipo žaidimą galėtumėte sukurti.
Užduotis
Atsakomybės apribojimas: Šis dokumentas buvo išverstas naudojant dirbtinio intelekto vertimo paslaugą Co-op Translator. Nors siekiame tikslumo, prašome atkreipti dėmesį, kad automatizuoti vertimai gali turėti klaidų ar netikslumų. Originalus dokumentas jo gimtąja kalba turi būti laikomas autoritetingu šaltiniu. Svarbiai informacijai rekomenduojamas profesionalus žmogaus atliktas vertimas. Mes neatsakome už bet kokius nesusipratimus ar neteisingus supratimus, kilusius naudojantis šiuo vertimu.