¡En la colmena no paramos! Seguimos trabajando más que nunca y por eso hoy te contamos uno de nuestros últimos trabajos, el diseño y desarrollo web del centro de ocio Zig Zag en Murcia.

Cuando nos enfrentamos a un proyecto de diseño y desarrollo web, llevamos a cabo un proceso de trabajo con diferentes fases, desde la investigación hasta la implementación final. En este caso, se trata de un proyecto que nos ha llevado un poco más de 3 meses realizarlo al completo, por lo que vamos a intentar resumir en este post cada una de las fases por las que debe pasar un proyecto web para tener unos resultados óptimos.

Investigación:

Éste es el primer paso para que el diseño de una web sea efectivo. En este sentido, estudiamos el sector, la competencia y el target. Revisamos cómo se mueve el sector y nos preguntamos qué es exactamente lo que queremos averiguar.

¿Quién es mi competencia? ¿Cómo actua mi usuario/target?.

Una vez que tenemos claro quién es nuestra competencia, la evaluamos y comparamos qué diferencias tenemos y en que somos más semenjantes. En este caso, evaluamos diferentes páginas web y aplicaciones de otros centros de ocio. Ésta es la manera en la que podemos saber cuáles son los puntos fuertes en los que debemos fijarnos y cuáles son los que menos nos interesan.

Una vez que sabemos como actúa la competencia, evaluamos a los usuarios o target.

¿Qué quiere encontrar en nuestra página web? ¿Qué podemos ofrecerle?¿Cómo podemos hacerlo y cuál es la mejor manera?.

Sabemos entonces que lo que más interesa a los usuarios de nuestra marca es conocer los eventos de los que dispone el centro así como los locales.

Ideación:

En esta fase es cuando el proyecto comienza a tomar forma. Creamos un árbol de contenidos, donde podemos clasificar la información de manera jerárquica tal y como lo haríamos en la web. Una vez que tenemos la información sintetizada en este árbol de contenidos, lo presentamos y revisamos con nuestro cliente. Normalmente el cliente tiene mucho que aportar, al final es quien mejor conoce su marca, su sector y su producto. Además, el cliente siempre suele tener aspectos importantes que le gustaría destacar en su web por diferentes razones.

Dentro de la fase de ideación y tras haber contrastado el árbol de contenidos y haber realizado los cambios necesarios, comenzamos los primeros bocetos del diseño de la web. Aquí es donde entran en juego cuestiones estéticas y de usabilidad. Ambas tienen que darse la mano pues de nada sirve tener una web muy bonita y visual si no es usable y viceversa, de nada nos sirve una web muy usable, si no representa visualmente a la marca.

En este caso comenzamos el diseño de la web desde la versión mobile ya que en primer lugar es el dispositivo más utilizado por nuestros usuarios y, en segundo lugar, era la parte que más interesaba a nuestro cliente.

En la fase de ideación también definimos el flujo de usuario de la web, es decir, la forma en la que el usuario va a navegar por nuestra web. Se realizó un prototipo en Invision para poder conocer el flujo de la web en la versión mobile de manera más clara y evaluar así los posibles cambios con el cliente.

Implementación:

En la fase de implementación del proyecto terminamos de dar forma al diseño de la web tanto en mobile como en desktop. Continuamos la fase de implementación en versión desktop, adaptando la versión mobile.

Algunos aspectos relevantes en la fase de implementación son:

• Creación de un Ui kit de marca: Previo a comenzar la fase de implementación del diseño de la interfaz, elaboramos un kit de marca que contempla paleta de colores, uso de tipografías, botones en estado activo e innactivo así como otros elementos como las cards utilizadas en todo el diseño y la iconografía general del sitio.

• Las cards son una parte fundamental de la web: ¿Por qué las hemos utilizado? Para poder sintetizar la información de todos los locales de un sólo vistazo. Las cards son un elemento de Ui que contiene pequeñas píldoras de información que están ligadas a otra página con la información completa.
• Diseño actual y funcional: Hemos creado un diseño que no sólo se adapta a las necesidades de la marca y de sus usuarios, si no que además tiene un componente visual muy importante. El principal valor de la marca es el ocio, y, en definitiva, la diversión. En este sentido, hemos querido jugar con formas geométricas y orgánicas, combinándolas para generar un espacio más dinámico y atractivo visualmente. Queremos que la marca enamore al usuario incluso antes de pisar el centro de ocio, desde el primer contacto que el usuario va a tener con la marca en el entorno online. En nuestro último post sobre tendencias en diseño web te contamos un poquito más de esta parte.
• Buscador: Uno de los objetivos principales de la web es que el usuario encuentre con facilidad aquello que busca: un evento, un local, un tipo de comida, etc. Por eso, todas las páginas principales de la web cuentan con un buscador grande y visible.

Aspectos técnicos a tener en cuenta en el desarrollo final de la web:

• La maquetación final de la web se ha realizado de manera responsive, es decir, se adapta perfectamente a diferentes dispositivos: móvil, tablet y ordenador.
• Se han creado secciones que permanecen ocultas o se activan según las necesidades.
• Mejora de WPO a través de herramientas que nos permiten reducir de forma considerable el tiempo de carga de la web.
• Implementación de sistema de captación de leads para newsletter y club del centro de ocio.

¡Así trabaja la colmena! Aquí hemos resumido más de 3 meses de trabajo. Enfrentarnos a un proyecto de diseño web siempre supone un desafío y la duración del proyecto queda determinada por las necesidades del producto. Ahora puedes ver la web de ZigZag Murcia para conocer el resultado final.

Si quieres saber más sobre los servicios de diseño y desarrollo web de la colmena, estaremos encantados de contarte y sobre todo, de conocerte y conocer tu proyecto. Contacta con nosotros aquí.