HYPERHELL: gra 4D Doom na WebGPU

Otwarty projekt HYPERHELL: 4D-labirynt w stylu Doom na WebGPU

Otwarty projekt HYPERHELL oferuje 4D-labirynt w stylu klasycznego Doom. Wersja demo uruchamia się w przeglądarce na sprzęcie zgodnym z WebGPU. Testy potwierdzono na MacBook M1/M2 i kartach graficznych Nvidia w Chrome. Gracz porusza się po czterowymiarowej przestrzeni, walcząc z demonami, zagubionymi duszami i mrocznymi aniołami. Spotkania z Handlarzem pozwalają wymienić zasoby w celu kontynuacji.

Rozwijający zastosował renderowanie za pomocą „4D-oka” — kamery z czujnikiem 3D według mechaniki Unblink. Pozwala to wizualizować struktury 4D bez tradycyjnych projekcji.

Techniczna realizacja renderingu 4D

HYPERHELL wykorzystuje WebGPU do przetwarzania czterowymiarowej geometrii. Kluczowy element to 4D-kamera, modelująca percepcję trzeciego wymiaru w przestrzeni 4D. Różni się to od standardowych projekcji 3D, w których gubi się informacja o wyższych wymiarach.

• Wymagania WebGPU: Zgodna przeglądarka (Chrome) i GPU (Nvidia, Apple Silicon M1/M2).
• Wizualizacja 4D: Mechanika „Unblink” z czujnikiem 3D do natywnego wyświetlania obiektów 4D.
• Mechanika gry: Nawigacja po hiperkubie, walki w czasie rzeczywistym, wymiana zasobów.
• Kod otwarty: Dostępny na GitHub do nauki i modyfikacji.

Projekt nastawiony jest na eksperymenty z hipergeometrią w czasie rzeczywistym, co jest aktualne dla middle/senior-developerów w dziedzinie renderingu GPU.

Alternatywa: cssDoom bez canvas i WebGL

Równolegle przedstawiono cssDoom — port Doom na czystym CSS do grafiki i JavaScript do logiki. Brak canvas i WebGL czyni go wyjątkowym do demonstracji możliwości CSS w gamedevie.

Punktem odniesienia jest oryginalny kod Doom. Projekt licencjonowany GPLv2, kod na GitHub. Przydatne to do zrozumienia niskopoziomowego renderowania bez akceleracji sprzętowej.

• Grafika: Animacje i transformacje CSS dla sprite'ów i otoczenia.
• Logika: Vanilla JavaScript, kompatybilny z każdą nowoczesną przeglądarką.
• Zalety: Minimalne zależności, nacisk na stylizację poprzez CSS.
• Ograniczenia: Wydajność niższa niż odpowiedniki WebGL z powodu renderingu CPU.

Porównanie podejść do retro-shooterów

HYPERHELL rozszerza Dooma do 4D, skupiając się na WebGPU do złożonych obliczeń. cssDoom przeciwnie ogranicza się do CSS/JS, poświęcając wydajność na rzecz czystości stosu.

| Aspekt | HYPERHELL | cssDoom |

|--------------|---------------|-----------|

| Renderowanie | WebGPU, 4D | CSS-only |

| Zależności | GPU | Przeglądarka |

| Złożoność | Wysoka (geometria 4D) | Niska (2.5D) |

| Licencja | Open Source | GPLv2 |

Oba projekty demonstrują kreatywne interpretacje klasyki dla web developmentu.

Co ważne

• HYPERHELL wprowadza rendering 4D poprzez WebGPU i mechanikę Unblink dla rzeczywistego postrzegania hipoprzestrzeni.
• Przetestowane na M1/M2 i Nvidia, demo dostępne online bez instalacji.
• cssDoom implementuje Dooma wyłącznie na CSS+JS, bez canvas/WebGL.
• Oba projekty otwarte na GitHub, nadają się do nauki alternatywnych technik renderowania.
• Nacisk na wydajność i minimalizm bez marketingowych dodatków.

— Editorial Team