[Projekt] Devader

[marcgfx]

lohnt sich vermutlich schon alles zu zerstückeln, spart im beispiel etwa 50% ein. ist anhand von diesem bild nicht wirklich zu erkennen, da das resultat auf ein kleineres canvas skaliert wird. aber so siehts aus wenn alles durcheinander ist :)

jetzt treib ichs mit der spielerei auf die spitze... mein spritesheet ist jetzt 2661*4366, ich rendere pro frame ~600 unterschiedliche bilder, das ganze 4 mal mit chrome auf 50% gezoomt damit ich alle 4 sehen kann. framerate noch bei ~60. bin grad ziemlich happy, drum das kleine edit... mit der 3 fachen menge geht die framerate auf etwa 30 runter. testen vorbei, jetzt muss ich mal die engine umstellen :)

[Artificial Mind]

Schon ziemlich cool wie man das ans Limit treiben kann. Ich würde allerdings etwas aufpassen, viele ältere Karten sind bei Texturen größer als 4096 zickig.

[LONy]

Hab mir den gesammten Thread hier gestern mal durchgelesen...sehr interresant was du hier Treibst, ich kann nur sagen: weiter so! :D Irgendwie hab ich es echt geschafft deinen gesammten Thread die letzten 2 Jahre zu ignorieren ;)
Ich bin selbst fleißig am HTML5 games schreiben, wenns meine Freizeit zu lässt. Zur zeit experimentiere ich mit node.js und socket.io usw. Vor gut einem Jahr, als ich damit angefangen habe, war das noch sehr depremierend. Inzwischen ist node.js (für Windows) aber schon gut ausgereift und man kommt ohne frickelein zu einem node server :)
Falls du dich für Websockets in hinblick auf Mulitplayer interresierst, gibt es hier eigentlich einen sehr guten kurzen einsteig. Finde den ganzen Blog sehr interresant und lesenswert: http://www.interaktionsdesigner.de/2013 ... angularjs/
Ich programmiere meine... "Techdemos"... alle mit dem Canvas element in 2D. An WebGL hab ich mich noch nicht rangewagt und da alles nur so halbfertig ist, hab ich auch schon lange nichts mehr veröffentlicht. Irgendwo im Forum hier geistert noch ein alter Thread von mir rum ;)
Momentan überlege ich, ob ich meine GUI mit klassischen HTML elementen über dem Canvas aufbaue, vielleicht sogar mit hilfe von AngularJS, oder ob ich die ganzi GUI selbst im Canvas Element zeichne.
Berichte auf jedenfall weiter von deinen Erfolgen, es ist sehr interresant :) Vielleicht starte ich mal einen neuen Thread, wenn ich jetzt zur dunklen Jahreszeit etwas schneller voran komme und es was sehenswertes gibt^^

[marcgfx]

erste stufe der integration ist mal abgeschlossen, es zeigt mir schon mal was an und es passt sich auf den viewport an (so halbwegs). im bild wird auf alle bilder der grau-filter angewendet. noch ziemlich unschön das ganze, verschiebt sich u.a. leicht zum hintergrund/schwammig und es bleiben graphiken "hängen", die autos sind z.b. alle doppelt drauf. grad keine lust mehr rauszufinden wieso. heute war eh ein ultra-mühsam-frust-tag. hatte die dumme idee mein sprite-sheet noch so optimieren, dass entstehende löcher gefüllt werden. hätte ich bloss nicht damit angefangen. ein spezialfall nach dem anderen, ein fehler nach dem anderen, zum durchdrehen. alles nur um von 15% zu viel white space auf 10% runterzukommen und das auch noch fehlerhaft. habs mal auf die seite gelegt für selbst-geisselungen.

@LONy: danke für den netten kommentar ;) websockets ist auf der irgendwann todo liste, glaub das könnte nicht so einfach sein mit der synchronisation... werde mir den blog auf alle fälle ankucken.

[marcgfx]

vor etwa zwei stunden wollte ich mal wieder in GRAFIKPROGRAMMIERUNG einen neuen thread eröffnen. grundsätzlich lief alles, aber es hat immer wieder stark geruckelt und der arbeitsspeicher wurde massiv belastet. das ruckeln kam vermutlich vom garbage collector und die ursache hatte ich auch schon gefunden. nur wusste ich nicht wie ich es lösen sollte. der code der problematisch war, kam aus zusammenkopierten elementen aus verschiedenen anleitungen/foren und ich ging einfach davon aus, dass man es wohl so machen muss.

Code: Alles auswählen

gl.bindBuffer(gl.ARRAY_BUFFER, buf);        
            gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(arr), bmode);                
            gl.vertexAttribPointer(loc, count, gl.FLOAT, false, 0, 0);

dieser code wurde in jedem renderdurchgang für jedes attribut im vertexshader ausgelöst, arr hatte in meinem testfall eine länge von 6000-12000. immer wieder ein array erstellen, das kann nicht gut sein. als ich mein problem anfing zu beschreiben, kam mir der unspektakuläre gedanke: wieso nicht direkt alles in den float32array schreiben? als ich es dann versucht habe, war mir klar wieso in den einfachsten beispielen nicht so gearbeitet wird. der Float32Array lässt sich nach dem erstellen nicht mehr in der grösse verändern (aber keine angst, es gibt keinen fehler wenn man ausserhalb was schreiben möchte, grrr.....). naja. die lösung war jedenfalls einfach, als ich alle fallstricke dieses schönen arrays gefunden hatte. fixe grösse die sicher ausreicht vordefinieren und basta. danach hatte ich nur noch probleme mit optimierungen/anpassungen von meiner htmlengine zu webglengine. jetzt läufts mit 4 screens und allen visuellen elementen konstant auf 25fps (mein selbst eingestelltes limit). jetzt hoffe ich, dass es dann mit ki und spielern auch wirklich sauber läuft, bin zumindest guter dinge. optimieren kann ich bestimmt noch weiterhin, unter anderem habe ich die arrays definitiv zu gross gewählt.

unschön ist ein problem mit premultiplied alpha, canvas scheint das zuverlässig zu verwenden, auch wenn ich ganz brav parameter setze, die das gegenteil erzielen sollen. naja. ebenso hab ich noch ein paar probleme mit leichten verschiebern zwischen meinen mit webgl gerenderten elementen und dem mit html gerenderten untergrund. kann ich aber vermutlich mit requestanimationframe auch noch bezwingen.

weil ich mich so freue ein langweiliges bild mit webgl gerendert :)

[marcgfx]

edit: hat doch geklappt :), trotzdem wäre es vielleicht spannend auf webgl umzustellen, nur nicht jetzt[/b]

das schwammige bekomme ich leider nicht weg, webgl vordergrund und der html untergrund sind immer wieder leicht versetzt. evtl. ist es nur eine rundungsgeschichte, aber ich komme nicht dahinter... ich glaube mir bleibt nichts anderes übrig als das ganze SVG zeug auch noch nach webGLzu portieren. vielleicht gar nicht so schlimm, hilft sicher auch wieder der performance.

folgende annahmen:
- ich werde mit webGL nicht so schöne glatte kanten erzielen, ausser ich verwende sehr viele polygone
- ich kann die strasse interessanter texturieren, noise-funktionen lassen sich bestimmt einfach in einem fragment-shader implementieren
- ich sollte triangle-strips einsetzen, da die strecke ein zusammenhängendes mesh ist
- die mittellinie und die streckenbegrenzung kann ich vermutlich ebenfalls im fragment-shader realisieren
- der start-text müsste als textur existieren

[marcgfx]

damit ich alle unklarheiten beseitige, sofern es jemanden auch interessiert ;) :
das problem wieso ich zwischen untergrund (html) und objekten eine positions-abweichung hatte lag daran, dass zu unterschiedlichen zeiten gerendert wurde. requestanimationframe hat da auch nicht geholfen, hatte ich aber erwartet. aufgrund dieser vermutung, schloss ich dass es eine abweichung sei zwischen webgl ausgabe und html, war es aber nicht. der hintergrund wird über einen div container in der position verschoben, wenn ich sobald ich den verschiebe einen render-call bei webgl mache, dann stimmt auch die darstellung wieder. was ich jetzt machen musste, war die zeichenaufrufe zu buffern, damit ich sowohl zu meiner fixen frame-rate-zeit rendern kann, aber auch wenn sich die ansicht verändert.

[marcgfx]

bin mal wieder an der KI geschichte dran. um den fortschritt zu verbessern, habe ich mir einige neue sachen ausgedacht, die aber durchaus kontraproduktiv sein könnten.
- die mutationsrate ist selbst ein parameter, der pro gruppe angewendet wird (eine gruppe ist ein zusammengehörender logischer knoten in meinem neuronalen netz)
- ganze gruppen können auf einen schlag mit einem faktor mutieren, mit einer ebenfalls mutierbaren warscheinlichkeit
- mutationen auf einem "gen" werden gespeichert und können in der nächsten generation mit grösserer warscheinlichkeit auf die selbe art mutieren
- ich verwende elitismus, um zu verhindern das meine besten ergebnisse verloren gehen.

die aktuelle tendenz ist das die faktor-mutation und die allgemeine mutationsrate sinkt. laut gewissen papers ist eine mutationsrate von 1/N (wobei N die anzahl parameter ist) am erfolgreichsten. da ich aber so viele parameter habe, möchte ich möglichst viele veränderungen haben und die positiven verstärken. sehr schwer festzustellen und auch nicht debug-bar. bislang hat sich noch kein bot längere zeiten bewähren können, was mir allerdings naheliegt dass sich weiterhin verbesserungen abspielen.

leider sind die neuentwickelten bots bislang noch deutlich schlechter als eine viel ältere generation. ich verwende weiterhin einen genetischen algorithmus gepaart mit einem neuronalen netz. evtl. hab ich eine art reizüberflutung erzeugt, es gibt zu viele möglichkeiten sich zu entwickeln. womöglich stecke ich in einem lokalen maximum fest, aus dem ich nur schwer wieder rauskomme. eine weitere möglichkeit, ist dass ich einfach nicht genug generationen erzeugen kann, es dauert die berechnung einer generation einfach viel zu lange. ich habe inzwischen pro rennen auf maximal 1000 in-game schritte reduziert, das sind umgerechnet 40 sekunden. berechnet wird noch um einiges schneller, aber 15 sekunden dürften es dennoch sein. parameter gibt es auch schon ~500 die das verhalten beeinflussen. ich lass meinen computer jedenfalls noch heiss-laufen und hoffe es gibt noch was gescheides. ansonsten habe ich mit der alten generation eine brauchbare ki für den hard-modus und mit der neuen kann ich normal abdecken. grundsätzlich würde ich aber gerne die neue generation die alte besiegen sehen, da sie deutlich ausgeklügelter ist.

vermutlich wäre es aber grundsätzlich einfacher die ki selbst klug zu designen und zu verbessern. danach könnte ich immer noch gewisse parameter über einen genetischen algorithmus optimieren. spannender ist es aber eindeutig auf diese art, da ich nicht weiss was passieren wird.

[marcgfx]

heute gings den extras mal an den kragen. die wichtigstens sachen laufen jetzt, es gibt aber noch einiges aus graphischer sicht zu erledigen. beim aufheben von extras kann ein sound/effect ausgelöst werden, beim auslösen ebenfalls. aktuell sind bereits schuss-extras + status-veränderungen möglich, wobei letzteres z.b. für das verlangsamen aller gegner, den eigenen turbo-boost, für unsichtbarkeit, massenzuwachs etc genutzt werden kann. die werkzeuge sind alle da, jetzt muss ich die extras noch feintunen. bei den waffen muss ich mir aber wohl noch code für homing-missiles oder sonst was spannendes schreiben, das treffen der gegner ist gar nicht so leicht.

[marcgfx]

das sind die extras die ich inzwischen implementiert habe:

3 Waffentypen: Mine (fix platziert, da kann man auch selber reinfahren), Missile (minimal zielsuchend), Homing (stark zielsuchend)
Boost: kurzfristiger schub
SpeedUp: 5% beschleunigung und max-speed bonus
Snaildown: verlangsamt alle gegner für ein paar sekunden
Invisible: kann nicht getroffen werden, bäume und gegner sind kein hinderniss. extras und beschleunigungspfeile können nicht genutzt werden
MassGain: für 20 sekunden ist man 3 mal so schwer, was bei kollisionen von vorteil ist
Timeout: für alle gegner wird die zeit für 2 sekunden angehalten
Invincible: unzerstörbar, etwas schwerer und schadet dem gegner auch bei leichten kollisionen für ein paar sekunden

was noch fehlt sind die icons, aus irgend einem grund tue ich mich schwer den richtigen style dafür zu finden. aktuell weiss man gar nicht was man aufgesammelt hat.
interessant ist aber, dass ich mit den extras meistens schlechter gegen die ki abschneide, da ich abgelenkt bin.

zeigen kann ich eigentlich kaum was, da es nur in bewegung spannend ist. langsam wär wirklich zeit für ne neue demo version ;)

[marcgfx]

extras131109.jpg (29.8 KiB) 5926 mal betrachtet

die extra-icons sind mal in einer ersten fassung fertig. ist schon auffällig wie ungeduldig ich inzwischen bei graphischen elementen bin. wenn ich länger als ne halbe stunde habe, wird mir schon unwohl. dementsprechend detail-arm kommt es halt daher. solange die bilder nicht grösser sein müssen gehts aber grad noch... die uhr konnte ich von turbosquid runterladen, hab nur ein paar kleinigkeiten angepasst.

das stanford bunny habe ich ebenfalls für ein icon geklaut, habs aber vergessen in die sammlung einzufügen.

speedup.png (9.3 KiB) 5926 mal betrachtet

wer interesse hat, kann versuchen die icons mit der auflistung aus meinem letzten post zu mappen :)

[marcgfx]

versuche mal einen kleinen release zu machen, ist ja schon sehr lange her dass ich was gezeigt habe. um die daten vorzubereiten und hochzuladen habe ich damals verschiedene scripte geschrieben. u.a. wird jedes png mit pngcrush nochmal reduziert und auf amazon s3 hochgeladen. daran arbeitet mein computer schon seit 2h... ist anscheinend nicht so ein schneller prozess. es wird auch noch ein paar andere blockaden geben. die php files werden alle in statische html files convertiert, in der online version werden alle daten aus referenzierten dateien geladen, php scripte werden nicht benutzt. der start-bildschirm wurde aber noch nicht auf diese möglichkeit angepasst, es wird also mit sicherheit noch nicht laufen. bestenfalls kann eine testversion ohne startscreen präsentieren, KI wird auch noch nicht klappen.

[LONy]

juhu, ich freu mich schon drauf wenn ich mal das ganze in aktion sehen kann :)

[marcgfx]

eigentlich wollte ich mal was zeigen, aber ich nage noch an gewissen punkten. ich will den source noch verkleinern mit google closure. leider läuft danach nicht mehr alles gleich. im minifizierten code debuggen ist auch alles andere als effizient. theoretisch gibts noch so coole source-maps, leider läuft das bei mir jetzt aber nicht. keine ahnung wieso. hab jetzt schon etwa 3 tage lang code angepasst, keine lustige arbeit. leicht frustriert aber ich werd nicht aufgeben. immerhin wird inzwischen wieder das meiste gerendert (wenn auch noch nicht alles korrekt).

[TheBenji]

das sieht doch schon ziemlich beeindruckend aus. Hoffe auch einfach mal das du schnell was online stellst ;)

[marcgfx]

danke für die motivierenden worte ;)
ganzen tag am pc, dabei hätt ich auch noch einiges sonst zu tun... naja. ich habe mich entschlossen was völlig unfertiges hochzuladen.
start screen läuft halbwegs, spielen klappt überhaupt noch nicht. aber man kann mit der maus die landschaft erkunden.
http://data.cyberlympics.com/html/start.html

edit: es wird dann sicher wieder updates auf dieser url geben, evtl. funktioniert auch mal noch weniger ;)

[marcgfx]

131203hue.jpg (39.1 KiB) 5695 mal betrachtet

jetzt läuft schon einiges. ich hab mich die letzten paar wochen ziemlich schwer getan. die geschichte mit dem umwandeln des codes für closure hat mir den nerv und spass geraubt und es gab immer mehr schwierigkeiten. einiges lief bereits, aber ich hatte plötzlich massive memory leaks, die zu finden im minifizierten code ist gar nicht spassig. ich habe also nach langem überlegen die gesamte arbeit in die tonne geschmissen und bin 2 wochen in die vergangenheit gereist. einige bugs musste ich wieder finden und lösen, aber ich habe auch einige kleine weiterentwicklungen gemacht. gegner einheiten basieren jetzt alle auf dem gleichen bild, die farbveränderung wird lediglich mit einer hue verschiebung im shader gelöst.

gegner sind noch inaktiv, aber denke das könnte ich irgendwann die woche noch einbauen.

evtl. brauchts ein refresh:
http://data.cyberlympics.com/html/start.html

[marcgfx]

das war mal wieder ne üble lüge. ende der woche... gute 7 monate später gibt es immer noch nichts. ich habe es lange liegen lassen, war aber in letzter zeit doch auch wieder aktiv. eine grosse aufgabe war es ein neues spiel starten zu können, ohne ein refresh auslösen zu müssen. da ich leider nicht von anfang an daran gedacht habe, gabs ziemlich viel zu tun. jetzt ist es aber möglich eine sequenz von rennen hintereinander zu spielen, allerdings muss ich jetzt noch die entsprechenden zwischenscreens einbauen (resultate der bisherigen rennen/ranking).

ich schreibe aber jetzt aus einem anderen grund mal wieder was. ich störe mich etwas daran, dass ich bäume nicht zerstören kann. dies aus dem einfachen grund, weil ich nicht weiss wie es optisch umzusetzen wäre. wie zerstöre ich einen 2d baum, optimalerweise mit einem shader ohne dass es schrecklich ausschaut. umsetzbar wäre bei einem crash vermutlich eine art wackel-effect (dann würde man zumindest sehen welcher baum getroffen wurde). aber den baum komplett zerstören, dafür fällt mir aktuell einfach nichts ein. jeden baumtod zu animieren ist für mich nicht machbar und ich würde vermutlich schon beim versuch einen hinzubekommen scheitern. ich könnte mir eine art, auflösen mit staubwolke vorstellen. wobei optimalerweise diese wolke farblich mit dem baum was gemeinsam hat. ideen?

[marcgfx]

hab heute mal wieder ziemlich viele stunden verbraten. natürlich wieder mal nicht mit dem was am sinnvollsten ist, aber mit dem was mich eben grad beschäftigt hat. ich habe mir jetzt einen 2d-baum zerstörungs-shader geschrieben, die mathe wäre zwar nicht schwer aber mit dem shader-denken habe ichs nun wirklich gar nicht. ziemlich viel trial und error, viele zeichnungen, aber schlussendlich hats funktioniert wie ich es mir vorgestellt habe, flachdrücken mit etwas streuung. hab dann auch mal ein video aufgenommen, aber der schrott ist 47mb gross für ein paar sekunden. drum nur ein bild. damit man es sich besser vorstellen kann, sind auch die fahrzeuge im gleichen zerstörungszustand.

[Schrompf]

Leider ist auch das Bild winzig. Ich finde die Idee nämlich eigentlich ziemlich cool, einen Baum per Shader plattzumachen.

[marcgfx]

ist halt original-grösse ;)
habs noch versucht auf youtube hochzuladen, aber die qualität danach war sowas von schlecht.

[Spiele Programmierer]

In einem solchen Fall ist eine Methode das Video vorher in einem Videoprogramm deiner Wahl soweit zu vergrößern, dass Youtube nicht mehr ganz so viel zerstört. In deinem Fall Breite und Höhe jeweils vervierfachen oder so...
Oder anderen Videohoster verwenden...

[Aramis]

GIF US A GIF!

[marcgfx]

qualität ist echt nicht der burner... aber man kann etwas mehr erkennen. sind ~4mb...
https://dl.dropboxusercontent.com/u/114 ... trees2.gif

[Aramis]

Ich finde, es sieht aeusserst cool aus. Ausserdem hast du scheinbar einen Algorithmus mit hoher Entropie produziert :-)

[Krishty]

Allerdings. Respekt!

[marcgfx]

danke jungs, bin eigentlich auch super happy. habe mich ewig lange genervt, weil ich nicht wusste wie ich bloss die bäume kaputt machen kann, ohne dass die optik brutal leidet. die hohe entropie ist nicht mein verdienst, ich habe eine random funktion für shader per google gefunden und dann lediglich benutzt.

[marcgfx]

bin wieder fleissig am werkeln.
- habe heute das erste mal mit gegnern getestet die extras ebenfalls einsetzen (allerdings nur zufällig), die extras schon etwas überarbeitet, einige waren viel zu stark und viele haben ein rennen nicht überlebt
- fehler in der engine entdeckt, performance verbessert (ich bin mir sicher da ist noch einiges mehr rauszuholen)
- fullscreen modus ist jetzt per taste möglich, screen-inhalt passt sich der fenstergrösse an
- ich hab schon vor ein paar tagen einen hue-wert einbaut, der bei diversen objekten leichte abweichungen der farben verursacht. so sehen wälder nicht mehr so eintönig aus. dies wird jetzt auch in der minimap sichtbar

[marcgfx]

heute mittag war die performance ziemlich mies. grund: ich habe den hue des hintergrundbild mit einem css-filter angepasst, das scheint nicht so performant zu sein. damit dieses (nutzlose?) feature erhalten wird, muss ich das bild pixelweise konvertieren. dafür benötige ich eine umwandlung von rgb in hsv und wieder zurück. leider kam das bild aber schwammig raus, ich weiss bis jetzt nicht wieso. ich nehme an, dass die konvertierung einen fehler produziert, aber ohne fehlermeldung ist sowas kaum zu finden. beim überprüfen ist mir aufgefallen, das der code sowieso nicht sauber hin und zurück konvertiert.

dank google im netz eine alternative gefunden und das problem lösen können. performance ist auch wieder i.O.

rosa schnee, ein traum.

[marcgfx]

heute wieder mal nur zeit verschwendet. der stereo sound stimmt nicht. irgendwie kommt nur aus der zentralen box oder links sound. hab dann bemerkt, dass die rechte funktioniert aber sehr leise ist. alle settings beim pc durcstöbert, nix gefunden. schlussendlich musste ich die treiber neu installieren (nach der installation: installation failed, could not find asus xonar audio device) hats aber geklappt... aber mein sound war dennoch nicht stereo
ursache: ich habe vor einiger zeit von mp3 auf ogg umgstellt. für sound wiedergabe verwende ich den soundmanager2 (super teil), für ogg ausgabe wird "html5" verwendet, für mp3 flash. sound soll abhängig von wo er kommt, links oder rechts stärker aus der box kommen, das funktioniert jetzt aber nicht mehr. der html5 standard hat anscheinend keine spezifikation für "pan", also die aufteilung links/rechts. mit flash würds gehen, allerdings muss ich dann wieder auf mp3 gehen. wenn ich was mit mp3 veröffentliche, kann es gut sein dass lizenzgebühren fällig werden (ich habe vor einiger zeit per email angefragt) und das wäre teuer. so wie es ausschaut muss ich den schönen stereo-output in die tonne schmeissen.