Rediseño responsive de la página de alojamiento

Poco a poco, aunque menos rápido de lo que me gustaría ;-), vamos implementando cambios y mejoras, tanto en diseño como en usabilidad.

Y es que, sin cambiar la maquetación de ciertas páginas, es decir, su «core» es imposible que cumplan los objetivos deseados en determinados dispositivos.

Quieres un diseño que proporcione la mejor experiencia desde cualquier dispositivo

El problema, era que como la mayor parte de las webs, ni su estructura ni su experiencia, estaba pensada para tablets o móviles, sino que sólo estaba optimizada para desktop.

Diseño página de alojamiento

Diseño responsive de la página de alojamiento

Y lógicamente dado el porcentaje de tráfico actual que viene de móbiles y tablets, era impensable continuar así, sin tener la web optimizada para dar la mejor experiencia.

Hace más de 2 años, cuando entre en Central de reservas, la página de alojamiento era similar a esta imagen:

Sigue leyendo

Rediseño de la home

La home es la página de presentación de una empresa. Normalmente suele ser una de las páginas más visitadas, por lo cual es importante el aspecto que tiene ya que puede ser lo primero que vea el usuario de nuestro negocio.

En internet, muchas veces, la primera impresión es lo que cuenta

Y dado que en internet es tan sencillo irse de una web como cerrar la ventana del navegador, esa primera impresión es importante.

La idea era modernizar el aspecto de la página ya que su diseño no había cambiado en mucho tiempo, destacando el buscador, ya que es el elemento más importante para el usuario, y dar más protagonismo a las experiencia que suscita el planear un viaje.

Diseño final de la home

Diseño actual de la home

Teníamos la restricción de que no se podían dedicar muchos recursos de desarrollo, ya que estaban empleándose en hacer el cambio general de la web a un diseño responsive.

Tenía que ser un cambio a nivel de diseño que supusiera una mejor experiencia, sin un coste alto de desarrollo

Anteriormente la home tenía este aspecto.

Sigue leyendo

Detalle de la reserva

Vista completa del diseño del detalle de una reserva en la app de reserva de alojamiento online de Centraldereservas.com.

Podemos apreciar los diferentes campos de datos que componen el detalle así como diversas funcionalidad asociadas, como el botón de «Como llegar» que indica al usuario con la aplicación nativa del móvil el recorrido al alojamiento.

Detalle de la reserva

El submenú del detalle de la reserva permite realizar algunas de las funciones de manera más directa presentes en la pantalla y otras diferentes, como «Añadir la reserva al Passwallet/Passbook» o «Modificar la reserva».

Sigue leyendo

Diseño de la App Central de Reservas

Desarrollo de la AI de la app, el prototipado y diseño en base a las necesidades establecidas, tanto para la versión en IOS como Android.

Diseño App

Se siguen realizando pruebas constantemente con usuarios para mejorar la experiencia de usuario, además de implementar nuevas funcionalidades.

Detalle del menú principal de la App.

Pantalla de visualización de todas las reservas, ya sean anteriores o pendientes.

Visualización del detalle de una reserva ya realizada.

Sigue leyendo

Rediseño página de Atención al Cliente

Poco a poco vamos cambiando todas las páginas de Centraldereservas.com a diseños más actuales. En este caso le toca el rediseño a la página de Atención al cliente. Aquí podéis ver el resultado:

Diseño Atencion al cliente
Ver diseño actual online

Lo que se quería conseguir era que la mirada del usuario cayera sobre las llamadas de atención principales, ya que en el diseño que había hasta ese momento era un listado de enlaces todos similares como podéis ver:

Sigue leyendo

Prototipado y Diseño de la landing de nieve

Para la campaña de nieve de 2014 y dada la importancia de la venta de paquetes de nieve para la empresa, se decidió crear una nueva página centrada en los productos de nieve para que el usuario pudiera acceder y entender de manera más sencilla que opciones tiene.

Y es que aparte de reservar el alojamiento, los clientes pueden añadir extras como forfaits, clases de esqui, alquiler de materiales, comida en pista… Y todas estas opciones debían de quedar claras.

La página debía integrar los siguientes elementos:

  1. Buscador
  2. Mapa interactivo con las zonas de nieve
  3. Elemento que explique  los productos/actividades específicos
  4. Grupo de ofertas Hotel+Forfait
  5. Hoteles destacados de nieve
  6. Zonas nieve con las principales zonas de esquí que enlacen a páginas con mapas donde se muestran las localidades y estaciones de esa zona.
  7. Estado de las pistas
  8. Link a la página de Reserving
  9. Suscripción al boletín

Aquí podéis ver el diseño final actual.

Diseño landing Nieve

Sigue leyendo

Estudio y rediseño página afiliados

Afiliados fue una de las primeras páginas que se acometió su rediseño.

Consiste en una sección dentro de Centraldereservas.com con una arquitectura de la información propia, donde de explica en que consiste pertenecer a la red de afiliados y las ventajas que conlleva.

Hablando con los stakeholders, se averiguó que los usuarios al acceder querían conseguir 2 cosas

O eran usuarios ya registrados con lo cual querían acceder a su zona de acceso privada, o eras nuevos usuarios que buscaban información y como registrarse.

Por ello, lo que se hizo fue proponer un diseño donde se viera nada más entrar las 2 llamadas a la acción principales:

  1. Registrarse
  2. Acceder a la parte interna.

Y la segunda que el usuario tuviera claro la navegación interna y donde encontrar la información que estaba buscando.

Aquí podéis ver como quedó una vez cambiada la página.

Rediseño de la página de afiliados

Esta es el diseño que tenía anteriormente, con un formulario en la parte superior y el menú interno en la parte lateral:

Sigue leyendo

Rediseño Centraldereservas.com

Hola, desde junio de 2013 formo parte del equipo tecnológico de Centraldereservas.com, una web especializada en la venta de alojamientos a través de internet aunque cuenta con oficina de cara al público en Zaragoza.

La empresa cuyo lugar de origen es un pueblo del Pirineo aragonés, Aínsa, ha tenido un crecimiento desde el año 2008 espectacular, teniendo una plantilla actual de más de 80 personas.

Mi tarea principal era cambiar por completo la imagen de la web, logrando un diseño actual y moderno centrado en el usuario que compitiera con gigantes de la competencia como Booking, Atrápalo, Destinia, Logitravel…

Aquí podéis ver el diseño que tenía la home cuando entré:

CDR home

El cambio ha sido constante e incremental, realizando entrevistas a stakeholders, pruebas con usuarios, wireframings, muchas reuniones, estudios de mercado y análisis de la competencia, pruebas de diseño…

Y es que aparte de las páginas que muestran información sobre las localidades y los hoteles, era igual de importante el listado de alojamientos cuando el usuario realiza una búsqueda, el proceso de reserva, y toda las páginas relacionadas con la parte interna de «Mis reservas», como modificar una reserva, como anularla…

Así mismo se consiguió una gran mejora en posicionamiento y en experiencia de usuario al lograr hacer cambios en la estructura y el orden de los contenidos para conseguir una web responsive, adaptada a todos los dispositivos. Esto como Coordinadora de Móviles fue algo decisivo a la hora de tomar decisiones.

Sigue leyendo

Diseño web Bilper Profesional

Diseño web tienda online

Diseño de la tienda online de Bilper Profesional para DoYourNet. La complejidad del proyecto residía en que había que juntar las 3 marcas que existían anteriormente en una misma, por lo que se decidió jugar con los colores del logotipo.

Se quería que la imagen de los productos fuera grande, a semenjanza de las tiendas de ropa.

Tienda online

Aquí vemos la página de producto de una de las líneas, donde el color marca en que sección de la tienda estas. Como los productos tienen nombres que al usuario no tienen porque sonarle, se ha remarcado en una línea inferior la categoría a la que pertenecen.

También remarcar los iconos para elegir el formato que se desea, el cual pasa a al color azul, una vez seleccionado.

Diseño página de producto

Diseño de una de las páginas del catalogo online, donde se puede visualizar como si fuera una revista:

Diseño página web catalogo

Y a continuación, vemos el diseño de algunos de los pasos del proceso de compra, donde se preocupó que fuera lo más sencillo para el cliente, y que pudiera ver en todo momento lo que tenía en la cesta.

Diseño carro compra

Carro compra web

Para ver la web: bilperprofesional.com.

Diseño web Salvelinus

Diseño web Zaragoza

Complejo proyecto en varios idiomas, donde se encargo a Factor_id el diseño y desarrollo de la nueva web de Salvelinus, una página que organiza viajes y cursos de pesca en los Pirineos, y en la Patagonia.

Por su complejidad se decidió su desarrollo en Drupal, contando con alojamientos en varios países para un mejor posicionamiento según el idioma.

Un estudio de diseño cambió el logotipo, además de establecer las tipografías a usar. Como meta teníamos trasmitir la gran calidad del servicio ofrecido por SALVELINUS a sus clientes, mostrando para ello ejemplos reales de testimonios de clientes y la gran colección de impresionantes imágenes de los viajes de pesca.

Se decide comenzar por 5 sliders iniciales, que muestran los 4 bloques principales de navegación:

Diseño de paginas web

A resaltar el menú enriquecido para cada sección, con sus diferentes elementos: arriba la galería de la sección, a la izquierda las páginas principales, en medio una columna de viajes destacados, y a la derecha un espacio para promociones.

Diseñador web zaragoza

Tal es la cantidad y diversidad de contenido que disponemos de varias páginas internas, según el contenido.

En un principio cada sección iba a tener un fondo difuminado de un color diferente para indicar al usuario donde se encontraba, pero al final se eligió un único fondo.

En las páginas de tipo «viaje de pesca o curso», lo importante era mostrar las imágenes del viaje y que el usuario se pusiera en contacto:

Paginas web zaragoza

Y otra para los contenidos que no sean viajes o cursos, además de diferentes páginas para las publicaciones que hablan sobre SALVELINUS, los formularios de contacto, las galerías de cada sección, el blog…

Diseño zaragoza

Se decidió darle un toque diferente a la página de error (404), intentando conseguir una sonrisa al usuario con el mensaje «Upps!! Parece que nos has pescado nada» y mostrando las diferentes opciones para seguir con la navegación.

Diseño pagina error 404

Las imágenes no corresponden exactamente con la web actual, ya que luego se han ido haciendo pequeñas variaciones, por lo que mejor ver la web en directo, y sus impresionantes imágenes.

Para no perdérselo! www.salvelinus.es