No edit summary |
|||
| (16 intermediate revisions by the same user not shown) | |||
| Line 1: | Line 1: | ||
[[File:cq_favicon.jpg]] | |||
== Inhalt == | == Inhalt == | ||
[[File:woliegtwas1.jpg|right| | [[File:woliegtwas1.jpg|right|200px]] | ||
Im Projekt überarbeite ich eine bereits von mir erstellte Webanwendung. | 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 | 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. | 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. | ||
| Line 18: | Line 18: | ||
** einfache Abfrage nach Städtenamen | ** einfache Abfrage nach Städtenamen | ||
** erschwerte Wissensfrage | ** erschwerte Wissensfrage | ||
*182 internationale Städte | |||
** einfache Abfrage nach Städtenamen | |||
** erschwerte Wissensfrage geplant | |||
* Highscore | * Highscore | ||
** sortierbar nach | ** 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 == | == Umsetzung == | ||
* verkleinerte | * verkleinerte Karten (7) | ||
* Adobe Photoshop CS5 | * Adobe Photoshop CS5 | ||
* phpDesigner 7 | * phpDesigner 7 | ||
| Line 41: | Line 53: | ||
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 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. | |||
[[File:cq6.jpg]] | |||
== Design == | == Design == | ||
Das Design | Das Design war ursprünglich auf Facebook ausgelegt. Ich hatte 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. | |||
=== Screenshots === | === Screenshots === | ||
[[File: | [[File:cq1.jpg|200px]] | ||
[[File: | [[File:cq2.jpg|200px]] | ||
[[File: | [[File:cq7.jpg|200px]] | ||
[[File:cq8.jpg|200px]] | |||
[[File:cq9.jpg|200px]] | |||
[[File:cq3.jpg|200px]] | |||
[[File:cq4.jpg|200px]] | |||
[[File:cq5.jpg|200px]] | |||
== Changelog == | == Changelog == | ||
| Line 61: | Line 80: | ||
* Advance-Fragen für Deutschland hinzugefügt | * Advance-Fragen für Deutschland hinzugefügt | ||
* Ajax Ladebalken für bessere Usability | * 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 | |||
Latest revision as of 02:45, 18 March 2011
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 war ursprünglich auf Facebook ausgelegt. Ich hatte 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.
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