4.1. - PRODUCTO INTERACTIVO BÁSICO
- 20 feb 2024
- 2 Min. de lectura
Actualizado: 26 feb 2024
- Primera prueba de producto interactivo con el software Adobe XD.
- Realizaremos una estructura sencilla de 3 mesas de trabajo con todos sus elementos interactivos: Botones, textos, imágenes, elementos geométricos, etc.
Ideación
La primera idea que tuve fue hacerlo sobre la mitología y los dioses griegos. Pero no se me ocurría como organizar la información y como mover los objetos. Asi que cambie de tema, y escogí el tema de la astrología, que es un tema que me parece muy interesante y me gusta mucho.
Pase a bocetar como iba a organizar la información:
Lugo lo pase a xd
Lo he hecho morado para que quede mejor con la página y le he puesto a la cabecera una imagen con planetas y estrellas , que he integrado cambiando el modo de fusión y recortando la imagen. Y por último para que quedara mejor le he puesto a algunos elementos una sombra.
Este ha sido el diseño final:
Después enlace todos los botones en el apartado de prototipo y les puse la animación automática y de duración 1s.
Coloque todos los elementos para que se movieran de una manera especifica:
También edite las imágenes con Photoshop para que tuvieran como un tono morado y quedara mejor. En xd les baje un poco la opacidad para que no destacaran tanto.
Y al final le añadí el detalle de la luna que va menguando según vas pasando de un
apartado a otro y si vuelves al inicio se llena. La luna la hice yo en illustrator.
Resultado final
Conclusión
Este trabajo ha sido bastante sencillo de llevar a cabo, la idea la tenía clara desde un principio. El diseño tenía más o menos una idea de como iba a ser, aunque luego cambié un par de cosas. En general estoy bastante contenta con el resultado.
Comentarios