Google toont html 5-versie Quake II met WebGL

Ontwikkelaars van Google hebben een html 5-port gemaakt van de shooter Quake II, die oorspronkelijk in 1997 verscheen. De browserversie van het spel is gemaakt met Googles Web Toolkit en maakt gebruik van WebGL voor 3d-rendering.

De ontwikkelaars van Google hebben de port gemaakt in hun '20%-tijd', waarin werknemers van het internetbedrijf aan hun eigen projecten kunnen werken. Quake II kwam in 1997 uit en in december 2001 gaf id Software de broncode onder de GPL-licentie van de engine vrij. Als basis voor de html 5-versie van het schietspel is gekozen voor de Java-port Jake 2, die door de ontwikkelaars is overgezet naar Googles Web Toolkit.

De Google-ontwikkelaars schreven vervolgens een nieuwe 3d-renderer, die gebruikmaakt van WebGL voor 3d-versnelling. Ook de code achter de netwerklaag, het laden van resources en het wegschrijven van savegames en voorkeuren werd op de schop genomen. De html 5-versie van Quake II is te spelen met de laatste nightlies van Chrome en Webkit.

Het is niet de eerste keer dat een game van id Software een nieuw leven krijgt in een webbrowser. Er zijn verschillende ports van Wolfenstein 3D in omloop, inclusief een versie van slechts vijf kilobyte. Het Texaanse id Software heeft zelf Quake Live ontwikkeld, een browservariant van Quake III: Arena. Quake Live is echter een browser-plug-in en maakt geen gebruik van html 5.

Reacties (91)

[jongerenchaos]

Toch zit hier wel weer een google tintje achter. Het spel wordt namelijk alleen (goed) ondersteunt door de webbrowser; Google Chrome... wat een toeval...

[nickb90]

kan dat niet te maken hebben dat Chrome html 5 goed ondersteunt?

Zie: nieuws: NPO past html 5 toe op website Radio 1

[J.J.J. Bokma]

Aangezien HTML 5 nog niet eens klaar is als draft (zie ook mijn reaktie boven), kan dat niet eens.

[Kiezel]

Ik dacht dat bijvoorbeeld safari dat ook doet. Maar misschien ondersteunen die dan weer geen webGL...?

[TDeK]

In de nightlies van Safari.
@Trat: als je ze download en draait, dan zie je dat Safari als host gebruikt wordt.

[Reactie gewijzigd door TDeK op 26 juli 2024 11:28]

[Anoniem: 330654]

In 4.05 ook gewoon... Er zijn geen nightlies van Safari, dat zijn nightlies van webkit.

[user109731]

Dit werkt ook in Safari, volgens de website.

[watercoolertje]

Natuurlijk draai je het in je eigen browser (ze hebben het spel bij google ook geport=tijd=geld) Maargoed de hele webgl versnelling zou in webkit en dus ook veel andere browsers moeten werken, welke up to date zijn natuurlijk

[Anoniem: 129588]

Er is nog geen enkele browser die HTML5 volledig ondersteund.
Waarschijnlijk worden alleen die onderdelen gebruikt die door WebKit ondersteund worden.

[J.J.J. Bokma]

Dat kan ook niet: "It is estimated by the editor that HTML5 will reach the W3C Candidate Recommendation stage during 2012.", zie: http://wiki.whatwg.org/wi...will_HTML5_be_finished.3F

Waar ook staat: "But other sections .. not even written yet. "

[Mellow Jack]

Toch wel logisch dat ze het hier als eerste op willen draaien

Ik zie die ontwikkelaar al bij zijn manager komen, jaah moet je kijken wat ik heb gemaakt in mijn 20 % tijd.... een 3D game die draait in safari

Waarom safari? Nou ja anders had het een te erg google tintje

Jaah daar scoren ze punten mee whahaha


Ook lijkt het mij logisch dat zei de beschikking hebben tot de interne documentatie van chrome. Ik denk dat het dan ook iets gemakkelijke is om te optimaliseren!

[J.J.J. Bokma]

Manager moet goedkeuring geven voor een 20% project, dus die wist al waar aan gewerkt werd.

[Repsaj_Nav]

In het filmpje wordt anders Safari gebruikt.
Chrome en Safari zijn beide gebaseerd op WebKit, dus de kans is groot dat ze dit spel alletwee kunnen draaien.

[Anoniem: 77640]

Google heeft ook het open-source ANGLE project gecreëerd (geprogrammeerd door TransGaming), waardoor alleszinds op Windows de ondersteuning voor WebGL geen probleem vormt. Het zal dus niet lang duren eer andere browsers dit ook kunnen draaien. Dankzij Google.

[ZpAz]

En Safari, die gebruikt ook Webkit, en Apple is mede ontwikkelaar van WebGL & OpenGL, alsook Google. Imho is Webkit ook de meest geavanceerde engine die er is.

[Anoniem: 135756]

Ik heb Google anders nog nooit op "it only works on Google" praktijken kunnen betrappen. Het zou ook behoorlijk debiel zijn om IE en Firefox de negeren: Die hebben veel meer gebruikers dan Chrome heeft.

[Sc0tTy]

ik moet echt is meer info gaan zoeken over html5

in mijn ogen is html nogsteeds de code waar je websites mee weergeeft, waarom je hiermee games wil maken kan ik echt niet begrijpen en wie heeft dit uberhaupt verzonnen

hmm na even snel de html5 specs gelezen te hebben, zie ik niet echt iets waarmee je een game zou kunnen maken, word er hier dan met JS gewerkt ?

[Reactie gewijzigd door Sc0tTy op 26 juli 2024 11:28]

[kidde]

HTML 5 doet inderdaad alleen de opmaak.

Het programmeerwerk zit in de 'shader' programma's die WebGL naar de lokale OpenGL drivers stuurt, de javascript die WebGL aanstuurt (en WebGL vertaalt dat naar OpenGL), en de javascript van het spel zelf.

Dat hele 'programmatje' staat in een HTML5 canvas element, en dat element bepaalt de 'layaout' binnen de webpagina van het programma, schermresolutie en waar op de webpagina het staat dus. En men gebruikt HTML5 voor het geluid en 'cutscenes', dus de layout qua video en geluid.

In principe heeft deze demo dus bijzonder weinig met HTML5 te maken, meer met javascript en WebGL (WebGL is geen onderdeel van HTML5).

[Sc0tTy]

ah dat verduidelijkt de zaak

[harrald]

Nee css doet de opmaak
Html geeft betekenis en structuur aan wat anders loze content (vroeger alleen tekst) zou zijn.

En imho heeft deze demo alles met html5 te maken. Het feit dat je met html5 native in de browser kan tekenen en audio en video kan afspelen is vele malen bijzonderder dan het zoveelste progsel in javascript.

[Reactie gewijzigd door harrald op 26 juli 2024 11:28]

[Anoniem: 224933]

Ik dacht dat html5 niet meer aan de opmaak doet alleen aan de inhoud en css aan de opmaak. En DOM(javascript) aan de actie.

[Anoniem: 291270]

Er wordt inderdaad o.a. ook met JavaScript gewerkt ja.

[harrald]

Het is dan ook een combinatie van html5 en javascript en css. Valt ook te lezen in de tekst. Al is je verwarring niet heel vreemd want veel te vaak word er met dit soort dingen simpelweg gesproken over "html5" en laten ze javascript achterwege.

Van html5 word alleen het canvas element, en de video en audio elementen gebruikt. Voor dynamische dingen op een pagina is nog altijd javascript vereist.

[mstam]

Goed werk van Google en het valt me wel weer op dat Microsoft eigenlijk nooit met iets nieuws komt. Je kunt er vergif op innemen dat alle browsers behalve die van Microsoft spoedig de HTML 5 standaard flekkeloos ondersteunen.

[ZpAz]

Ja, maar WebGL valt niet onder de HTML5 spec, dus dan heb je er nog weinig aan, momenteel is dat dus enkel voor Webkit die het ondersteund (Safari, Chrome) en misschien Firefox, maar dat weet ik niet zeker.

[Laurens-R]

Onder welke steen heb jij de afgelopen tijd gezeten?

IE9 doet 't prima hoor met html 5

[kidde]

Microsoft kwam met DirectX 11 dat voorloopt op OpenGL 3 en features had die nog nergens anders waren te vinden. De OpenGL club is namelijk hopeloos conservatief, vooral door de CAD-boeren (Autodesk-tuig). Ze hobbelen een beetje achter DirectX / Mircosoft aan.

Gelukkig is er OpenGL 2 ES dat iets vooruitstrevender is, en daarop is WebGL gebaseerd.

[rvrbtcpt]

Heel mooi gedaan. Het toont aan wat mogelijk is met HTML5. Nu hopen dat zoiets ook nog op een eenvoudige manier te gebruiken is voor andere doeleinden dan gamen.

En heel erg mooi die 20% tijd.

[Reactie gewijzigd door rvrbtcpt op 26 juli 2024 11:28]

[watercoolertje]

En heel erg mooi die 20% tijd.

Ja dat is echt heel vet dat ze dat hebben, Google weet hun werknemers ook wel gelukkig te houden/maken hoor Iig misschien niet de schoonmakers maar de programmeurs iig

[TDeK]

offtopic:
Nou, dat denkt men vaak, maar andere verhalen die ik uit die hoek hoor spreken dat toch tegen.

Hele coole demo. Als we nu HTML5 <video> + <audio>, CSS3, JS 1.6 en WebGL samenvoegen, dan denk ik dat we een echte Flash killer hebben (al kan dat tegenvallen, want dan moet men ineens weer écht gaan coden ipv. timelines slepen ).

[Anoniem: 135756]

"écht gaan coden ipv. timelines slepen"

Zooo jij hebt zeker de laatste 10 jaar niet naar Flash gekeken.
Je MOET tegenwoordig zelfs bijna wel de code induiken met ActionScript de opzet is behoorlijk veranderd, helemaal met de komst van AS3.
Hetgeen absoluut geen straf is want AS werkt prima en is helemaal niet moeilijk.

[martijnsch]

Als iemand iets programeert waarmee je timelines kan slepen waarbij je output krijgt in HTML5 <video> + <audio>, CSS3, JS 1.6 en WebGL zie ik het probleem niet zo...

[psychodude]

Hoor veel goeds komen vanuit google, en ook vanuit de verhalen welk jij post. Het is gewoon allemaal een verschil in visie. De werkdagen van 10 tot 6 vallen mee, zijn beroepen waarbij dat echt wel langer is. Thuis nog wat door werken en beschikbaar zijn op email.... tjsa, dat geldt echt niet enkel bij Google.

Competitie binnen het bedrijf, afzonderlijke teams welk hetzelfde doen en may the best man win. Is enkel een slimme aanpak, maak 20 keer iets maar door verschillende teams en je zult gewoon vele methoden van aanpak zien waaruit je een beste kunt kiezen welk er ver boven uit springt of een aantal features van anderen mee kunnen nemen.

Als 1 team het doet, of 1 heel groot team waarbij het toch maar een klein groepje is welk met de ideeen zult komen, mis je gewoon veel input.

En 20%-tijd welk eigendom wordt van Google.... tsja, wat wil je? Ze zijn niet gek bij Google, net als iedere andere werkgever het niet zal waarderen dat je tijdens je werk even 1 dag in de week neemt om voor jezelf te werken of voor iets anders zal dat bij Google ook gelden. In plaats daarvan is de 20%-tijd bedoelt voor innovatie, geeft je de gelegenheid om je op iets te storten waar je zelf eventueel plezier aan beleeft.

Daarnaast levert Google hun werknemers faciliteiten daar kan het gemiddelde bedrijf bij lange na niet aan tippen.

En uiteindelijk komen onder andere dit soort dingen er uit voort, in dit geval iets wat wederom de kracht toont van html 5 en tevens webGL.


Een flash killer zie ik het overigens niet snel worden, en als het het al wordt.... dan gaat men toch niet coden . Nu heb je bij flash ook veelvuldig actionscript nodig wil je ergens komen wat enigzins mee kan gaan deze dagen. Dus wat doe je? Je plukt de code van het internet, vaak slecht geoptimalizeerd/langzaam/of simpelweg irritant, en ctrl+c -> ctrl+v does the rest.

Dit zal niet veranderen, mag je wel html5, css, js en webgl hebben; maar als het bagger code is schiet je er toch niets mee op. Javascript op zich laat dat al maar al te vaak zien.

[IStealYourGun]

Achter flash zit ook maar gewoon code, die timelines is gewoon een IDE om het animeren gemakkelijk te maken. Als je wat tijd teveel hebt kan je een IDE maken met timelines die deze perfect omzet naar html5

[Dykam]

De Timelines zijn niet zomaar een IDE feature wat omgezet wordt in flash binaries. Het is een fundementeel onderdeel van flash.

Als je met haXe gaat werken, een taal die naar flash compileert, en in de onderliggende code kijkt, zie je dat in frame 1 de bootcode staat, en dat jouw specifieke code in frame 2 draait.

[Anoniem: 40546]

Het is gewoon een gui onderdeel. Als de keyframer door elk ander werkbaar interface paradigma zou worden vervangen zou dat natuurlijk voor de uiteindelijk resulterende data geen reet verschil maken.

In HTML kan je prima een GUI onderdeel maken dat de zelfde werking heeft.

[YopY]

Heel mooi gedaan. Het toont aan wat mogelijk is met HTML5.

+ een browserplugin. Op zich zouden ze dit ook met 'gewoon' Flash of Java hebben kunnen doen. Wat dit slechts aantoont is dat ze het ook met een nieuwe techniek zoals HTML 5 met hulp van een 3D plugin kunnen doen.

[MM99]

Waar haal jij dat nou weer vandaan? in dit artikel staat nergens dat er een plug-in geïnstalleerd moet woorden.

Ik zou graag de broncode willen zien. Als dit een redelijk lage leer curve heeft, betekend dit einde van meeste webframworks (flash/Java fx/Silverlight/etc.)

-edit: indd, er moet iets voor ged/l worden. http://code.google.com/p/...t/wiki/BuildingAndRunning Op dit moment werkt het alleen nog maar op linux/max systemen zelfs.

[Reactie gewijzigd door MM99 op 26 juli 2024 11:28]

[Keypunchie]

Ik zou graag de broncode willen zien

PPREWN linkt hem iets verderop in deze thread:

http://code.google.com/p/quake2-gwt-port/

http://code.google.com/p/quake2-gwt-port/source/browse/

[Reactie gewijzigd door Keypunchie op 26 juli 2024 11:28]

[kidde]

Renderen gebeurt met WebGL, wat heel erg lijkt op OpenGL ES 2, en dat is weer een subset van OpenGL. Dus voor iemand die OpenGL kan is dat een eitje.

[supermidget]

je moet iets installeren om de server te draaien lijkt het. de client is gewoon de browser..

[RielN]

Wohoo! Ik heb eens een voordeel

[dmystic]

een 3d plugin? webgl is toch niet echt een plugin maar meer een manier om hardware acceleratie aan te roepen? of zijn directX en OpenGL ook plugins?

[j0bro]

Zonder een browserplugin!

Deze Quake2 port is gebouwd met de Google Web Toolkit, een framework waarmee je in Java programmeert en JavaScript compileert, per browser geoptimaliseerd.

De speciale Chromium build die je nodig hebt om het geheel te draaien, is voorzien van een WebGL implementatie, waarmee de rendering via JavaScript calls afgehandeld wordt door de grafische hardware, mits ondersteund. WebGL is een specificatie van Khronos, de club achter OpenGL.

Google werkt ondertussen aan O3D, een API die in feite hetzelfde mogelijk maakt en waarvoor nu al plugins te krijgen zijn voor alle browsers/platforms. Zie: http://code.google.com/intl/nl/apis/o3d/

[_Thanatos_]

Yeeuj, moeten we nu echt blij zijn dat iets dat 15 jaar geleden kon, nu nog steeds kan? Ja het zit in een webpagina, maar het feit dat men hierover anthousiast is, geeft alleen maar aan hoe verouderd het webplatform eigenlijk is.

[Mellow Jack]

Uuuhm het geeft weer hoe vooruitstrevend de web techniek is. Vroeger had je veel dingen nodig om een game te spelen, nu laten ze zien dat jij eigenlijk alleen een browser nodig hebt.
Waarom is dit zo vooruitstrevend? Nou vooral omdat ontwikkelaar met minder factoren te maken hebben. Werkt het op een bepaalde versie van webkit zal het voor al die gebruikers werken (mits je pc krachtig genoeg is natuurlijk) Oftewel, is je browser up to date? Dan ben je klaar om te gaan beginnen (zie ook gelijk de reden waarom Google hier zo mee bezig is ivm Chrome OS)!

Ook laat dit zien dat onwikkelaars nu nieuwe games kunnen ontwikkelen die een hoger grafisch niveau hebben dan deze game wat dus het aanbod games kan vergroten en gelijk een nieuw business model oplevert want we komen nu dicht bij een tripple A game die online beschikbaar is voor iedereen en waar het geld wordt verdient dmv reclames (en mogelijk micro transactie wat ik niet hoop )

[Fuzzillogic]

Vooruitstrevend? Pardon? Zoals Thanatos al aangeeft is het 15 jaar oude techniek die we nu olee olee in een browser hebben draaien. En nog traag ook. Zelfs deze state-of-the-art web-tech hobbelt 15 jaar achter de échte state-of-the-art aan.

Dedicated software blijft voorlopig toch echt de beste keuze voor heel veel dingen.

[RielN]

Maar zeker NIET de toekomst.
Tijd dat de browser gaat inhalen, en dat is precies wat we nu zien.

[Fuzzillogic]

Niet de toekomst? Ik zie juist de huidige webtech niet de toekomst worden. Als developer vind ik het maar een ramp om in te programmeren, als het wat meer wordt dan wat simpele scriptjes (waar het voor gemaakt is). De ontwikkeling van HTML5/WebGL veranderen daar bar weinig aan. En als gebruiker loop ik ook nog dikwijls tegen sites aan die dermate bagger in elkaar steken dat ik ook al snel wegren.

Ik zie meer in dat de browser een soort launchpad wordt voor applicaties die niet zozeer in de cloud draaien, maar die transparant uit de cloud gedownload worden naar de lokale PC, en juist daar draaien.

Java Webstart vind ik een goed voorbeeld daarvan. Microsoft heet OneClick, zelfde concept voor .NET (==NIET gemaakt voor cross-platform compatibiliteit overigens!)

[RielN]

Ik geloof toch meer in de cloud De cross-platform gaat de doorslag geven, en die ontwikkeling is ook veel logischer.

[Fuzzillogic]

Ontwikkeling logischer? Leg uit.

En ik heb ook niet zozeer iets tegen de cloud. Maar als storage, niet als place of processing met je webbrowser als thin client. En het webplatform is écht nog lang niet klaar om als thick of zelfs full client op te treden. En for sake of usability and efficiency wil ik dat wel. Of denk je dat er binnen 5 jaar serieus gephotoshopt kan worden in de cloud door professionals?... (laat staan video-editing)

[Anoniem: 224933]

Laat toch echt niet de cloud doorschieten dat is hetzelfde als een bakker die de oven bij de buren heet staan.

[kidde]

1x een spel ontwikkelen dat vervolgens onder 4 OS'en in 4 verschillende browsers op minstens 2 processorarchitecturen gegarandeerd werkte, zowel op PC's, netbooks, telefoons als tablets kon 15 jaar geleden zeer zeker niet! Dat komt er nu aan.

Dat is fijn, want dan kunnen die browsers / OS'en / processors onderling concurreren, dus je wordt door een spel niet gedwongen een bepaalde hardware / softwarekeuze te maken zoals nu wel het geval i.s. Dus je kan overstappen op een ander platform en hetzelfde spel blijven spelen.

Verder maakt het voor kleine spellen installatiemedia overbodig, dus veel goedkopere distributie.

[_Thanatos_]

En het feit dat het nu even snel loopt als 10 jaar geleden zegt je niets?

[RielN]

Ja, dat is goed. Quake2 zal niet sneller gaan lopen. Het loopt toch goed?

[_Thanatos_]

Kan zijn, maar 10 jaar geleden hadden we Pentium PC's met GPU's die nog zó eenvoudig waren, dat er niet eens een heatsink op hoefde. Nu hebben we dikke quadcores met nog dikkere videokaarten die fotorealistische beelden op enorme resoluties vloeiend weergeven.

En dan dit.

[Reactie gewijzigd door _Thanatos_ op 26 juli 2024 11:28]

[Fuzzillogic]

1x een spel ontwikkelen dat vervolgens onder 4 OS'en in 4 verschillende browsers op minstens 2 processorarchitecturen gegarandeerd werkte, zowel op PC's, netbooks, telefoons als tablets kon 15 jaar geleden zeer zeker niet! Dat komt er nu aan.

Ohnee? Java is 15 jaar oud. En is ontwikkeld met portabiliteit in gedachte.

Een paar jaar geleden Quake2 als Java-applet gespeeld. >>200fps, op mijn toch niet al te indrukwekkende hardware. Dat is wel andere koek dan die.. nou.. 15-20fps die ik hier zie op een state-of-the-art PC.

Granted, JavaSE op een mobiel tref je niet aan, dat is jammer maar ligt niet eens aan Java - huidige hardware is er echt wel krachtig genoeg voor.

[Xe0n]

Ben ik de enige die denkt aan een 1 april grap?

[firefly112]

1 apri l grap op 2 april
jij wel

[kidde]

't is geen 2 april, dat 't 2 april is, is ook 1 aprilgrap!

Grapje, 1 april! 't is 2 april.

[Reactie gewijzigd door kidde op 26 juli 2024 11:28]

[Anoniem: 111970]

Daar krijgt het ANP moeilijkheden mee!

[Anoniem: 291270]

Ik denk het wel.. Aangezien de code bijvoorbeeld gewoon online staat.

[Ras]

Hoe lang zou het duren voordat je de eerste first-person-shooter in google maps kunt spelen, met de 3d-gebouwen zoals nu al in Google Earth te zien is?

[Mellow Jack]

Lol lachen idee, kan je eindelijk oorlog spelen in een replica van je stad

[sab]

Binnen 5 jaar, schat ik.

[Anoniem: 135756]

Ik zit meer te denken aan 3D navigatie op websites.

[Emielio]

Prachtig dat ze zo de mogelijkheden met HTML 5 tonen. Ik hoop dat men hiermee echt flash kan uitfaseren. Dat zou mooi zijn. Op meerdere (non-windows) platformen is flash zo slecht, dat je hele pc kan vastlopen van een flinke flash site....

[g4wx3]

HTML 5 is veel te moeilijk...

Flash zal niet verdwijnen

Er bestaan al veel demos.

2 jaar geleden was ik nog onder de indruk van een demo met Canvas en javascript.

[Clavius]

Wat fijn dat jij het allemaal zo goed weet, en het ons stervelingen als zijnde feiten presenteert!

[J.J.J. Bokma]

Ik denk dat g4wx3 gelijk heeft op alle punten.

Feit: HTML 4.01 strict is al te moelijk (en XHTML nog meer). Bewijs? Kijk maar eens rond in de broncode van diverse sites. HTML 5 is dus zeker veel te moeilijk voor bosjes mensen.

Flash zal niet verdwijnen: feit: chrome komt met betere Flash ondersteuning, dus op de korte termijn (5-10 jaar) zal dit zeker opgaan.

Er zijn veel Flash demos, correct.

En ik denk dat de meeste mensen 2 jaar terug onder de indruk waren van een demo met Canvas en JavaScript, ik wel.

Dat je het niet eens bent, mag, maar onderbouw het dan inplaats van om de man te spelen.

[Fuzzillogic]

En developer voor wie Strict al te moeilijk is geen knip voor de neus waard. En moeten specs nou echt dumbed down worden zodat ook idioten ermee kunnen werken? Kom op zeg. Ik als professional devver wil graag met fatsoenlijk spul werken, niet met driewielertaaltjes.

[Hakker]

HTML strict is al te moeilijk voor veel developers of het kan ze gewoon geen ene bal interreseren wat nog veel erger is imo.

Echt hoeveel prof sites je wel niet ziet wat niet eens lijkt op een nette oplossing is belachelijk hoog. Echt jij doet het misschien wel goed Fuzzillogic helaas doen heel veel branche collegas van jou het nog steeds niet.

[tedades]

Voor iedereen die dit een keer wilt proberen:
http://code.google.com/p/...t/wiki/BuildingAndRunning

Nodig: mac/linux icm. laatste chrome (geen firefox ), draait lokaal dus je zult echt zelf wat werk moeten doen om het uit te proberen.

[E-E-R]

De firefox nightlies hebben toch ook support voor WebGL? Ik ben benieuwd of dat wel goed gaat

[Anoniem: 270700]

Ze vermelden 60 fps, maar het filmpje schokte wel...

[Anoniem: 291270]

Er is sowieso verlies qua performance door het opnemen van een filmpje lijkt me.

[voodooless]

't is een filmpje van youtube... dat schokt per definitie