Se pretende crear un sitio web para un restaurante utilizando el framework Bootstrap. Para ello se utilizará exclusivamente tecnología del entorno cliente (HTML, CSS y JavaScript).

Se puede tomar el sitio http://resto-elephant.com/ como referencia (aunque este sitio está formado por una sola página).

Esta práctica se realizará en grupo siguiendo el framework de trabajo Scrum. Puedes consultar el flujo de trabajo y las convenciones que seguiremos en https://github.com/interfacesweb/presentacion.

Cada equipo tendrá asignado un repositorio en GitHub dentro de https://github.com/interfacesweb/ para la realización del trabajo.

La rama principal de cada repositorio será gh-pages para que los cambios sean visibles a través de github.io.

• Desarrollar interfaces web de acuerdo con unas especificaciones dadas.
• Utilizar un framework de desarrollo adecuado para crear un interface web.
• Desarrollar interfaces web mediante técnicas que permitan su correcta visualización con independencia del medio utilizado para acceder a él.
• Aprender a trabajar en equipos de trabajo utilizando software de control de versiones.

• Martes 2/12/2014: Reunión de planificación (2 horas de clase).
• Miércoles 3/12/2014 a miércoles 17/12/2014: Trabajo del sprint (13 horas de clase).
• Jueves 18/12/2014: Sprint Review / Demo (2 horas de clase).
• Viernes 19/12/2014: Retrospectiva (1 hora de clase).

1. Familiarización con el flujo de trabajo de Git explicado en este enlace.
2. Lectura de la documentación de Bootstrap disponible en http://getbootstrap.com y en http://librosweb.es/bootstrap_3/ (en español).
   • Uso básico (Getting Started).
   • Sistema de rejilla.
   • Tablas.
   • Imágenes.
   • Formularios.
   • Utilidades de diseño adaptativo.
   • Componentes.
   • Javascript (opcional).
   • Algunas páginas de ejemplos de diseños con Bootstrap: http://builtwithbootstrap.com/, http://expo.getbootstrap.com/
3. El aspecto visual del sitio debe ser homogéneo y estar personalizado (logos, colores, tipos de letra, iconos,…). Esta característica se consigue fácilmente utilizando los nombres de clase disponibles en Bootstrap. En caso de querer adaptar el tema por defecto se debe acudir a la sección Customize.
4. El sitio tendrá una cabecera, unos elementos de navegación y un pie de página comunes a todas las páginas. Ambos elementos deben seguir los consejos de diseño estudiados en el primer tema del curso. Como consejo, se pueden incluir a través de JavaScript/JQuery (dado que no estamos introduciendo lógica de servidor). De esta manera se evita tener que copiar el mismo contenido en todas las páginas. La navegación (menús, migas de pan, etc.) debe ser consistente y mostrar al usuario dónde se encuentra en todo momento.
5. Todas las páginas del sitio serán responsivas. Deben mostrar un aspecto diferente para móvil, tablet y resto de pantallas.
6. Página inicial. Debe dejar claro el nombre, logo y características distintivas del sitio.
7. Carta de platos.
   • Se deben mostrar los platos destacados.
   • Debe haber como mínimo 5 secciones de platos: entrantes, primeros, segundos, postres y bebidas. Cada sección contendrá varios platos. Cada plato tendrá un nombre, una descripción (opcional) y el precio.
   • Debe haber una página especial para menús. Habrá cuatro menús y para cada uno de los cuales se deberá mostrar su lista de platos, foto y precio.
8. Página con formulario para reservar mesa. Al enviarse se deberá mostrar un cuadro de diálogo con un mensaje para el usuario indicando el éxito de la operación.
9. Página con comentarios de clientes. Dado que no se va a utilizar lógica de servidor, la página contendrá únicamente 4 ó 5 comentarios estáticos.
10. Página con galería de fotos (del sitio, de los platos, lo que se considere oportuno). La galería de fotos estará formada por miniaturas (thumbnails). Opcionalmente se mostrarán las fotos en modo de diálogo emergente si se pulsa en una de ellas (esta funcionalidad requiere el uso de JavaScript).
11. Página de localización con la dirección del sitio, mapa y teléfono.

• Se debe priorizar la división en tareas que generen un incremento de producto válido (por ejemplo, una tarea debería acabar con una página o trozo de la misma operativa en el servidor web).
• La inclusión de código a través de JavaScript puede realizarse con este método.
• El equipo debería ponerse de acuerdo en la sesión de planificación para establecer una estructura HTML común para todos. Dicha estructura puede modificarse posteriormente, no obstante.
• Es recomendable no trabajar más de un usuario en el mismo archivo para evitar conflictos. Para ello debería asignarse cada tarea a una funcionalidad que se implemente en archivos independientes.
• Es recomendable realizar un commit y un push como mínimo antes de que termine cada clase.

• Hoja de seguimiento (20%): actualización y supervisión diaria, actualización de la estimación de las tareas, dibujo de la gráfica de Burn Down, celebración de reuniones diarias,…
• Porcentaje realizado de la lista de requerimientos (20%): porcentaje de historias implementadas que cumplan con la definición de terminado, cantidad de tareas adicionales realizadas.
• Calidad del producto generado (20%): originalidad, superación de tests de validación, correcta visualización en distintos dispositivos y navegadores, diseño consistente, usabilidad,…
• Realización de la retrospectiva (20%): correcta revisión de las estrategias utilizadas, identificación de puntos de mejora, análisis de equipo, análisis individual.
• Presentación de los resultados (20%): participación de todos los miembros del equipo, fluidez de la exposición, adecuación al tiempo disponible.