- 1. NeighTalk: Red Social Comunitaria.
- 2. Comenzando a usarla.
- 3. Proceso de protoripado.
- 4. User Research.
- 5. Historias de usuario.
- 6. Objetivos de Aprendizaje.
- 7. Despliegue.
- 8. Herramientas.
- 9. Autoras.
Neightalk es una red social enfocada a la comunidad. Un servicio que sus usuarios agradecerán al dejar atrás los grupos de comunas en Facebook o rescatando lo mejor de la inmediatez de twitter. Neightalk viene a cubrir la necesidad de un grupo de personas entregando las herramientas para que cualquiera de sus usuarios pueda reportar sucesos o eventos en la comuna en la que se encuentre. Puedes conocerla y probarla aquí.
Neightalk está pensada como un SPA(Single Page Aplication) Responsive pensada y desarrollada con la técnica Mobile First, sin embargo, también se puede utilizar desde el navegador que el usuario elija. Basta con registrarse a través de un correo electrónico o contraseña, o, iniciar sesión con Google para acceder a la app y poder hacer publicaciones.
Comenzamos construyendo un prototipo de baja fidelidad en InVision, planificando el flujo de trabajo y todo lo que proyectamos incluír en la web app.
Puedes revisarlo aquí.
El prototipo de alta fidelidad fue diseñado a través de la plataforma que ofrece Figma, dando énfasis en cómo luciría y el funcionamiento planeado.
Puedes revisarlo aquí.
Nuestra investigación de usuario se basó en una encuesta realizada a través de Google Forms. En ella, a través de una serie de preguntas dirigidas a personas de distintos rangos etáreos y diferentes comunas, consultamos acerca de los temas de mayor interés que quisieran encontrar o compatir a través de una red social como NeighTalk. En los resultados, encontramos interés común en avisos de tipo “eventos municipales” y seguridad, entre otros. Llevándonos a la conclusión de que debíamos abrir las posibilidades a los contenidos que se compartirían en la red social.
Posteriormente, realizamos testeo en usuarios y aplicamos correcciones y feedbacks recibidos a través de éste ejercicio.
Basándonos en los resultados de nuestro user research creamos diferentes historias de usuario, enfocándonos principalmente en las 3 primeras, con intención de continuar iterando en las próximas.
Realizamos la planificación a través de la plataforma de Trello, por medio de metodología ágil.
En éste proyecto se nos fue proporcionada una lista de objetivos de aprendizaje que debíamos alcanzar, a continuación se detallan los considerados:
- HTML semántico
- CSS
flexbox - Construir tu aplicación respetando el diseño realizado (maquetación).
- Manipulación dinámica del DOM
- History API
- localStorage
- Uso de callbacks
- Consumo de Promesas
- Uso ES modules
(
import|export)
- Colaboración en Github
- Organización en Github
- Modularización
- Nomenclatura / Semántica
- Linting
Puedes acceder al deploy de nuestro proyecto aquí.
En éste proyecto fueron utilizadas varias herramientas para llegar al resultado del producto entregado. Las herramientas usadas fueron:
- InVision – Para el prototipo de baja fidelidad.
- Figma – Para el prototipado de alta fidelidad y testeo en usuarios.
- Google Forms - Usado para el user research y generar historias de usuario.
- Trello – Para la planificación.
- Firebase – Para la autenticación, base de datos y hosting.
- Git y GitHub – Para el trabajo colaborativo.
Éste proyecto fue realizado en conjunto por alumnas de la generación 14 de Santiago, Chile de Laboratoria.
