PawLovers es mucho más que una red social para mascotas. Es todo un universo en torno al mundo de los perros, gatos, pájaros, hamsters, etc. Concursar por la mejor fotografia ya que ¡Ellos son lo primero! En esta comunidad.
En PawLovers podrás relacionarte con gente mascotera como tú, compartir tus experiencias en compañía de tu mascota
Además podrás encontrar empresas y servicios profesionales del sector de los animales de compañía, ayudar a otros animales que lo están pasando mal y mucho más.
Se realizo una busqueda de diseño que fuera amigable para el usuario y facil de recorrer. antes de avanzar a una etapa mas avanzada.
Con este prototipo se presento a distintas personas para recibir feeback e implementarlas antes de comenzar con el codigo.
- Paleta de colores En la búsqueda de la paleta de colores, se quería demostrar jovialidad y una sensación de naturaleza, para eso buscamos colores que a simple vista te trasladan al mundo animal. y se consiguió una paleta que iba de la mano con lo que se estaba buscando. Paleta de Referencia hasta llegar a esto
- Tipografía La tipografía debía ser sutil y delicada así que se eligió la font manjari que curiosamente su nombre significa "albahaca sagrada" o "flor".
- Logo En la búsqueda del logo pasamos por varias referencias inspiradoras, que podrán ver en el link a continuación. Referencias para el logo
Luego se prosiguió rápidamente a la creación del mismo,
se probaron varias ideas una al lado de la otra en el prototipo de alta fidelidad.
Dando como resultado final:
Y se eligió una tipografía que fuera divertida, un poco desordenada, Puedes apreciar un pequeño fragmento comentado del diseñador principal de la Font Neucha "traducido del idioma ruso significa "no saber cómo crear fuentes correctamente". Jovanny Lemonad Era lo que se estaba buscando en ella, una fuente libre y con un toque orgánico que traslada a lo natural.
Yo, como invitado, puedo hacer clic en “Ingresar” para ver el modal con el formulario de inicio de sesión/registro para poder realizar comentarios, publicaciones, dar likes y editar mis publicaciones y la información de mi cuenta.
- Investigar, las especificaciones de cada componente elemental para poder ejecutar las necesidades del usuario.
- Tener un prototipo para recibir feeback de los potenciales usuarios.
- definir paletas y diseño del mismo.
- Usuario: invitado
- Necesita: acceder a los formularios de inicio de sesión y registro
- Para: crear publicaciones, hacer comentarios, dar like y editar mis publicaciones y la información de mi cuenta
- Criterios de aceptación: modal con dos formularios (inicio de sesión y registro), cada uno en una pestaña. Se activa al hacer clic en “Ingresar”. Una vez logueado, “Ingresa” se transforma en el ícono de perfil de usuario y se activan las opciones de publicar, comentar, likes y la patita para editar
- Definición de Terminado:
- Crear modal básico con pestaña de formulario de inicio de sesión y registro (html, css y js)
- Crear enlace para abrir modal desde el header de la página de inicio
- Crear funcionalidad de autenticación de usuario y asociar inicio de sesión y registro con las pestañas correspondientes del modal.
- Crear opción de cierre de sesión provisoria (solo para probar la funcionalidad, después la cambiamos para ver cómo se ve mejor)
- Dar el estilo definitivo al modal (colores de pestañas, botones, hovers, animaciones, etc.)
- Usuario: quiero tener la vida más fácil
- Necesita: tener un menú de categorías.
- Para: moverse libremente dentro de la app web.
- Criterios de aceptación: Agregar menú superior con información sobre las páginas para navegar. (Móvil, web a un lado derecho)
- Definición de Terminado:
- Agregar las categorías al header (solo para el móvil)
- Asignar color
- Ordenar los iconos en el header
- Hacer la animación del search
- Hacer las redirecciones
- [ ]
- [ ]
- [ ]
- [ ]
- Usuario: que entra a ver los nuevos posts
- Necesita: tener una visión de las últimas actualizaciones.
- Para:
- Criterios de aceptación:
- Definición de Terminado: tener una plantilla de home, que contenga me gusta, comentarios, repostearlo.
- Crear plantilla de home con botones de me gusta, comentarios y compartir (sin formulario)
- Darle estilo con CSS según la maqueta de Figma
- [ ]
- [ ]
- [ ]
- Usuario: que entra a buscar algo en especifico
- Necesita:
- Para: que al buscar sobre 1 categoría en especifica me salga todo relacionado con ella
- Criterios de aceptación:
- Definición de Terminado: tener una plantilla de categorías. que contenga una pestaña para hacer tu post referente a la categoría, y poder ver y comentar, repostear el de otros
- [ ]
- [ ]
- Usuario: que entra a buscar de qué trata la red social
- Necesita: que esté todo en un solo lugar
- Para:
- Criterios de aceptación:
- Definición de Terminado: tener una plantilla de información. donde puedas saber más sobre los creadores y el fin de la red social.
- [ ]
- [ ]
- [ ]