Diferència entre revisions de la pàgina «Projecte Xat - Especificacions»

De Wiket
Salta a la navegació Salta a la cerca
 
(28 revisions intermèdies per 3 usuaris que no es mostren)
Línia 1: Línia 1:
 +
[[Fitxer:globos.jpeg|dreta]]
  
 +
== Introducció ==
 +
L'ajuntament de Cornellà ens demana una aplicació web suficientment flexible per adaptar-se a diverses situacions i apropar més als ciutadans per promoure idees i detectar problemes de la ciutat.
  
−
== Introducció ==
+
<br>
−
L'ajuntament de Cornellà ens demana una aplicació web suficientment flexible per adaptar-se a diverses situacions i apropar més als ciutadants per promoure idees i detectar problemes de la ciutat, com per exemple:
 
−
* Debats online
 
−
* Denunciar mobiliari ubrà malmès
 
−
* Chatrooms temàtiques clàssiques (com el mIRC, però amb "fàcil" ...)
 
−
* Pàgina de contactes/intercanvis (per exemple, es necessita )
 
  
−
Algunes referències:
+
== Requeriments ==
−
* http://parlemapp.cat
+
El personal de l'Ajuntament ens dona aquests requeriments:
−
* ...
+
* Debats online.
 +
* Denunciar mobiliari urbà malmès.
 +
* Pàgina de contactes/intercanvis (per exemple, hi ha algú que vol muntar un campionat d'escacs, o que està disposat a donar classes de piano a canvi de classes de cuina Japonesa, etc.)
 +
* Chatrooms temàtiques clàssiques (pensant que ha de ser de fàcil ús. una espècie de  mIRC simplificat, per entendre'ns ...)
  
 +
La idea seria agrupar totes aquestes funcionalitats en una sola site.
 +
Els ciutadans es registrarien, i escollirien un ''nickname'' per mantenir l'anonimat.
  
 
<br>
 
<br>
  
−
== Requeriments ==
+
== Especificacions ==
−
El nostre client necessita que l'aplicació s'adapti a diferents entorns. Alguns requeriran autenticació i d'altres no necessàriament.
+
# Heu de definir un estil que penseu que és adequat per fer aquesta site.
 +
# Cal que la site tingui un ''look and feel'' similar i que s'incorpori el logo de Cornellà en totes les pàgines (veure : http://www.cornella.cat/ca/ImatgeCorporativa.asp)
 +
# Quan es registrin, els ciutadans especifiquin a on viuen de la ciutat i que donin un telèfon i un email.
 +
# La site es pugui veure en la majoria de navegadors actuals.
 +
# Cal que el prototipus que es faci sigui accessible des de la web.
 +
# Cal que es pugui anar a la configuració de l'usuari i que es pugui canviar les seves dades personals.
 +
# '''Crear debats'''. La site ha de poder facilitar als usuaris afegir debats (definir-los) a l'estil de  http://parlemapp.cat) i associar-hi etiquetes (''hashtags'').
 +
# Els usuaris podran veure els debats proposats i cercar-los (emparant les etiquetes - (''hashtags'')).
 +
# '''Denuncia objectes malmesos''' La site ha de tenir una secció per poder pujar imatges dels objectes malmesos i indicar la seva situació.
 +
# '''Secció intercanvis'''.Cal que també tingui una secció d'intercanvis (se'ls hi pugui associar una etiqueta) per a possibles trocs o barates ("trueques") (p.ex https://www.milanuncios.com/trueque/).
 +
# '''Chatrooms'''.Contingui la possibilitat de definir ''chatrooms'' (afegir chatrooms amb un codi i puguis començar amb un xat amb tots aquells usuaris registrats que vagin entrant que coneguin aquell codi. Per tant, a priori el chat seria privat, i només s'hi podria accedir amb un codi, a l'estil del chat de ''l'Slack'' (https://slack.com/intl/es-es) o també us podeu inspirar amb ''kahoot!'' (https://kahoot.it/).
 +
# Disseny que es pugui visualitzar correctament en una pantalla de portàtil i que s'adapti en dipositius d'almenys 400 px. (bon grau  ''responsive'')
  
 
<br>
 
<br>
Línia 22: Línia 36:
 
== Especificacions funcionals ==
 
== Especificacions funcionals ==
 
* M6: programació client
 
* M6: programació client
−
*# ...
+
*# <s>Navegació global:</s>
 +
*## <s>Menús i/o pestanyes han de tenir efectes visuals</s>
 +
*# <s>Xat:</s>
 +
*## <s>La comunicació amb el servidor serà a partir de missatges.</s>
 +
*## <s>Tota la vista serà gestionada per l'entorn client.</s>
 +
*## <s>Diferenciar cadascun dels usuaris que parlin al xat (globus de missatge, colors pel nom, etc.)</s>
 +
*## <s>Quan et connectes es mostraran tots els missatges de la darrera hora.</s>
 +
*## <s>Si la darrera hora no hi ha conversa, es mostraran els darrers 20 missatges.</s>
 
* M7: programació servidor
 
* M7: programació servidor
−
*# Els usuaris es poden registrar amb email i poden recuperar contrasenya
+
*# <s>Autenticació:</s>
−
*# La contrasenya estarà xifrada
+
*## <s>Els usuaris es poden registrar amb email i poden recuperar contrasenya</s>
−
*# L'usuari ha de triar-se un ''nickname'' únic
+
*## <s>La contrasenya estarà xifrada</s>
−
*# ...
+
*## <s>L'usuari ha de triar-se un ''nickname'' únic</s>
 +
*# <s>Autorització</s>
 +
*## <s>Usuaris administradors poden crear chatrooms, respondre denúncies, penjar notícies</s>
 +
*## <s>Usuaris registrats poden xatejar, crear denúncies i visualitzar notícies.</s>
 +
*# <s>Navegació global</s>
 +
*## <s>Seccions: Xat, Denúncies, Debats, Notícies</s>
 +
*## <s>Breadcrumbs</s>
 +
*## <s>Banner de publicitat</s>
 +
*# Xat:
 +
*## <s>Inicialment es vol una chatroom per barri.</s>
 +
*## Els usuaris poden mantenir xats privats.
 +
*# <s>Denúncies:</s>
 +
*## <s>La denúncia ha d'incloure 1 foto, un text i una geolocalització</s>
 +
*## <s>L'usuari pot veure les seves pròpies denúncies efectuades</s>
 +
*## <s>L'administrador pot contestar la denúncia per informar l'usuari</s>
 +
*# Notícies:
 +
*## <s>Els usuaris administradors poden crear notícies</s>
 +
*## <s>El formulari per crear notícies ha de incloure un títol, una data, un texte i una imatge opcional (Jquery)</s>
 +
*## <s>Els usuaris normals i els usuaris anónims poden veure les notícies ordenades per data</s>
 +
*## <s>L'usuari administrador ha de poder marcar una notícia com a important i tingui la data que tingui aquesta surtirà la primera durant 7 díes</s>
 +
*## <s>Crear un sistema de categories per les notícies</s>
 +
*## <s>Els administradors poden asignar una categoria a les notícies</s>
 +
*## <s>Els usuaris poden veure un llistat de les categories en la página de notícies</s>
 +
*## <s>En clicar una categoria només es mostrarà les notícies de la categoria seleccionada</s>
 +
*# Debats:
 +
*## ...coming soon...
 +
*# Desplegament
 +
*## [https://cacauet.org/wiki/index.php/Laravel#Laravel_en_producció Posada en producció del projecte sobre AWS amb Ubuntu i Apache]
 
* M9: disseny d'interfície
 
* M9: disseny d'interfície
−
*# ...
+
 
 +
Per avaluar el M9 '''cal que la web sigui accessible per la web''' per poder-la validar (p.ex passar el test de usabilitat browsers, encoratjar-vos a veure en diferents dispositius, etc.).  
 +
Recordeu que ha de ser un '''prototipus'''! no es valorarà la implementació de la site (requeriments funcionals M7,M6), i si el disseny i la funcionalitat de la demo ("proof of concept" i el disseny).
 +
 
 +
Enviar un '''document''' amb les '''dades del grup''', el '''disseny''' (distribució general de la site, colors escollits, logo, etc.) i el resum del grau d'accessibilitat de la vostra site i la URL de la pàgina a on teniu la site (utilitzeu els resultats de les pàgines vistes en el curs).
 +
 
 +
Afegiu un usuari ''anonim'' per testejar-ho :
 +
anonim/anonim
 +
 
 +
 
 +
1) '''Formalització del Disseny (25%) -''' Site com a conjunt. La formalització és molt destecable, codi de color, composició, tipografia i disseny d'imatges/logos.
 +
 
 +
2) '''Visualització (15%)'''.  . La pàgina es vegi correctament en browsers moderns (test) i grau de d'adaptació a diferents terminals. 
 +
 
 +
3) '''Bona accessibilitat, i funcionalitat dels requeriments especificats (45%)''' en general.
 +
 
 +
Prototipus -''proof of concept'' de la site a  on es vegi les funcionalitats especificades.
 +
 
 +
Funcionalitat de la pàgina  - Usabilitat . S'han escollit elements d'interfície web (botons, links, ..) adients per moure't per l'entorn-, missatges d'error es visualitzen adequadament, etc.
 +
 
 +
Grau d'accessibilitat.
 +
 
 +
 
 +
4) '''Cura en els detalls (15%)''' d'instal·lació. Facilitat per instal·lar projecte  (README del projecte concís, explicant com instal·lar la web, automatisme : executant .sql es carrega correctament, etc.)
  
  
Línia 48: Línia 119:
 
<br>
 
<br>
  
−
== Sprint #1 ==
+
 
 +
== Definition of Done (DOF) ==
 +
# Tarea implementada
 +
# Tarea testeada
 +
# Tarea comiteada
 +
# Tarea subida a producción
 +
 
 
...
 
...
  
 
<br>
 
<br>
 +
 +
== Sprint #1 (20 hores)==
 +
# Disenyar i analitzar l'sprint ('''2 hores''')
 +
# Navegació global, efectes visuals a tots els menus, pestanyes, etc ('''1 hora''')
 +
# Registre d'usuaris i recuperació de contrasenya ('''2 hores''')
 +
# Contrasenya xifrada ('''2 hores''')
 +
# L'usuari tria el nick ('''1 hora''')
 +
# Navegació global Seccions ('''2 hores''')
 +
# Breadcrumbs ('''1 hora''')
 +
# Banner publicitat ('''1 hora''')
 +
# La denúncia ha d'incloure 1 foto, un text i una geolocalització ('''3 hores''')
 +
# L'usuari pot veure les seves pròpies denúncies efectuades ('''1 hora''')
 +
# L'administrador pot contestar la denúncia per informar l'usuari ('''1 hora''')
 +
# Vista básica xat ('''3 hores''')
 +
===Sprint #1 grup 3 persones ( + 7 hores)===
 +
# Diferenciar usuaris ('''2 hores''')
 +
# Primera conexió al xat ('''2 hores''')
 +
# Si no hi ha missatges a l'última hora carregar els 20 últims missatges ('''1 hora''')
 +
# Per defecte 1 xatroom per barri ('''2 hores''')
 +
 +
<br>
 +
 +
== Sprint #2 (14 hores)==
 +
# API para el xat ('''5 hores''')
 +
# 1ª conexión missatge ('''2 hores''')
 +
# Si no hi ha missatges durant la darrera hora carregar els 20 últims missatges ('''1 hora''')
 +
# 1 xatroom per barri per defecte ('''2 hores''')
 +
# Crear el formulari de notícies ('''2 hores''')
 +
# Visualització de les notícies ordenades per data ('''2 hores''')
 +
 +
<br>
 +
 +
==Sprint #3 (20 hores, 10 hores investigació Laravel + 10 hores Sprint Modalitat Pair Programming)==
 +
# L'usuari administrador ha de poder marcar una notícia com a important i tingui la data que tingui aquesta surtirà la primera durant 7 díes ('''2 hores''')
 +
# Crear un sistema de categories per les notícies ('''1 hora''')
 +
# Els administradors poden asignar una categoria a les notícies ('''1 hora''')
 +
# Els usuaris poden veure un llistat de les categories en la página de notícies ('''2 hores''')
 +
# En clicar una categoria només es mostrarà les notícies de la categoria seleccionada ('''2 hores''')
 +
# Acabar les tasques endarredires ('''2 hores''')

Revisió de 10:01, 26 feb 2018

Globos.jpeg

Introducció

L'ajuntament de Cornellà ens demana una aplicació web suficientment flexible per adaptar-se a diverses situacions i apropar més als ciutadans per promoure idees i detectar problemes de la ciutat.


Requeriments

El personal de l'Ajuntament ens dona aquests requeriments:

  • Debats online.
  • Denunciar mobiliari urbà malmès.
  • Pàgina de contactes/intercanvis (per exemple, hi ha algú que vol muntar un campionat d'escacs, o que està disposat a donar classes de piano a canvi de classes de cuina Japonesa, etc.)
  • Chatrooms temàtiques clàssiques (pensant que ha de ser de fàcil ús. una espècie de mIRC simplificat, per entendre'ns ...)

La idea seria agrupar totes aquestes funcionalitats en una sola site. Els ciutadans es registrarien, i escollirien un nickname per mantenir l'anonimat.


Especificacions

  1. Heu de definir un estil que penseu que és adequat per fer aquesta site.
  2. Cal que la site tingui un look and feel similar i que s'incorpori el logo de Cornellà en totes les pàgines (veure : http://www.cornella.cat/ca/ImatgeCorporativa.asp)
  3. Quan es registrin, els ciutadans especifiquin a on viuen de la ciutat i que donin un telèfon i un email.
  4. La site es pugui veure en la majoria de navegadors actuals.
  5. Cal que el prototipus que es faci sigui accessible des de la web.
  6. Cal que es pugui anar a la configuració de l'usuari i que es pugui canviar les seves dades personals.
  7. Crear debats. La site ha de poder facilitar als usuaris afegir debats (definir-los) a l'estil de http://parlemapp.cat) i associar-hi etiquetes (hashtags).
  8. Els usuaris podran veure els debats proposats i cercar-los (emparant les etiquetes - (hashtags)).
  9. Denuncia objectes malmesos La site ha de tenir una secció per poder pujar imatges dels objectes malmesos i indicar la seva situació.
  10. Secció intercanvis.Cal que també tingui una secció d'intercanvis (se'ls hi pugui associar una etiqueta) per a possibles trocs o barates ("trueques") (p.ex https://www.milanuncios.com/trueque/).
  11. Chatrooms.Contingui la possibilitat de definir chatrooms (afegir chatrooms amb un codi i puguis començar amb un xat amb tots aquells usuaris registrats que vagin entrant que coneguin aquell codi. Per tant, a priori el chat seria privat, i només s'hi podria accedir amb un codi, a l'estil del chat de l'Slack (https://slack.com/intl/es-es) o també us podeu inspirar amb kahoot! (https://kahoot.it/).
  12. Disseny que es pugui visualitzar correctament en una pantalla de portàtil i que s'adapti en dipositius d'almenys 400 px. (bon grau responsive)


Especificacions funcionals

  • M6: programació client
    1. Navegació global:
      1. Menús i/o pestanyes han de tenir efectes visuals
    2. Xat:
      1. La comunicació amb el servidor serà a partir de missatges.
      2. Tota la vista serà gestionada per l'entorn client.
      3. Diferenciar cadascun dels usuaris que parlin al xat (globus de missatge, colors pel nom, etc.)
      4. Quan et connectes es mostraran tots els missatges de la darrera hora.
      5. Si la darrera hora no hi ha conversa, es mostraran els darrers 20 missatges.
  • M7: programació servidor
    1. Autenticació:
      1. Els usuaris es poden registrar amb email i poden recuperar contrasenya
      2. La contrasenya estarà xifrada
      3. L'usuari ha de triar-se un nickname únic
    2. Autorització
      1. Usuaris administradors poden crear chatrooms, respondre denúncies, penjar notícies
      2. Usuaris registrats poden xatejar, crear denúncies i visualitzar notícies.
    3. Navegació global
      1. Seccions: Xat, Denúncies, Debats, Notícies
      2. Breadcrumbs
      3. Banner de publicitat
    4. Xat:
      1. Inicialment es vol una chatroom per barri.
      2. Els usuaris poden mantenir xats privats.
    5. Denúncies:
      1. La denúncia ha d'incloure 1 foto, un text i una geolocalització
      2. L'usuari pot veure les seves pròpies denúncies efectuades
      3. L'administrador pot contestar la denúncia per informar l'usuari
    6. Notícies:
      1. Els usuaris administradors poden crear notícies
      2. El formulari per crear notícies ha de incloure un títol, una data, un texte i una imatge opcional (Jquery)
      3. Els usuaris normals i els usuaris anónims poden veure les notícies ordenades per data
      4. L'usuari administrador ha de poder marcar una notícia com a important i tingui la data que tingui aquesta surtirà la primera durant 7 díes
      5. Crear un sistema de categories per les notícies
      6. Els administradors poden asignar una categoria a les notícies
      7. Els usuaris poden veure un llistat de les categories en la página de notícies
      8. En clicar una categoria només es mostrarà les notícies de la categoria seleccionada
    7. Debats:
      1. ...coming soon...
    8. Desplegament
      1. Posada en producció del projecte sobre AWS amb Ubuntu i Apache
  • M9: disseny d'interfície

Per avaluar el M9 cal que la web sigui accessible per la web per poder-la validar (p.ex passar el test de usabilitat browsers, encoratjar-vos a veure en diferents dispositius, etc.). Recordeu que ha de ser un prototipus! no es valorarà la implementació de la site (requeriments funcionals M7,M6), i si el disseny i la funcionalitat de la demo ("proof of concept" i el disseny).

Enviar un document amb les dades del grup, el disseny (distribució general de la site, colors escollits, logo, etc.) i el resum del grau d'accessibilitat de la vostra site i la URL de la pàgina a on teniu la site (utilitzeu els resultats de les pàgines vistes en el curs).

Afegiu un usuari anonim per testejar-ho : 

anonim/anonim


1) Formalització del Disseny (25%) - Site com a conjunt. La formalització és molt destecable, codi de color, composició, tipografia i disseny d'imatges/logos.

2) Visualització (15%). . La pàgina es vegi correctament en browsers moderns (test) i grau de d'adaptació a diferents terminals.

3) Bona accessibilitat, i funcionalitat dels requeriments especificats (45%) en general.

Prototipus -proof of concept de la site a on es vegi les funcionalitats especificades.

Funcionalitat de la pàgina - Usabilitat . S'han escollit elements d'interfície web (botons, links, ..) adients per moure't per l'entorn-, missatges d'error es visualitzen adequadament, etc.

Grau d'accessibilitat.


4) Cura en els detalls (15%) d'instal·lació. Facilitat per instal·lar projecte (README del projecte concís, explicant com instal·lar la web, automatisme : executant .sql es carrega correctament, etc.)



Especifiacions no funcionals

  • Es treballarà amb framework Laravel en PHP
  • Utilitzarem el framework jQuery per a la part client
  • ...


Prototip

Només aplica a M9.

...



Definition of Done (DOF)

  1. Tarea implementada
  2. Tarea testeada
  3. Tarea comiteada
  4. Tarea subida a producción

...


Sprint #1 (20 hores)

  1. Disenyar i analitzar l'sprint (2 hores)
  2. Navegació global, efectes visuals a tots els menus, pestanyes, etc (1 hora)
  3. Registre d'usuaris i recuperació de contrasenya (2 hores)
  4. Contrasenya xifrada (2 hores)
  5. L'usuari tria el nick (1 hora)
  6. Navegació global Seccions (2 hores)
  7. Breadcrumbs (1 hora)
  8. Banner publicitat (1 hora)
  9. La denúncia ha d'incloure 1 foto, un text i una geolocalització (3 hores)
  10. L'usuari pot veure les seves pròpies denúncies efectuades (1 hora)
  11. L'administrador pot contestar la denúncia per informar l'usuari (1 hora)
  12. Vista básica xat (3 hores)

Sprint #1 grup 3 persones ( + 7 hores)

  1. Diferenciar usuaris (2 hores)
  2. Primera conexió al xat (2 hores)
  3. Si no hi ha missatges a l'última hora carregar els 20 últims missatges (1 hora)
  4. Per defecte 1 xatroom per barri (2 hores)


Sprint #2 (14 hores)

  1. API para el xat (5 hores)
  2. 1ª conexión missatge (2 hores)
  3. Si no hi ha missatges durant la darrera hora carregar els 20 últims missatges (1 hora)
  4. 1 xatroom per barri per defecte (2 hores)
  5. Crear el formulari de notícies (2 hores)
  6. Visualització de les notícies ordenades per data (2 hores)


Sprint #3 (20 hores, 10 hores investigació Laravel + 10 hores Sprint Modalitat Pair Programming)

  1. L'usuari administrador ha de poder marcar una notícia com a important i tingui la data que tingui aquesta surtirà la primera durant 7 díes (2 hores)
  2. Crear un sistema de categories per les notícies (1 hora)
  3. Els administradors poden asignar una categoria a les notícies (1 hora)
  4. Els usuaris poden veure un llistat de les categories en la página de notícies (2 hores)
  5. En clicar una categoria només es mostrarà les notícies de la categoria seleccionada (2 hores)
  6. Acabar les tasques endarredires (2 hores)
Obtingut de «https://wiket.esteveterradas.cat/index.php?title=Projecte_Xat_-_Especificacions&oldid=2624»