01 El cliente_

Genestore es una empresa que brinda servicios de información y análisis genética a sus clientes de manera simple y fácil.

Nos llega el pedido de diseñar una plataforma de venta (e-commerce), identificando la marca con su personalidad. El sistema debe ser intuitivo y fácil de navegar.

02 El desafio_

Encontrar una solución basada en tecnologías modernas, adaptativa a cualquier tipo de dispositivo y pantalla. Hay que considerar el proceso de compra y adquisición de sus productos.

03 Principios de diseño_

Estética
Se crearon elementos únicos e identificativos para la marca, relacionados con aspectos genéticos. También, una variedad de colores institucionales representativos para sus diferentes secciones.

Consistencia
Bajo las singularidades de color, forma e imagen se mantuvo una consistencia general del diseño, navegación e interacción.

Friendly
El usuario se haya navegando el sitio y la interactividad es intuitiva. Se manipulan patrones reconocidos y reutilizables dentro del concepto general de usuario promedio.

04 Nuestro enfoque_

Basándonos en las necesidades del cliente planteamos una estructura de trabajo bajo una metodología scrum, con actualizaciones semanales del trabajo desarrollado.

El proceso incluye etapas diferenciadas: análisis de la información reflejado en usabilidad de usuario (UX), implementación de diseño potenciando la experiencia de usuario (UI), maquetado de sistema (conversión del diseño a lenguaje web bajo tecnologías HTML5, CSS3, y jQuery).

El sistema sería entregado en su versión maquetada para que el equipo interno de la empresa pudiera implementar la programación y codificación a su antojo.

05 Diseño_

Se buscó un diseño minimalista potenciado por aplicaciones de color y elementos representativos a la genética. La asignación de color a cada producto ayudó a otorgar una personalidad propia y diferenciarlo (destacarlo) dentro del mismo sitio.

La selección de imágenes potenció la comunicación de los resultados obtenidos con cada servicio.

Usamos micro-interacciones basadas en animaciones para generar mayor dinamismo en el sitio.

#686867
#8ABB38
#F5871F
#92278F
#00A1E4
#ED0080
06 Hora de maquetar_

Una vez definida la interfaz de usuario y el diseño del sitio comenzamos con el proceso de maquetación.

En primer instancia convertimos todo el diseño en lenguaje web con tecnologías de maquetado, HTML5, CSS3 y jQuery. El sitio tiene que ser 100% adaptable a múltiples dispositivos por lo que optamos en desarrollarlo responsive, compatible con navegadores modernos.

07 El resultado_
visitar sitio web

Pocket Night_

Ver trabajo

PSudamericanos_

Ver trabajo