Rozpocznij swoją przygodę z tworzeniem gier dzięki prostocie 24a2

Rozpocznij swoją przygodę z tworzeniem gier dzięki prostocie 24a2
Czytelnicy tacy jak ty pomagają wspierać MUO. Kiedy dokonujesz zakupu za pomocą linków na naszej stronie, możemy otrzymać prowizję partnerską. Czytaj więcej.

24a2 to bardzo prosty, ale w pełni działający silnik gry dla programistów JavaScript. Ma niezwykły wygląd i działanie, ale można go używać do nauki podstaw programowania gier.





Dzięki obsłudze pętli gry, kolorowej grafice i prostemu wprowadzaniu danych 24a2 ma wszystko, czego potrzebujesz do tworzenia małych gier przy minimalnym wysiłku.





Sprawdź 24a2 i już dziś rozpocznij swoją podróż w kierunku pełnego tworzenia gier.





Co to jest 24a2?

24a2 to mały silnik typu open source, który pomaga tworzyć podstawowe gry. Jest bardzo łatwy do nauczenia, a wszystko, czego potrzebujesz, aby zacząć tworzyć swoje gry, to przeglądarka internetowa i edytor tekstu.

24a2 bierze swoją nazwę od rozdzielczości: 24 x 24. Nawet w porównaniu do innych minimalistyczne silniki, takie jak PICO-8 , z rozdzielczością 128 x 128, to jest malutkie! 24a2 wykorzystuje okrągłe „piksele” z dużymi odstępami między nimi, więc wygląda dość charakterystycznie.



jak zmienić hasło sieciowe w systemie Windows 10
  Podstawowa gra narciarska z graczem pokazanym na ścieżce pośrodku dwóch terenów zielonych.

Prawdopodobnie nie będziesz używał 24a2, aby wymyślić kolejną przebojową grę wideo, ale tak naprawdę nie o to chodzi. 24a2 jest idealny dla początkujących i możesz go użyć do poznania podstawowych koncepcji tworzenia gier.

Świetnie nadaje się również do prototypowania podstawowej koncepcji. Jeśli rozprasza Cię złożona fizyka gry lub animacje duszków, pozbycie się tego wszystkiego powinno pomóc Ci się skoncentrować.





Co więcej, kod źródłowy 24a2 to pojedynczy plik TypeScript . Możesz go wykorzystać jako inspirację, a nawet zmodyfikować, aby stworzyć własny, bardziej zaawansowany silnik gry.

Jak używać 24a2?

Zacznij od podstawowego szablonu swojej gry:





 <html> 
  <head>
    <script
      src="https://cdn.jsdelivr.net/gh/jamesroutley/24a2/build/engine.js">
    </script>
    <script src="game.js"></script>
  </head>
  <body></body>
</html>

Zwróć uwagę, jak wykorzystuje sieć dostarczania treści (cdn.jsdelivr.net) do pozyskiwania silnik.js plik, więc nie musisz nawet niczego pobierać ani instalować.

Drugi skrypt, gra.js , jest dla twojego własnego kodu do gry. Zacznij od absolutnie minimalnego działającego kodu, aby sprawdzić, czy wszystko działa poprawnie:

new Game({}).run();

Ten mały program wyświetli w przeglądarce domyślną siatkę 24a2:

  Domyślna siatka 24x24 jasnoszarych kół, które tworzą 24a2's playfield.

Następnie będziesz chciał zapoznać się z funkcjami wywołania zwrotnego 24a2, które stanowią rdzeń silnika. Koncepcje te można przenosić między silnikami gier, więc poznanie ich działania przyniesie korzyści wykraczające poza korzystanie z 24a2.

Istnieje kilka podstawowych funkcji, które można zdefiniować i przekazać do konstruktora Game() za pośrednictwem pliku a konfiguracja obiekt.

 let config = { 
  create: create,
  update: update,
  onKeyPress: onKeyPress,
  onDotClicked: onDotClicked
};

let game = new Game(config);
game.run();

24a2 wywołuje funkcję określoną w config.create podczas uruchamiania. Możesz użyć tego do zainicjowania własnej konfiguracji gry, skonfigurowania struktur danych itp.

 function create(game) {}

Funkcja aktualizacji działa okresowo przez cały czas gry. To jest główna pętla gry który w innych silnikach zwykle składa się z oddzielnych kroków aktualizacji stanu gry i przerysowania ekranu. Z 24a2 obsłużysz obie operacje w tej funkcji.

 function update(game) {}

Wreszcie, aby przechwytywać dane wejściowe, będziesz chciał obsługiwać naciśnięcia klawiszy strzałek, kliknięcia myszą lub jedno i drugie. 24a2 przekazuje kierunek do twojej funkcji onKeyPress, gdy gracz naciska klawisz ze strzałką. Przekazuje współrzędne x i y do onDotClicked, jeśli klikną kropkę za pomocą myszy.

 function onKeyPress(direction) {} 
function onDotClicked(x, y) {}

Jakie rodzaje gier możesz stworzyć za pomocą 24a2?

The miejsce 24a2 zawiera trzy przykładowe gry, w tym samouczek. Inne, które prezentuje, to prosta gra w węża i wyzwanie narciarskie.

The Repozytorium GitHub zawiera linki do innych gier, w tym Space Invaders, Kółko i krzyżyk oraz minimalny program Paint. You Killed a Bear jest bardziej zaawansowany, a Maze Craze to dobra demonstracja tego, jak nałożyć dodatkową grafikę na standardową siatkę.

24MadRush to „klon” Tetrisa, który świetnie wykorzystuje paletę kolorów. Rozpoczyna się również innowacyjnym samouczkiem, który demonstruje jego funkcje.

  24MadRush, gra polegająca na spadaniu bloków z łatką mieszanych kolorowych kropek w dolnych 4 rzędach.

Specyfikacje techniczne gier 24a2

24a2 jest z założenia bardzo ograniczony. Daje to jednak doskonałą okazję do kreatywności. Jeden z najlepsze wskazówki, jak być bardziej kreatywnym jest przyjęcie ograniczeń.

Oprócz ograniczonej rozdzielczości, 24a2 ogranicza Cię do:

  • Paleta kolorów zaledwie dziewięciu kolorów: tęczowych oraz czerni i szarości.
  • Bardzo podstawowe dane wejściowe: naciśnięcia klawiszy strzałek i kliknięcia myszą na siatce kropek.
  • Cisza: nie ma żadnej obsługi muzyki ani efektów dźwiękowych.

Jednak zawsze możesz napisać dodatkowy kod JavaScript, aby rozszerzyć swoją grę poza te ograniczenia. A ponieważ silnik jest open source, możesz go rozwijać w dowolny sposób, który uznasz za stosowny.

Zmobilizuj się do większych rzeczy z 24a2

Spróbuj przetestować się z 24a2. Odtwórz klasyczną grę lub wymyśl własną. Gry turowe, takie jak gry planszowe, będą bardzo dobrze współpracować z silnikiem.

Jeśli 24a2 rozpali w Tobie pasję do tworzenia gier, masz mnóstwo okazji, by kontynuować tę podróż. PICO-8, Godot, Unity i GameMaker to popularne wybory.