Projecte Qui és qui
Introducció
El joc del Qui és qui?
Farem el joc del qui es qui contra la màquina.
- El servidor triará una carta d'entre un seguit d'opcions i nosaltres l'haurem d'endevinar fent preguntes
- Cada carta tindrà una sèrie de característiques limitades i úniques.
- Les preguntes ens permetrà descartar opcions, per exemple: Porta ulleres? -> si la resposta es SI, descartem totes aquelles cartes que NO porten ulleres
- Guanyes el joc si totes les cartes menys 1 estan descartades i l'única que queda és la carta sel·leccionada pel servidor.
- Perds el joc si l'única carta que queda NO coincideix amb la sel·leccionada pel servidor.
Product Backlog
Configurarem les característiques dels personatges a l'arxiu de configuració config.txtLes característiques són finites i hi haurà una per línia a l'arxiu de conf. Per exemple:- ulleres: si no
- cabell: ros moreno castany
- sexe: dona home
Disposarem d'un segon arxiu de configuració per a les imatges imatges.txt. Aquest etiquetarà les imatges disponibles amb les seves característiques adients. Per exemple:- sofia.jpg : ulleres si , cabell castany , sexe dona
- pablo.jpg : ulleres no , cabell moreno , sexe home
Les característiques (ros, moreno, dona, ... ) i els noms d'arxiu no poden contenir espais (en tot cas, poseu un underscore "_").El servidor ens haurà de donar error de configuració en aquests casos:Una mateixa imatge (nom d'arxiu) apareix dos cops a l'arxiu de configuració.Dues imatges diferents tenen les mateixes característiques.Una característica que apareix al fitxer imatges.txt no apareix al fitxer config.txt (al revés no importa)
El servidor haurà de triar una carta a l'atzar perquè l'endevini l'usuari.El servidor barrejarà totes les cartes i col·locar-les sobre un taulell.Totes les cartes excepte la seleccionada pel servidor han de poder descartar-se (girar-se cap per avall)- Quan es faci clic sobre una carta, aquesta s'haurà de girar amb efecte.
- Un cop descartada un carta NO pot tornar a girar-se
- S'ha de produir algún efecte, quan el ratolí passi per a sobre de una carta (sense clicar).Exemples: Es poden il.luminar, posar-se borroses, etc.
- Crear un combo box per a cada propietat de les cartes (la pregunta ha de ser de SI o NO)
- Crear un botó amb el text: "Fes la pregunta" que en clicar-lo detecti quin combo box té la pregunta a realitzar y consulti en els atributs de la carta seleccionada pel servidor la respota y la imprimeixi per pantalla
- La forma del tauler ha de ser rectangular, en vista vertical.
- Si en clicar el botó "Fes la pregunta" hi ha més d'un combo box "activat" ha de mostrar un missatge de error informant que només es pot realitzar una pregunta cada cop
- En cas de que el botó "Fes la pregunta" generi un error per que hi ha més d'un combo box "activat" a més a més de mostrar el missatge d'error ha de "resetejar" tots el combo box
- Crea un algorisme que controli el final del joc. Quan només quedi una carta s'haurà de girar la carta de seleccionada per l'ordinador, si la carta que queda es la mateixa que la seleccionada per l'ordinador el jugador guanya el joc. En cas contrari el jugador perd el joc.
- Han de sortir focs artifials per tota la pantalla si es guanya el joc.
- La pàgina haurà de adaptarse al tamany de les diferents pantalles de forma automàtica.
- Després de realitzar una pregunta al ordinador si el jugador intenta realitzar una altra pregunta sense descartar cap carta ha de sortir un missatge d'avís amb el text: "Segur que vols realitzar un altre pregunta sense girar cap carta?"
- Crea un apartat per mostrar un comptador amb el número de preguntes que s'han realitzat al ordinador
- En començar el joc cada vegada que fas una pregunta tens 20 segons per girar les cartes. Una vegada passats els 20 segons no pots girar cap carta fins que es faci una altra pregunta
- Si l'ordinador envia un si, ha de parpadejar una llumeta verda, si no vermella.
- Crea un visualitzador que mostri un compte enrere amb els 20 segons de temps després de realitzar una pregunta
- Crea un botó per activar el mode "EASY". Aquest botó només romandrà actiu i es podrà clicar si encara no hem realitzat cap pregunta
- Implementa el mode "EASY", en aquest mode mode quan fem una pregunta al ordinador automaticament gira les cartes que no cumpleixen amb les condicions
- Totes les cartes han de mostrarse a sobre d'un tauler.
- Cada cop que es gira una carta s'ha d'escoltar un só (curt)
- Si el joc finalitza y el jugador guanya s'ha d'escoltar un só de victoria
- Si el joc finalitza y el jugador perd s'ha d'escoltar un só de fracàs
- La carta seleccionada per l'ordinador ha de tenir un tamany superior que al de les altres.
- Substitueix els combos individuals de preguntes per un únic combo amb totes les preguntes
- Quan es passi per a sobre de les cartes girades, han de fer un efecte diferent.
- Modifica el botó per activar el mode "EASY" i fes un combo os es pugui seleccionar "EASY" i "VERY EASY"
- Implementa el mode "VERY EASY" a més de fer el mateix que el mode "EASY" un cop que es realitza una pregunta aquesta pregunta s'elimina dels combos de preguntes
- El botó de seleccionar, només es mostrarà actiu si hi ha una opció escollida.
- Crea un temporitzador que mostri el temps de joc amb format: mm:ss
- Implementa un Easter Egg
Especificacions funcionals
M6: programació client
- Totes les cartes excepte la seleccionada pel servidor han de poder descartar-se (girar-se cap per avall)
- Un cop descartada un carta NO pot tornar a girar-se
- Crear un combo box per a cada propietat de les cartes (la pregunta ha de ser de SI o NO)
- Crear un botó amb el text: "Fes la pregunta" que en clicar-lo detecti quin combo box té la pregunta a realitzar y consulti en els atributs de la carta seleccionada pel servidor la respota y la imprimeixi per pantalla
- Si en clicar el botó "Fes la pregunta" hi ha més d'un combo box "activat" ha de mostrar un missatge de error informant que només es pot realitzar una pregunta cada cop
- En cas de que el botó "Fes la pregunta" generi un error per que hi ha més d'un combo box "activat" a més a més de mostrar el missatge d'error ha de "resetejar" tots el combo box
- Crea un algorisme que controli el final del joc. Quan només quedi una carta s'haurà de girar la carta de seleccionada per l'ordinador, si la carta que queda es la mateixa que la seleccionada per l'ordinador el jugador guanya el joc. En cas contrari el jugador perd el joc.
- Després de realitzar una pregunta al ordinador si el jugador intenta realitzar una altra pregunta sense descartar cap carta ha de sortir un missatge d'avís amb el text: "Segur que vols realitzar un altre pregunta sense girar cap carta?"
- Crea un apartat per mostrar un comptador amb el número de preguntes que s'han realitzat al ordinador
- Crea un temporitzador que mostri el temps de joc amb format: mm:ss
- Crea un botó per activar el mode "EASY". Aquest botó només romandrà actiu i es podrà clicar si encara no hem realitzat cap pregunta
- Implementa el mode "EASY", en aquest mode mode quan fem una pregunta al ordinador automaticament gira les cartes que no cumpleixen amb les condicions
- Cada cop que es gira una carta s'ha d'escoltar un só (curt)
- Si el joc finalitza y el jugador guanya s'ha d'escoltar un só de victoria
- Si el joc finalitza y el jugador perd s'ha d'escoltar un só de fracàs
- Substitueix els combos individuals de preguntes per un únic combo amb totes les preguntes
- Modifica el botó per activar el mode "EASY" i fes un combo os es pugui seleccionar "EASY" i "VERY EASY"
- Implementa el mode "VERY EASY" a més de fer el mateix que el mode "EASY" un cop que es realitza una pregunta aquesta pregunta s'elimina dels combos de preguntes
- En començar el joc cada vegada que fas una pregunta tens 20 segons per girar les cartes. Una vegada passats els 20 segons no pots girar cap carta fins que es faci una altra pregunta
- Crea un visualitzador que mostri un compte enrere amb els 20 segons de temps després de realitzar una pregunta
- Implementa un Easter Egg
M7: programació servidor
Al servidor crearem el taulell bàsic de joc amb HTML i PHP, amb les imatges/cartes per a jugar. Tindrem 2 arxius de configuració: config.txt i imatges.txt
Càrrega d'imatges:
- Configurarem les característiques dels personatges a l'arxiu de configuració config.txt
- Les característiques són finites i hi haurà una per línia a l'arxiu de conf. Per exemple:
ulleres: si no cabell: ros moreno castany sexe: dona home
- Disposarem d'un segon arxiu de configuració per a les imatges imatges.txt. Aquest etiquetarà les imatges disponibles amb les seves característiques adients. Per exemple:
sofia.jpg : ulleres si , cabell castany , sexe dona pablo.jpg : ulleres no , cabell moreno , sexe home
- Les característiques (ros, moreno, dona, ... ) i els noms d'arxiu no poden contenir espais (en tot cas, poseu un underscore "_").
- El servidor ens haurà de donar error de configuració en aquests casos:
- Una mateixa imatge (nom d'arxiu) apareix dos cops a l'arxiu de configuració.
- Dues imatges diferents tenen les mateixes característiques.
- Una característica que apareix al fitxer imatges.txt no apareix al fitxer config.txt (al revés no importa)
RECOMANACIÓ: El servidor importarà les imatges i les seves característiques (imatges.txt) i les introduirà en un array. Cada element de l'array contindrà un array associatiu amb les característiques, per exemple:
$imatges[0] = Array( "arxiu"=>"sofia.jpg", "ulleres"=>"si", "cabell"=>"castany", "sexe"=>"dona" )
Generació de HTML:
- El servidor haurà de triar una carta a l'atzar perquè l'endevini l'usuari.
- El servidor barrejarà totes les cartes i col·locar-les sobre un taulell.
M9: disseny d'interfície
- Quan es faci clic sobre una carta, aquesta s'haurà de girar amb efecte.
- La pàgina haurà de adaptarse al tamany de les diferents pantalles de forma automàtica.
- Han de sortir focs artifials per tota la pantalla si es guanya el joc.
- S'ha de produir algún efecte, quan el ratolí passi per a sobre de una carta (sense clicar)
Exemples: Es poden il.luminar, posar-se borroses, etc.
- Si l'ordinador envia un si, ha de parpadejar una llumeta verda, si no vermella.
- Totes les cartes han de mostrarse a sobre d'un tauler.
- Tots els cuadres d'opcions han d'estar a sobre d'aquest tauler. Y a fora del mateix.
- La carta seleccionada per l'ordinador ha de tenir un tamany superior que al de les altres.
- La forma del tauler ha de ser rectangular, en vista vertical.
- Quan es passi per a sobre de les cartes girades, han de fer un efecte diferent.
- Quan s'obri un cuadre desplegable, els altres han de veure's difuminats.
- El botó de seleccionar, només es mostrarà actiu si hi ha una opció escollida.
- La carta principal ha de tenir un marc a darrere.
- S'ha d'utilitzar més d'un tipus de lletra en el joc.
Especifiacions no funcionals
- Es treballarà amb Javascript pur, no es poden fer servir llibreries externes o frameworks
- Es traballarà amb PHP
- Cada carta tindrà 3 atributs: (ulleres -> SI o NO, barba -> SI o NO, Cabell -> ROS, CASTANY, BRU)
- Heu de trobar 12 cartes amb les combinacions dels 3 atributs únic.
- Carta 1 => Ulleres, Barba, Ros,
- Carta 2 => ulleres, barba, CASTANY
- Carta 3 => ulleres, barba, BRU
- Carta 4 => NO ulleres, barba, ROS
- Carta 5 => NO ulleres, barba, CASTANY
- Carta 6 => NO ulleres, barba, BRU
- Carta 7 => ulleres, NO barba, ROS
- Carta 8 => ulleres, NO barba, CASTANY
- Carta 9 => ulleres, NO barba, BRU
- Carta 10 => NO ulleres, NO barba, ROS
- Carta 11 => NO ulleres, NO barba, CASTANY
- Carta 12 => NO ulleres, NO barba, BRU
Definition of Done (DOF)
- Tasca implementada
- Tasca testejada (en al menys 2 navegadors, firefox i google Chrome)
- Tasca comitejada
- Tasca pujada a producció
Gestió de projecte
Sprint #1 (18 hores) 11/10/18 -- 18/10/18
- Configurarem les característiques dels personatges a l'arxiu de configuració config.txt (1h)
- Les característiques són finites i hi haurà una per línia a l'arxiu de conf. Per exemple:(1h)
- ulleres: si no
- cabell: ros moreno castany
- sexe: dona home
- Disposarem d'un segon arxiu de configuració per a les imatges imatges.txt. Aquest etiquetarà les imatges disponibles amb les seves característiques adients. Per exemple:(1h)
- sofia.jpg : ulleres si , cabell castany , sexe dona
- pablo.jpg : ulleres no , cabell moreno , sexe home
- Les característiques (ros, moreno, dona, ... ) i els noms d'arxiu no poden contenir espais (en tot cas, poseu un underscore "_"). (0h)
- El servidor ens haurà de donar error de configuració en aquests casos:(3h)
- Una mateixa imatge (nom d'arxiu) apareix dos cops a l'arxiu de configuració.
- Dues imatges diferents tenen les mateixes característiques.
- Una característica que apareix al fitxer imatges.txt no apareix al fitxer config.txt (al revés no importa)
- El servidor haurà de triar una carta a l'atzar perquè l'endevini l'usuari.(1h)
- El servidor barrejarà totes les cartes i col·locar-les sobre un taulell.(2h)
- Totes les cartes excepte la seleccionada pel servidor han de poder descartar-se (girar-se cap per avall)(2h)
- Quan es faci clic sobre una carta, aquesta s'haurà de girar amb efecte.(1h)
- Un cop descartada un carta NO pot tornar a girar-se(1h)
- S'ha de produir algún efecte, quan el ratolí passi per a sobre de una carta (sense clicar).Exemples: Es poden il.luminar, posar-se borroses, etc.(1h)
- Crear un combo box per a cada propietat de les cartes (la pregunta ha de ser de SI o NO)(3h)
- Si en clicar el botó "Fes la pregunta" hi ha més d'un combo box "activat" ha de mostrar un missatge de error informant que només es pot realitzar una pregunta cada cop(1h)
Sprint #2 (27 hores) 18/10/18 -- 25/10/18