- 1. Producto
- 2. Diseño UX
- 3. Historias de usuario
- 4. Página finalizada
- 5. Flujo de trabajo
- 6. Fuentes consultadas
MountainMe es una red social enfocada a senderistas, montañistas o cualquiera que disfrute la naturaleza.
El diseño esta basado en colores que rememoran a la naturaleza, está diseñadp para poder ser usado en formato mobile y desktop. Cuenta con una interfaz dinámica e intuititva que permite al usuario compartir sus experincias.
Se realizaron dos prototipos, uno de alta fidelidad en Canva: https://www.canva.com/design/DAFj9dxC5iM/H1pLjscfsgE6OPPGSwVrOg/edit?utm_content=DAFj9dxC5iM&utm_campaign=designshare&utm_medium=link2&utm_source=sharebutton
Así como nuestro prototipo de alta fidelidad realizado en Figma: https://www.figma.com/file/g4Xt2LetGCl19i1tzWeutI/MountainMe-Team?type=design&node-id=19-273&mode=design&t=s10jLavFVmQEL9pH-0
.png)
- Cambio paleta de colores
- Estructura de la interfaz
- Fondos para las pantallas
- Modificamos la sección de Perfil de usuario
- Agregamos sección de eventos
La página se baso en seis historias de usuario.
Usuarios que practican senderismo o gustan de la naturaleza que deseen formar parte de una comunidad para conocer personas con los mismo gustos, compartir fotos y experiencias.
Se visualizan campos para que los usuarios puedan ingresar sus datos y poder hacer su respectivo registro, crear una cuenta personal y que cuente con su propio perfil para poder editarlos con los datos personales.
El usuario se podrá logear con la cuenta de google para facilitar su registro a la red social para crear una cuenta personal que cuente con su propio perfil.
El usuario pueda ingresar a la red social con los datos de registro ya guardados, sin volver a repetir los datos.
Que el usuario pueda cargar una foto de perfil.
El usuario vera las publicaciones del resto de los miembros y podrá interactuar dando like.
Es la primera sección de la red social. Permite ingresar con una cuenta ya creada, con Google o registrarse con un nuevo correo.
En esta sección se ingresa una cuenta ya creada.
En esta sección se dan de alta las cuentas nuevas, deben ser correos reales y se envía un correo de verificación.
La sección principal de la página donde se muestran las publicaciones de todos los usuarios registrados.
Para publicar se muestra un popUp, no permite publicar si los campos no están llenos.
Permite borrar y editar la publicación.
.png)
Antes de salir debes confirmar.
El perfil muestra la foto seleccionada por el usuario y su información personal.
También permite editar los campos.
El tiempo para desarrollar este proyecto fue de 5 strings, durante este tiempo seguímos el siguiente flujo de trabajo usando Trello para la organización.
A continuación algunos de los muchos artículos, videos y páginas consultadas para lograr desarrollar este proyecto:
- https://www.freecodecamp.org/espanol/news/javascript-firestore-tutorial-2020-aprende-con-ejemplos/
- https://www.rowy.io/blog/firestore-timestamp
- https://emilyxiong.medium.com/how-to-write-a-firebase-cloud-function-to-implement-a-counter-a6acd9452826
- https://ricardogeek.com/como-subir-archivos-con-javascript/
- https://lenguajejs.com/javascript/asincronia/promesas/
- https://developero.io/blog/jest-mock-module-function-class-promises-axios-y-mas#c%C3%B3mo-hacer-jestmock-o-jest-mock-function
- https://medium.com/front-end-chile/c%C3%B3mo-alojar-tu-sitio-web-en-firebase-hosting-1a828641d7b3
