WiiInformationsdesign |

Jul/10

26

Finales Screencast

No tags

Jul/10

20

Projektbeschreibung

Das Gesture Pong Spiel ist eine Applikation die für den Multitouch Tisch entwickelt wurde.  Es handelt sich um ein Spiel, das zwar auf dem herkömmlichen Pong Spiel aufbaut, damit aber nicht viel gemeinsam hat.

Jeder Spieler hat auf seiner Seite bis zu 3 Paddles, welche er durch Zeichnen von Gesten aktivieren muss. Um die Applikation aufregender zu gestalten, gibt es unterschiedliche Levels. So können sich die Spieler in Level 1 erst mit dem Zeichnen vertraut machen. In diesem Level gibt es pro Spieler nur 2 Paddles und die Gesten die gezeichnet werden müssen sind sehr einfach. Falls der Ball bei einem Spieler ins Out geht, bekommt der Gegenspieler einen Punkt. Der Ball startet dann von neuem in die Richtung des Spielers, welcher den Punkt erzielt hat. Dabei nimmt er immer eine unterschiedliche Y-Position ein, die zufällig bestimmt wird. Haben die Spieler eine gewisse Punktezahl erreicht, oder eine bestimmte Zeit in einem Level gespielt, kommen sie automatisch ins nächste Level.

Im zweiten Level verfügt jeder Spieler über 3 Paddles, welche er aktivieren muss. Da die Spieler schon mit dem Zeichnen  vertraut sind, sind hier die Gesten schon etwas anspruchsvoller. Nach einer gewissen Zeit oder ab einem gewissen Punktestand erreichen die Spieler Level 3.

In Level 3 ist vor allem das Zeichnen der Klammern sehr kompliziert. Auch die anderen Gesten unterscheiden sich durch ihre Komplexität von den Gesten in den vorherigen Levels. Wenn Level 3 zu Ende gespielt wurde, erscheint auf dem Tisch eine Meldung, die angibt welcher der Spieler gewonnen hat. Derjenige Spieler, welcher die meisten Punkte erzielt hat, gewinnt das Spiel.

Das Spiel kann dann von neuem gestartet werden.
Die Applikation ist zur zusätzlichen Auflockerung mit Musik hinterlegt. Die Musik ändert sich mit erreichen eines neuen Levels.

Das Spiel kam bei den Testpersonen  sehr gut an und bereitete ihnen Spaß. Für den Einstieg in das Spiel empfiehlt es sich zuerst mit einem langsameren Ball zu beginnen. Haben die Spieler ein Gefühl für das Zeichen entwickelt, kann man einen Ball verwenden, welcher um einiges schneller ist.

Im folgenden werden die wichtigsten Funktionen kurz erläutert:
Die Applikation wurde ausschließlich mit Actionscript 3 programmiert. Durch einbinden des  $1Recognizer  konnte das Zeichnen der Gesten realisiert werden.
Um ein nächstes Level zu erreichen gibt es eine Timer Funktion. Diese ruft nach Ablauf einer gewissen Zeit eine bestimmte Funktion auf. Um den Ball bei Aufprall auf ein Paddle zurück zu spielen, wurde die hitTestObject Funktion verwendet. Um den Ball in Bewegung zu bringen wird eine onEnterFrame Funktion verwendet.

No tags

Jul/10

20

Abschlussposting

Jetzt am Ende des Semesters können wir sagen dass uns das erstellen unseres Spiels sehr viel Freude bereitet hat. Zeitweise waren wir etwas frustriert, da wir nicht vorwärts gekommen sind. Unsere eigentliche Idee ein Air Hockey Spiel zu entwerfen, welches man mit der Wii über einen Beamer spielen kann hat sich schlussendlich komplett verändert. Wir scheiterten daran, das Spiel über die Wii multitouch fähig zu machen. Leider haben wir dadurch viel Zeit verloren, die wir am Ende gut gebrauchen hätten können. Die Zeit ging hauptsächlich für Recherche drauf, die uns schlussendlich nicht weiter gebracht hat.

Dennoch sind wir sehr froh dass wir unsere Idee auf den Multitouchtisch umsatteln konnten. Um mit Actionsrcipt 3 vertraut zu werden, haben wir uns vorerst viele Tutorials im Internet angesehen. Wir haben auch einige Sachen programmiert, die wir dann in der Endversion unseres Spiels gar nicht benötigt haben. Wie zum Beispiel den Partikel Ball. Auch der Weg über das normale Pong Spiel zum Gesture Pong Spiel war etwas umständlich. Gerade um herauszufinden wie man die Paddles nur auf einer Achse bewegen kann, haben wir sehr viel Zeit gebraucht. Dennoch glauben wir nicht, dass dieser Weg falsch war, da wir so viel von Actionscript 3 kennen lernen konnten.

Beim programmieren des Gesture Pong Games kamen wir dann auch schneller voran, da wir schon etwas mehr mit Actionscript 3 vertraut waren und auch endlich die Klassen und Pakete usw verstanden haben. Dennoch gings oft nicht weiter und wir mussten um Rat fragen.

Schlussendlich ist unser Spiel viel durch neue Ideen ausprobieren und wieder verwerfen entstanden. Das hat unser aber auch weiter gebracht.

Wir waren sehr froh darüber, dass unsere Testpersonen Spaß am ausprobieren des Spiels hatten. So wussten wir dass wir auf den richtigen Weg sind. Gerade als es darum ging, wie man die Gesten am besten gestaltet, haben wir gemerkt wie wichtig Informationsdesign ist. Der erste Weg ist oft nicht der beste und so haben auch unsere Testpersonen nicht verstanden, in welche Richtung sie die Gesten malen müssen. Dieses Problem konnten wir durch eine andere Gestaltung gott sei dank noch vor der Media Night beheben.

Schlussendlich sind wir sehr zufrieden mit dem Spiel, das wir entwickelt haben. Manchmal funktioniert das tracking des Fingers nicht, aber wir glauben dass das nicht an unserem Code liegt.

Uns hat das erstellen des Spiels sehr viel Freude bereitet und wir haben auch echt was dabei gelernt. Wir fühlen uns jetzt schon sehr viel sicherer in As3 als vor ein paar Wochen. Die Veranstaltung Interfacegestaltung war sicher die richtige Wahl für uns.

No tags

Jul/10

6

Medianight

Am Donnerstag war die Medianight und dort haben wir unser finales Gesture Pong vorgestellt. Doch zuvor haben wir am Mittwoch noch letzte Änderungen vorgenommen. Bis zum Mittwoch war ein nächstes Level nur zu erreichen wenn man eine gewisse Punktezahl erreicht hat. Zum Beispiel kam man in Level 2 wenn einer der Gegner 4 Punkte gemacht hat. Waren nun aber beide Spieler so gut, dass niemand mehr einen Punkt machen konnte, kam man auch nicht ins 4. Level. Deshalb haben wir noch einen Timer eingebaut. Dieser Timer startet gleichzeitig mit dem Level. Ist der Timer abgelaufen wird eine Funktion aufgerufen und die Spieler kommen ins nächste Level.

Außerdem wurden die Zeichen noch einmal abgeändert. Zuerst hatten sie am Ende einen kleinen Pfeil, damit man wusste in welche Richtung man das Zeichen malen muss. Leider verstanden unsere Testpersonen die Malrichtung trotzdem nicht und wir mussten uns was neues überlegen. So bekamen die Zeichen am Anfang einen Punkt, der ungefähr so groß wie ein Fingerabdruck ist. Nun ist es für die Spieler leichter verständlich wo sie mit dem Zeichnen beginnen müssen.

Zudem wurde der Ball in Level 3 verlangsamt. Da dort die Zeichen schwieriger sind und somit die Spieler mehr Zeit brauchen um die Zeichen zu malen. Das haben wir mit einer einfachen If-Abfrage umgesetzt.

Um das Spiel etwas aufregender zu gestalten, haben wir noch Sounds hinzugefügt. So wird in jedem Level eine andere Melodie abgespielt. Zudem wird auch ein Sound abgespielt wenn der Ball ins Out geht oder ein Paddle den Ball zurück schlägt.

Bei der Medianight ist unser Spiel recht gut angekommen. Die 15 Minuten, die wir zum Präsentieren hatten vergingen jedes mal ziemlich schnell. Wir glauben dass die Spieler Spass daran hatten das Gesture Pong auszuprobieren.

No tags

Jun/10

26

Gesture Pong

Nun sinds nur noch wenige Tage bis zur Media Night und unser Spiel wird langsam aber sicher fertig. Wir haben uns jetzt doch dafür entschieden nur das Pong Spiel wo man verschiedene Zeichen malen muss, um das Paddle zu aktivieren für die Media Night zu verwenden. Das Pong Spiel wo man dirket die Paddles hin und her schieben muss, erschien uns schlussendlich irgendwie zu langweilig, da das Zeichnen auch einfach mehr Spass bereitet. Dennoch war die Arbeit nicht umsonst, da wir das Spiel als Grundgerüst für unsere Erweiterung verwenden können. Außerdem haben wir beim erstellen viel über AS3 gelernt und verstehen schon so ziemlich alles, was wir programmieren. :D

Dafür sind wir aber gerade dabei für das Gesture Pong 3 unterschiedliche Levels zu erstellen. In Level 1 hat jeder Spieler nur 2 einfache Zeichen, die er malen muss damit er mit dem Spiel vertraut wird. In Level 2 sinds dann schon 3 Zeichen, die auch etwas komplizierter zu zeichnen sind. Level 3 enthält dann die kompliziertesten Zeichen wie zum Beispiel einen Stern.

Wir hoffen den Leuten wird unsere Applikation auf der Media Night Spaß bereiten. Wir freuen uns auf jeden Fall schon darauf!

No tags

Unser Grundgerüst fürs Pong Game ist nun fertig und funktioniert auch auf dem Multitouch. Dieses Game funktioniert wie ein normales Pong Spiel, indem 2 Gegner probieren den Ball an den anderem Paddle vorbei zu schießen. Besondere Schwierigkeiten haben uns dabei die Paddles bereitet. Zuerst haben wir es ewig lang nicht hinbekommen dass sie sich nur auf der Y Achse bewegen. Das machen sie jetzt zwar, aber leider immer mit gefühlten 110 Fehlermeldungen. Diese Fehlermeldungen machen dann unseren Ball langsam. :( Nun sind wir auf der Suche nach einer anderen Lösung.

Außerdem haben wir unser Pong Spiel erweitert. Bei dieser erweiterten Funktion müssen die Spieler bestimmte Zeichen auf den Multitouch malen, um ihre Paddles zu aktivieren und den Ball zurückzuspielen. Wenn das richtige Zeichen gemalt wurde, erscheint das Paddle für eine halbe Sekunde. Das haben wir mit dem TimerEvent umgesetzt. Problem bereitet uns bei dieser Version der Ball. Das Spiel funktioniert zwar, aber irgendwie ist der Multitouch damit ziemlich überfordert. Wir glauben es liegt daran dass bei der Bewegung vom Ball eine EnterFrame Funktion aufgerufen wird und das dass zu viel für den Multitouch ist.

Nun müssen wir die Probleme beheben, wir hoffen wir schaffen das bis zur Media Night. :) Dann wollen wir noch versuchen die einzelnen Versionen zu verknüpfen. So dass das normale Pong Level 1 ist und dass ab einer gewissen Punktezahl Level 2 erreicht wird, in dem man die Paddles zeichnen muss.

No tags

Nach 170 Zeilen Code und gefühlten 10 Stunden Programmieren sieht unser Pong Ball schon toller aus. Außerdem lässt er sich per Touch auf der Bühne positionieren.

Unsere Paddles lassen sich nun auch endlich nur mehr auf der Y-Achse bewegen.

Nun geht es langsam an das Stylen von unserem Spiel. Wie schon beim ball möchten wir gerne etwas mit Particle Programmierung machen.

Hier kann man unser Spiel testen:

Paddles

Gepimpter Ball

No tags

Mai/10

30

Kleine Schritte in AS3

Sich bewegende Bälle auf Mausklick, MovieClips dynamisch instanzieren oder ein einfacher HitTest -in AS3 ist alles anders! Und damit beschäftigen wir uns derzeit, um produktiv damit zu arbeiten. Seltsam ist, dass der HitTest jetzt -trotz gleichem Code- jetzt funktioniert. Wir bauen unser Spiel gerade von Grund auf neu auf und binden erstspäter die MultiTouch Klasse ein. Hoffentlich macht unser Ball dann noch was er soll!

No tags

Mai/10

15

Pong die Zweite

Unser kleines Game hat heute einen Punktezähler bekommen und 2 Tore. Die Tore befinden sich außerhalb der Bühne und werden über HitTest auf einen Treffer überprüft.

Kopfschmerzen bereitet uns noch der Ball, bzw. die Schläger. Wie man sieht fliegt der Ball grundsätzlich nach unten bei einem Schlag. Theoretisch einfach zu lösen (siehe Zeichnung), praktisch etwas komplizierter … Wir bleiben am Ball ;-)

Hier die Paddel Code-Schnippsel, für Tipps sind wir dankbar!:

Paddel zeichnen:
public function Main() {
var playerone = new TouchSprite();
stage.focus = this;
playerone.graphics.beginFill(0xffffff);
playerone.graphics.drawRect(0,0,20,100);
playerone.x = 0;
playerone.y = 140;
playerone.graphics.endFill();
addChild(playerone);

und der Aufprall
if (ball.hitTestObject(playerone)) { //if ball hits player paddle
udist=(playerone.y) - (ball.y + 5);

if (udist!=0) {
ufraction=udist/(playerone.height/2);
yspeed=-((1-Math.abs(ufraction))*fullspeed);
var oldxspeed = xspeed;
xspeed=ufraction*fullspeed;
if (xspeed < oldxspeed) {
xspeed = oldxspeed;
yspeed *= (oldxspeed / xspeed);
}
} else if (udist==0) {
xspeed=-fullspeed;
}
if (xspeed<0) { xspeed=-xspeed; } if (xspeed > maxspeed) {
xspeed = maxspeed;
}
}

paddley

No tags

Apr/10

29

Erstes Scripten

Heute haben wir uns getroffen und versucht im AS 3.0 das einfache Pong spiel zu schreiben. Das dauerte relativ lange, da wir uns beide nicht wirklich mit AS 3.0 auskennen. Wir haben das Spiel gleich so programmiert, dass man es dann auf einem Multitouch spielen kann. Das haben wir immer wieder mit Gesture Works ausprobiert. Nach ca 5 Stunden waren wir so weit, dass wir 2 Schläger auf der Bühne hatten, die man dann mit dem Finger bewegen kann. Zur Zeit noch auf dem ganzen Spielfeld und nicht nur auf der Y-Achse. Außerdem haben wir einen Ball, den man mit den Schlägern beeinflussen kann. Nur reagiert der noch nicht so wie wir wollen und  macht zu schnelle Sprünge.

Wir haben das ganze dann noch auf dem Multitouch ausprobiert, da funktionierte jedoch leider gar nichts mehr. Vielleicht haben wir noch Fehler bei den Einstellungen oder ähnlichem gemacht.

Das nächste mal werden wir unser Spiel optimieren und auf dem Multitouch zum laufen bringen. Anschließend probieren wir dem Spiel unsere eigene Note zu geben.

No tags

Older posts >>

Theme Design by devolux.nh2.me