IFD:WebApps/ProjekteWS10/Woliegtwas

Inhalt

Im Projekt überarbeite ich eine bereits von mir in der näheren Vergangenheit erstellte Webanwendung.

Das Ziel ist es in einer vorgegebenen Zeit möglichst treffsicher nach 10 gefragten Städten zu suchen und diese dann zu markieren. Es werden sowohl nach deutschen Städten als auch nach internationalen Städten gefragt. Dies kann beim Spielstart festgelegt werden.

Für deutsche Städte gibt es ausserdem schwerere Aufgaben, bei dem der Spieler nicht nur nach Städtenamen gefragt wird, sondern durch Wissen die gefragten Orte finden muss. [Eine Implementierung für andere internationale Städte ist geplant.]

Für das Finden hat man allerdings nur eine bestimmte Zeit. Je länger man braucht, desto weniger Punkte erhält man. Ausserdem erhält man eine imaginäre Schulnote - je näher man dran ist, desto besser -- unabhängig von der gebrauchten Zeit.

Am Ende bekommt man eine Auswertung, bei der Punkte zusammengezählt werden und eine Schulnote berechnet wird. Das Spielergebnis wird in eine Highscore eingetragen, sortiert nach Gesamtpunktzahl.

Daten & Fakten

• 74 deutsche Städte
  • einfache Abfrage nach Städtenamen
  • erschwerte Wissensfrage

• 182 internationale Städte
  • einfache Abfrage nach Städtenamen
  • erschwerte Wissensfrage geplant

• Highscore
  • sortierbar nach Karte und Schwierigkeitsstufe

Was kommt noch?

• Spielernamen wählbar [gekoppelt an Session-IDs]
• neue Städte
• Fragen für internationale Städte
• CSS-Anpassung für M$ Internet Explorer
• eventuell Portierung als native App für Smartphones

Umsetzung

• verkleinerte Karten (7)
• Adobe Photoshop CS5
• phpDesigner 7
• SQL-Datenbank

Sprachen

( HTML, CSS )

• PHP
• Javascript
• AJAX

Prinzip

Die Entfernung wird berechnet durch den Satz des Pythagoras. Nach dem Klicken auf die Karte werden die x- und y-Koordinaten übergeben und somit die Entfernung berechnet.

Die Städte Deutschlands und die der Welt befinden sich in zwei voneinander getrennten Datenbanken. Dies hat sich im Lauf der Arbeit so ergeben. Die Koordinaten der internationalen Städte sind alle einer großen Karte entnommen. Aus dieser Karte werden bestimmte Abschnitte zu kleineren Karten (Afrika, Europa usw.) verwendet. Die Punkte werden von absolut auf relative/proportionale Koordinaten umgerechnet. Somit ist ein einfaches Hinzufügen weiterer Städte möglich.

Design

Das Design ist ursprünglich auf Facebook ausgelegt. Ich habe mich dafür entschieden, da man dort eine Vielzahl an Spielern generieren kann und diese durch Statusmeldungen usw. motivieren kann, sich gegenseitig herauszufordern. Für den Test ausserhalb, habe ich eine separate Version veröffentlicht.

Beim Test auf einem IPad hat das Spiel ganz gut geklappt, da kein Flash oder ähnliches benötigt wird und die Anforderungen ziemlich niedrig sind. Das einzig -für mich- Negative war, dass man den Zoom bei jeder Aufgabe neu einstellen musste. Eine Lösung ist in Planung.

Screenshots

Changelog

20/01/2011

• nach Land und Schwierigkeit sortierbare Highscore
• Advance-Fragen für Deutschland hinzugefügt
• Ajax Ladebalken für bessere Usability

24/01/2011

• Design final

27/01/2011

• Button neugestaltet
• Design vom Spielfenster überarbeitet/angepasst
• Zeitleiste verbessert --> Sekundenanzeige und "Ladebalken" im Fragebereich
• JS überarbeitet --> onclick stoppt nun die Zeitnahme

14/03/2011

• 182 Städte hinzugefügt
• 7 Karten hinzugefügt

17/03/2011

• Design überarbeitet --> nun auf mobile Endgeräte optimiert
• Anleitung hinzugefügt
• Highscore überarbeitet
• viewport Metatag hinzugefügt für optimale Auflösung/Zoom auf mobilen Endgeräten

18/03/2011

• Profile hinzugefügt (an Session-IDs geknüpft)
• Spielbegrenzung auf 5 Spiele