El proyecto RandOutfit nace de la mano de Alejandra, Angela, Sebas, Aleix y Roxie para la empresa RanDoom en la que los usuarios que entren a la aplicación podrán de forma aleatoria generar un disfraz o atuendo y repetir el proceso tantas veces como quieran; La aplicación incorpora la opción de añadir o volver a randomizar la prenda deseada. Además, ofrece la opción de agregar outfits utilizando la cámara de tu dispositivo.
Juega, diviértete y comparte tu mejor randoutfit en tus redes sociales favoritas.
-
Generación aleatoria de outfits: Puedes hacer clic en el botón "RANDOUTFIZATE"para generar un disfraz de manera aleatoria. La combinación de prendas será diferente cada vez que lo hagas.
-
Refrescar y sumar prendas: Podrás generar de forma aleatoria una nueva prenda para la sección que desees con el botón de refrescar o añadirla con el botón de sumar.
-
Agregar outfits personalizados: Si deseas utilizar tu propio disfraz, puedes hacer uso de la cámara de tu dispositivo para capturar una imagen de alguna prenda y agregarla como un nuevo outfit. Esta funcionalidad está basada en las capacidades de acceso a la cámara proporcionadas por los navegadores web modernos. (Recuerda que el archivo no debe superar los 2mb de espacio y ser un archivo .png con fondo transparente)
-
Calificar Una vez generado el outfit califícalo pulsando los emojis de "me gusta" (👍) o "no me gusta" (👎) y escucha el sonido que hemos incorporado.
-
Compartir a tus redes Podrás compartir tus diseños favoritos con el botón de compartir y subirlos a Instagram, WhatsApp, Facebook y otros…
Los mockups estan disponibles en las siguiente url: https://www.figma.com/file/oow0lA4k0AC6fj16RKXmNU/RANDOM?type=design&t=k5bSH4EPDUE05tan-6
Hemos utilizado Figma, VSCode como herramientas de diseño y desarrollo y HTML5, CSS y Javascript para la creación de la página.
Nos hemos enfrentado a:
-
Función para guardar imagen en localstorage y luego que se muestre en el html.
-
Función para abrir la cámara.
-
Crear el bucle para generar las imágenes del carrousel.
Características que se esperan desarrollar en el futuro:
-
Desarrollar el botón "refresh" en el apartado de randoutfizado para que busque y muestre una nueva prenda.
-
Desarrollar el botón compartir para que se pueda compartir a redes sociales los outfits generados.