Hypnokästchen

Etwas neues steht vor der Tür! Ok, eigentlich ist es schon in die Wohnung eingefallen, hat sich in den bequemsten Sessel geflätscht und geht jetzt einfach nicht mehr.

Ich hab in letzter Zeit viel über Javascript gelernt .. und bin total fasziniert von dieser Sprache. Und was gibt es besseres, als ein Projekt zu beginnen, um wirklich in die tiefen vorzudringen?

Mir schwirren sowieso immer irgendwelche Ideen im Kopf rum, also hab ich eine genommen, mir ne Spielidee daraus zusammengebastelt und angefangen, sie umzusetzen.

Und gerade ist mir die Idee gekommen, dass es vielleicht interessant wäre, meine ersten tapsigen Schritte im Spieleentwicklungsbereich zur allgemeinen Erheiterung zu protokollieren. Also: Los geht’s!

Worum geht’s denn jetzt genau?

• Ich will Javascript!
• Ich will ein Multiplayerspiel!
• Ich will schnelle Echtzeitgrafik!

Javascript? Echtzeit? Multiplayer? Jaha .. das geht – wenn man denn ein paar Abstriche machen kann. Und ich kann und bin wild entschlossen.

Technologien

Ich werde folgende Technologien einsetzen und versuchen, das ganze so performant wie nur eben möglich umzusetzen – um eventuell noch komplexere Dinge damit anstellen zu können.

• Websockets (Wikipedia)
• HTML 5 Canvas (Wikipedia)
• Node.js (Homepage)

Das bedeutet, dass für dieses Projekt nur folgende Browser in Frage kommen,
alle anderen – vor allem der Internet Explorer – bleiben draussen.

Browserunterstützung

• Google Chrome 4
• Opera 10.70
• Safari 5 (noch nicht von mir getestet)
• Firefox 4 (noch nicht von mir getestet)

Was bedeuteten diese Begriffe?

Erklärung der eingesetzten Technologien

Websockets

Websockets sind eine (sehr neue) Möglichkeit, eine persistende, bidirektionale Verbindung von einer normalen Website zu einem Server aufbauen zu können. Das bedeutet tatsächlich, dass man einen direkten Kanal hat, über den sowohl der Client als auch der Server ständig Daten austauschen können, ohne jedes mal eine neue Verbindung aufbauen zu müssen. Das macht Websockets wesentlich schneller sind, als “normale” HTTP-Anfragen, da vieles wegfällt, was langsam ist:

• Ein eventueller DNS-Lookup – passiert beim IE alle 30 Minuten, beim Firefox jede Minute, siehe http://developer.yahoo.com/performance/rules.html unter  ”Reduce DNS Lookups”
• Overhead, der für kurze Statusupdates (habe meine Maus jetzt nach x:120,y:500 bewegt) bei jedem HTTP-Request mitgesendet wird, siehe http://de.wikipedia.org/wiki/Hypertext_Transfer_Protocol#HTTP_GET
  
• Eventuell muss der Server erst einen Prozess spawnen, um die HTTP-Anfrage zu beantworten (Dazu auch der Node.js Teil unten)

Man muss vielleicht noch dazu sagen, dass gerade die Websockets es sind, die den IE und alle älteren Browser ausschliessen. Allerdings kann man bei Spielen nicht darauf warten, dass ein Mausklick eine halbe Sekunde zum Server und wieder zurück braucht.

HTML 5 Canvas

Das Canvas Element wird schon länger von vielen Browsern – und vor allem auch vom IE – unterstützt.Wichtig für mein Vorhaben ist es, da es dynamische Grafiken auf dem Client ermöglicht. Beim Canvas ist es möglich, z.B. eine Linie von x1,y1 nach x2,y2 oder einen Kreis mit Radius r an position x,y zu zeichnen. Ausserdem können Bitmaps eingefügt und alles nach belieben gedreht und transformiert werden.

Den Kreis könnte man mit HTML zur Not auch noch mit einem skalierenden Bild simulieren – was eher doof aussieht – aber spätestens bei einer einfachen Linie ist man am Ende seiner Möglichkeiten. (Ja, ich weiss, man kann auch 1 Pixel grosse Div-Boxen einen Pfad lang absolut positionieren – aber bitte!).

Node,js

Habe ich nicht gesagt, dass ich Javascript will? Bittesehr, jetzt sogar auf dem Server Scherz beiseite. Node.js bringt einen noch viel grösseren Vorteil mit: Es ist darauf ausgelegt, eine grosse Anzahl an Anfragen gleichzeitig zu bearbeiten, ohne dabei in die Knie zu gehen. Da ich den Server auf meiner kleinen Miet-VPS aufsetze ist das ein nicht zu unterschätzender Vorteil. Aber warum wie kann Node.js viele Verbindungen bearbeiten? Ich vergleiche Node.js dabei mit PHP.

Bei einem standard Apache mit PHP würde für jede Verbindung ein Prozess gespawnt, der dann für diesen Client zuständig ist. Wenn dieser Prozess 20mb an RAM verbraucht (was nicht viel ist) verbrauchen 10 Clients 200mb. Ausserdem hängt jeder Prozess in seiner eigenen Schleife fest und wartet darauf, dass etwas geschieht, um dann darauf reagieren zu können.

Bei Node.js ist das anders. Hier gibt es genau einen Prozess (oder eher pro Prozessor einen – wenn konfiguriert) mit einer Schleife, die läuft. Die Programmierung in Node.js basiert auf einem Event Modell. Will man zum Beispiel auf Daten vom Websocket warten, registriert man ein “onData” Event, das gefeuert wird, sobald Daten ankommen.

Bei PHP  kann man man nur eine Schleife durchlaufen und jedes mal am Socket nachfragen, ob schon Daten da sind. Will man parallel auch noch etwas anderes mit diesem Prozess anstellen – zum Beispiel Berechnungen für Positionierungen anstellen – muss man dafür die “horch” Schleife pausieren. Erst wenn die Berechnungen durch sind, kann wieder nachgefragt werden, ob schon Daten da sind.

Node.js hingegen würde einfach beim “onData” Event den dafür registrierten Handler aufrufen und für sich arbeiten lassen. Kommen während der Berechnung, die der Handler anstellt, weitere Daten an, werden einfach weitere Handler gestartet.

Ein weiterer Vorteil ist die Kommunikation der verschiedenen Handler untereinander. Man speichert die für alle zugreifbaren Daten einfach im global Namespace ab und fertig. Bei PHP müsste man da schon auf Semaphoren oder eigens dafür angelegte Sockets vom Betriebssystem zurückgreifen.

Zugegebenermassen ist eventbasierende Programmierung verwirrender als die von einfachen Abläufen, da man immer aufpassen muss, ob eventuell noch andere Dinge abgearbeitet werden müssen, bevor man mit dem gerade gefeuerten Handler starten kann, allerdings hat das auch so seinen Reiz

Doof

Das hier ist leider alles noch etwas oberflächlich und ich würde gerne in Zukunft noch näher auf die einzelnen Punkte eingehen, allerdings wirds langsam spät. Deswegen möchte ich langsam zum Abschluss dieses Artikels kommen.

Das Produkt

Die zwei Themen, an denen ich meine Idee und alle Entscheidungen festgemacht habe sind:

• Asteroiden
• Gravitation

Der Spieler ist ein Asteroid unter mehreren auf einem vom Canvas begrenzten Spielfeld. Ziel ist es, zu wachsen.

Das kann man, indem man kleinere Asteroiden berührt. Damit geht ein Teil der Masse des anderen Asteroiden auf einen selbst über. Trifft

man auf einen grösseren Asteroiden, wird man von ihm verschlungen und das Spiel ist fürs erste aus. Das gleiche gilt, wenn man das Spielfeld verlässt.

Es gibt von Spielern gelenkte und vom Spiel kontrollierte, ungelenkte Asteroiden (Opfer ).

Alle Asteroiden ziehen sich gegenseitig an, sodass auch ungelenkte Asteroiden zu etwas grossen werden können.

Mass des Erfolgs ist eine Punkteskala. Punkte erreicht man, indem man überlebt (momentan alle 3 Sekunden 25 Punkte) und indem man seine Masse erhöht (Eine Masseeinheit sind 2 Pixel breite des Asteroiden).

Der Spieler muss eine Balance finden zwischen: nicht geschluckt zu werden ( grösser als andere zu sein) und nicht zu schnell zu wachsen (weniger Punkte über die Zeit).

Der Spielerasteroid kann über ein Gummiband gesteuert werden. Der Spieler-asteroid ist bestrebt, immer auf den Mauscursor der Spielers zuzufliegen. Allerdings besitzt der Asteroid auch Trägheit, was bedeutet, dass Kursänderungen länger dauern können, je drastischer sie sind und je schneller der Asteroid bereits in eine Richtung fliegt.

So, das wars jetzt aber erstmal,
hier darf ich jetzt endlich mein neuestes Baby vorstellen! Der Arbeitstitel dieses Projektes lautet:

Wenn ich gross bin, werd’ ich Planet!

(Eine Multiplayerreise durch einen Canvashimmel, der von Node.js berechnet wird.)

• Wenn ich gross bin, werd ich Planet! Version 0.2
• Wenn ich gross bin, werd ich Planet! Version 0.1

Version 0.1 ist innerhalb von knapp 6 Stunden entstanden. Version 0.2 hat inklusive der Pixelgrafik nochmal 4 Stunden gebraucht

Ich würd mich natürlich über jeden Kommentar freuen. Ausserdem bin ich fest entschlossen, dieses Projekt bis zu seinem Ende zu verfolgen, also einfach immer mal wieder Vorbeischauen!

Viel Spass beim Ausprobieren!

Was fürn Teil?

Aber … aber … ich hab doch gar keinen Fernseher (und ergo auch nie einen Anschluss angemeldet?).

Meine erste Reaktion war ein herzliches Lachen.

Meine zweite: Die Schweine! Wieso sperren die an einem Freitag meinen Anschluss? Hätte ich jetzt bis Montag warten müssen, wenn ich denn warten gemusst haben hätte?

Moment, da steht eine Handynummer auf dem Zettel, also dritte Reaktion: Nummer anrufen und Typ am anderen Ende auslachen. Reaktion Nummer 4: Enttäuscht bin. Keiner rangegangen.

Naja ok, ich habs probiert. Sollen die sich halt jetzt melden.

Ich hab keinen Vertrag unterschrieben und ich habe noch nie von obligatorischen Verträgen in dem Bereich gehört …?

Bin gespannt, was als nächstes passiert … vielleicht kommt in den nächsten drei Monaten einer vorbei und gräbt das Kabel aus oder so …

Das erste was uns dazu einfällt ist: K(eep) I(t) S(imple), S(tupid).
Oh ja, ein Prinzip für alle Zeiten.

Aber halt! Trotz allem Internets, wir sprechen hier doch Deutsch und wie klingt das denn, wenn man einem gestandenen Programmierer so’n kuschelblümchenweiches kiss an den Kopf wirft? Oh ja, ziemlich Sch**sse!

Wir brauchen also ein knalliges Gegenstück.
Und, man höre und staune, die Antwort ist gar nicht fern!

Nach mehrminütlicher Entwicklung präsentieren wir:

METT
M(achet) E(infach), (Tro)TT(el)

Man muss das nur einmal in den Mund nehmen und da sanft zergehen lassen. Formschön und kraftvoll. Und mit eingebauter Ironie-Parodie. Perfekt für den täglichen Einsatz. Und Produktlebenslauftechnisch betrachtet macht man bei Anwendung erst einmal jedem klar, was für ein verdammt cooler early adaptor man ist.

Also nochmal zum zergehen lassen:

METT!

Einfach schön. Also schnell zugreifen und benutzen.
Der Einsatz ist vollkommen kostenlos und frei!

Der Maik hat neulich festgestellt, dass es jetzt keinen Nachteil mehr gibt, WENN Filezilla zwischendurch mal dichtmacht. Dann ist es natürlich vollkommen ok und meine nervender Ping belastet nicht zusätzlich die Leitung.

Ich lasse den Download noch ein bischen hier, aber ich werde keinen neuen Patches mehr bauen.

filezilla_330_rc_1-svn_with_nagging_keepalive_setup

Was das ganze soll, steht immer noch hier: Filezilla mit schnellem keepalive ping

Also schnell die gepatchte Version vom aktuellen FileZilla 3.3.0 beta 2 hier: filezilla_330_beta_2_svn_with_nagging_keepalive_setup runterladen!

Was das ganze soll, steht immer noch hier: Filezilla mit schnellem keepalive ping

Ich bin im übrigen ein bischen stolz auf die Wortneuschöpfung schreiber-Eigenbau, aber ich hab die Warnung mit dem Deutsch ja extra oben in den Kopf geschrieben!

Wie bin ich nun bei RE5 gelandet? Es hat einen Online-Coop-Modus. Ich musste mich also nicht alleine durch die Story schlagen sondern konnte einen Freund damit quälen. Als Import aus UK war es dann auch finanzierbar. Gespannt war ich nun schon. Es sollte ja möglich sein die Story mit einem Freund im Coop zu spielen. Nicht einzelne Karten sondern die ganze Story. Darauf wurde ja auch in der Werbephase viel wert gelegt.

Der Start klappt problemlos. Schnell findet man sich damit ab nur über einen Laserpointer zu verfügen so das Zielen so etwas fummelig sein kann. Aber geteiltes Leid ist ja halbes Leid. Also:

Waffe raus; Zielen; Keine Monster; Waffe rein; Laufen; Waffe raus; Keine Monster; Tür; Waffe rein; zur Tür laufen; Tür auf; Filmsequenz; Tür zu; Viele Monster; Waffe raus; Zielen; Schießen; Daneben; Besser zielen; Schießen; Monster durch die Decke; Monster am Hals, Hunde am Hals; Neustart auf “Supereinfachfürnoobs“.

Danach geht das Spiel recht gut. Die Kletter-, Kampf- und Rätsel-Abschnitte sind gut verteilt, es kommt so gut wie nie Langeweile auf. Das erste drittel geht flott von der Hand (Nach dem ich verstanden hatte das im ersten Level unendliche Viele Gegner spawnen und man einfach eine gewisse Zeit überleben muss). Gut das hat uns erstmal 5-10 Leben gekostet. Aber ne gute Sache dem Spieler so etwas am Anfang vor zusetzten ?-) . Wer das übersteht, übersteht vielleicht auch das Ende, (aber dazu später mehr).

Dann der erste wirkliche Frust: QTE. Lustiges Button drücken in einer Filmsequenz. Damit kann ich mich gar nicht anfreunden. Ab hier (Wir sind natürlich erst mal überrascht gestorben. Keiner hatte verstanden warum. Bis uns dann beim zweiten Mal aufgefallen ist, dass wir vielleicht den Button drücken sollten der angezeigt wurde). Ich bin ja der Meinung in einer Filmsquenz sollte eine Belohnung für den Spieler sein. Er darf sich was Schönes anschauen und es wird ihm die Geschichte erzählt. Kurz zurück lehnen, etwas trinken und Energie schöpfen für das nächste Level. Nach dieser Filmsequenz war für mich das entspannen gelaufen, man wusste ja nie wann es wieder Button zu drücken galt.

Nach der lustigen Filmsequenz (die wir bis zum Erfolgreichen beenden Gefühlte 281 mal angeschaut hatten, aber bekommt man dann auch den Inhalt der Sequenz mit) ging es dann mit einer Rail-Shooter-Sequenz weiter. Auf einem Jeep galt es nun Molotovcocktailswerfendebikerzombies abzu… äh auszuschalten. Danach ein Paar LKWs und im richtigen Moment wieder die richtigen Buttons drücken sonst fällt der eigene Jeep um(???).

Als nächstes folgte dann eine Level in einem Sumpf mit Bootfahren und Schlüssel einsammeln. Ein paar Zombies (Ja, ich bin mir bewusst das es wohl technisch Gesehen keine wirklichen Zombies sind, aber es klingt so schön trashig) mit Kettensägen, die mir auch gleich erstmal den Kopf abha… äh entfernen. Dann duch eine alte Mayawasauchimmerstadt mit ein paar Schalter, Weg und Schlüsselrätseln. Nix wildes für unser eingefleischtes Team

Nach dem historischen Teil gelangen wir zu seiner Brutkammer von wo wir dann zu einem Schiff kommen. Bis hierhin war’s eigentlich ein einfaches aber nettes Spiel. Wir hatten Spaß, es war nicht zuuuu frustrierend und wir mussten so gut wie gar nicht in eine Lösung schauen. Ich würde über den Daumen sagen wir haben bis zum vorletzten Kapitel vielleicht 6-7h gebraucht. Für die letzte Hälfte des letzten Kapitels haben wir dann nochmal 4h gebraucht. Ohne Komplettlösung unmöglich. Zumindest für mich. Bei der Story habe ich mich schon längst ausgeklinkt. Immer mehr Monster die noch Größer sind und gar nicht to… äh, auszuschalten sind. LAAANNNGGGWEEEEIIILLLIIIGGGGG. Dann das Ende: Liebe Spieledesigner, es macht nicht wirklich Spaß von jemanden davon zulaufen bis er seinen wunden Punkt offenbart, dann zu feuern und zu sterben weil man den Gegner zu nah ist. Also wir sind oft gestorben. Sicher man könnte sagen wir sind zu doof gewesen, und ich kann da nicht viel erwieder, vielleicht war’n wir echt zu doof. Aber Gegner die man nur nach einem bestimmten Muster erledigen kann hatte ich schon lange nicht mehr in einem Spiel, ich war sicher dieses Zeit sei vorbei. Aber ganz und gar nicht. Ich hatte mich da getäuscht und im nach hinein ist das ja auch die einzigste Möglichkeit dieses Gegner von der Masse des Fußvolks abzuheben.  Dann hatten wir es beendet, ein paar mal abschließend noch über die Story gelästert, das Inventory und habe beschlossen es nicht auf normal nochmals zu versuchen.

Das Ganze ist ordentlich Verpackt und 1000 mal in Plastiktütchen und Tesafilm eingewickelt. Die Installationsanleitung der Hardware beschränkt sich auf ein kleines Bildchen. Ich habe mir nicht die Mühe gemacht das verstehen zu wollen und habe einfach alles zusammengebastelt wie es passte. Auspacken 10min. – Zusammenstecken 2 min. Alles in allem recht Einfach. Ein druck auf den Powerbutton und es wird Licht. Und was für eines. Bunt und Laut. Es gibt zwar ein Lautstärkenregler aber dieser ist so was von unsensibel: Von Laut nach Leise benötigt man ca. 15 Umdrehungen. Aber man gewöhnt sich auch daran.

So, alles installiert – nach dem ich mir die neuste Software (70mb) geladen hatte und die beigelegte CD (mit der Aufschrift: “Halt!! Aufpassen!! Diese CD beinhaltet einen Firmware-Update das installierte werden muss vor Gebrauch von dieses Produkt. Dieses Update ersetzt alle anderen Firmware beziehungsweise Installtion CDs fuer dieses Produkt”) ignoriert habe – stellte sich die Frage: Was nun? Diese Ventilatoren und der Rumbelpack für die Tastatur interessierten mich er weniger also versuchte ich gleich einmal den VLC mit Musik und Video. Welches gleich auf Anhieb funktioniert. Die Bildausgabe von VLC muss nur auf Dx oder OpenGL umgestellt werden. Ambilight für den PC perfekt und dazu noch Sound in einer überraschend guten Qualität.Fertig…

… fast. Nach etwas Google stellte sich heraus das es doch eine beachtliche Anzahl von Spielen gibt die amBX nativ ansprechen können. COD4 – müsste ich erst installiere. HAWX – müsste ich erst kaufen. Deadspace – habe ich hier. Ist aber zu Spät für heute. Also schaue ich mir noch eine Episode Leverage an und gehe dann schlafen. Haro wird ja am WE das ganze selbst testen müssen!

Nur ein Teilnehmer und ein Koffer sind verloren gegangen.

Der Koffer hat einen kleinen Umweg nach von 2 Tagen über Gran Canaria hinter sich.

Der Teilnehmer hat aufgrund einer liegen gebliebenen S-Bahn noch nicht ganz angekommen … aber er hat einen Flug später gebucht und ist jetzt schon seit 2 Stunden am Flughafen, um seinen Flug diesmal zu bekommen.

Alles wird gut, früher oder später