- Definición del Producto
- Link de la APP
- Historias de Usuarios
- Planificación
- Diseño de Interfaz
- Consideraciones técnicas
Laboratorians es una AppWeb que surge principalmente para las estudiantes y egresadas de Laboratoria en donde encuentren un espacio en común para compartir historias , consejos , reseñas, cursos, charlas , trabajos tech, o lo que deseen publicar en la comunidad chilena o Latinoamericana.
A mujeres que sean o hayan sido parte de las diferentes generaciones de bootcamps de Laboratoria en Chile y en la distintas sedes de latinoamerica.
Las problemas que detectamos son :
- Carencia de comunidad entre mujeres egresadas desde las primeras generaciones a la fecha
- Falta de red de apoyo entre estudiantes activas de un mismo track en diferentes países
- Ausencia de comunicación entre mujeres que cursen diferentes tracks
- No todas las estudiantes mantienen cuentas activas en Facebook o Instagram que es donde Laboratoria oficial tiene su comunidad
- El contenido en RRSS antes mencionadas suele ser de publicidad o convocatorias a Laboratoria , más que una comunidad activa que pueda contar como red de apoyo
- Existe Slack, en donde puedes encontrar a otras estudiantes , sin embargo si no pagas una suscripción mensual, la cantidad de msjes que puedes revisar en el historial es limitada
La creación de "Laboratorians" es una appWeb donde las mujeres de Laboratoria pueden crear una cuenta,indicando si son estudiantes o egresadas y puedan ser parte de una comunidad activa de mujeres en el codigo, accediendo y creando lazos con las diferentes generaciones y paises , información actualizada de diferentes temáticas relacionadas al mundo tech , informar cuales son las tendencias, invitaciones a charlas u eventos, solicitar u ofrecer trabajos o servicios relacionados con la tecnologia, para las nuevas estudiantes recibir consejos y tips de egresadas y compañeras que hayan pasado por los mismos trabajos y conocer nuevas amigas .
El objetivo principal de aprendizaje es construir una AppWeb con Single-page Application (SPA) responsive (con más de una vista / página) en la que podamos leer y escribir datos. La interfaz permite lo siguiente:
- Creación de cuenta de usuario e inicio de sesión
- Autenticación con Facebook y/o Google y/o Email utilizando Firebase
- Crear Muro/timeline de la red social , para publicar post, dar like a una publicación, llevar un conteo de los likes,celiminar un post específico.
Puedes encontrar la App en el siguiente link Link
Se redacta y ejecuta una encuesta con el Formulario de Google Forms, para definir los parámetros generales de la aplicación, por ejemplo a qué usuario nos vamos a dirigir, cuáles son sus necesidades , como también para obtener claridad sobre cuál es la información más relevante a la que dichos usuarios necesitarían acceso. Con ésta información se plantea la jerarquización de la data y de sus funcionalidades para poder acomodarla dentro del flujo de la aplicación junto con parámetros de usabilidad (web y móvil) como también de diseño de interface (UI). La encuesta alcanzó un total de 19 respuestas en un día y se puede encontrar haciendo click Encuesta📝
- Conclusiones de la encuesta: Imágen Imágen A partir de los resultados pudimos obtener y definir:
- Nuestro usuario target: Comunidad de laboratoria
- Información relevante para un publicar y leer en el muro: Noticias y eventos , consejos, tutoriales,tips. ##Historias de Usuario:
"Yo, como estudiante de Laboratoria.
Quiero, poder loguearme.
Para, acceder con Google a la Red Social Laboratorians."
➡ Criterios de aceptación: Creamos en la App Web con un botón para iniciar sesión con google abriendo un pop-up para loguearse con google con su correo y contraseña. Si los datos son validos, se crea un perfil y le permite entrar a laboratorians.
"Yo, como estudiante del bootcamp.
Quiero, poder registrarme en Laboratorians con cualquier correo y contraseña.
Para, poder ingresar de forma espedita y segura."
➡ Criterios de aceptación: Creamos en la App Web un boton que permite registrarse "creando cuenta" , para que el usuario pueda escribir su correo y contraseña, si el correo no es valido se envia un mensaje de error y se envia un correo de verificación cuando la cuenta ha sido creada exitosamente.
"Yo, como usuario ya registrado.
Quiero, poder ingresar con mi correo y contraseña.
Para, optimizar y ocupar la red social."
➡ Criterios de aceptación: En la App Web muestra un botón donde estan los campos para ingresar el correo y contraseña. El usuario debe poder escribir su correo y contraseña , y apretar el boton de iniciar sesion.Si los datos son validos, el usuario puede ingresar a la red social pero si los datos no son validos se genera un mensaje de error.
"Yo, como estudiante.
Quiero, ver y poder publicar en el muro de la App.
Para, informarme de las novedades , subir publicaciones y estar al tanto de todo lo que pasa."
➡ Criterios de aceptación: En la pagina se vera una pagina en donde permitira al usuario ver las publicaciones del muro , crear una publicación mediante un cuadro de texto.
## Diagrama de Flujo
A partir de las historias de usuario se define el flujo básico de la aplicación:
Se definen acciones y funciones que nuestro usuario necesita y quiere realizar dentro de la app para lograr sus objetivos. La planificación se realizó mediante un trabajo colaborativo en Trello, el cuál puedes revisar en el siguiente link LinkTrello y utilizando ceremonias ágiles para verificar las tareas que va realizando cada miembro del equipo –así detectamos a tiempo bloqueos, dailys y retrospectivas diarias.
####Prototipo de Baja Fidelidad ####Prototipo de Alta Fidelidad Después de la definición de usuario, de sus características, intereses y gustos, se define el diseño visual de nuestra aplicación en términos de color, fuente, logo y contenido de imágenes entre otros. Para la paleta de colores se establecio viendo todos los colores que eran usados por laboratoria en las redes sociales, donde predomina el amarillo , rosado , verde , negro y escala de grises ###Testeos de Usabilidad Se testea con 5 personas presentando la página Laboratorians, pidiéndoles lo siguiente:
- Registrarse
- Ingresar por google
- Ver muro
- Escribir un post Al finalizarla el test se les pregunta: ¿Sabes de que trata la página? ¿La utilizarías como una red social? ¿Agregarías algo?
##Organización del Squads en Trello: https://trello.com/b/FSFHhEWS/red-social
En conclusión, tratamos de tomar todas las mejoras y consejos, logramos el objetivo de que la página se entendiera y la pudieran ocupar en alguna oportunidad. En términos de funciones, jerarquización, botones y solectores......
Realizamos la evaluación para nuestra página web en el siguiente sitio: haz click aquí ##Consideraciones técnicas ( Build with )
- Vanilla Javascript (ES6)
- Firebase - // Firestore
- HTML5
- CSS
- Figma // AdobeXD