# 09\_Rediseño de la web

Para el re-diseño de la web **empleo las columnas** que hemos **generado previamente** y además le he **añadido un ritmo vretical de 48px** y sus variantes (24px, 12px, etc)&#x20;

**El re-diseño soluciona todos los problemas detectados previamente** en el *desk research*, *workflow*, *layouts*, *tipografías* y *análisis visual*. Además se diseñan para los tres user persona definidos previamente. Dado que el **re-diseño es de una sola página** de Sanitas, he visto imprescindible, **mantener la esencia de la página** a través del color, la jerarquía visual, las secciones, etc. A su vez **gracias al&#x20;*****benchmarking*** he conseguido **analizar los puntos fuertes de la competencia** para poder **aplicarlo en el re-diseño.**

### Comentarios del diseño *top page*

* Me gustaba la **idea del cuadro médico** fuera realmente un cuadro, como tiene Sanitas actualmente.&#x20;
* He **reducido los textos** a lo más básico y **esencial para su comprensión** y así **bajar la carga cognitiva**.
* He **resuelto la falta de consistencia** en la "llamada para contratar". De una manera sencilla y directa, poniendo un ***underline*****&#x20;a "Te llamamos" como hipervínculo.**
* En "calcula tu seguro" ahora tiene su **peso visual** y a la vez genera **coherencia con los elementos** de su entorno, a su vez he establecido **jerarquía entre el apartado "Te llamamos" y calcula tu seguro**.
* Se **alivian los problemas de alineación** en toda la página.
* Se **mejora la affordance** de todos los **textos hipervínculo** mediante un ***underline*** (breadcrumps, etc)
* Se **simplifica el cuadro médico** eliminando opciones variadas para evitar confusión entre los user.
* Se **eliminan los problemas de consistencia** entre los **botones** de la página.
* Se mantiene la idea pero se **re-diseña el botón de "Activar ubicación"** con un **lenguaje más cercano**.
* **"Urgencias" cobra mayor importancia**, pasa a ser un **botón&#x20;*****CTA FIXED***. Con la intención de **dar una respuesta inmediata** a los user como Ángeles.
* Añado **otro botón&#x20;*****CTA FIXED*****&#x20;de feedback**, para que el usuario pueda comentar cada página en la que se encuentre. Crea una **comunicación directa entre user y la compañía**, así pueden avisar si algo de la web no funciona.
* Adjunto bajo el botón buscar la **opción de decargar el cuadro** médico en PDF, por si algún usuario prefiere algún método más tradicional.

![](https://3503706417-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MNDDxhk8pEs40l281Pv%2F-MNJb2c-Eq5pFnk1PuTt%2F-MNKZgdMUWAFF-hPdPhN%2FSanitas%20web%20top.png?alt=media\&token=9f8e878d-a549-44ac-b354-751f3a4f6cb5)

![](https://3503706417-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MNDDxhk8pEs40l281Pv%2F-MNJb2c-Eq5pFnk1PuTt%2F-MNKZjIHS9Yv37J_aqCS%2FSanitas%20web%20top%20sin%20guias.png?alt=media\&token=974fe91b-04cc-48b7-960e-19f2366456b9)

### Comentarios del diseño *middle page*

* He **mantenido el ritmo vertical** establecido en la página
* Para la sección de prueba diagnóstica he querido aligerar y proyectar los *drop-downs* sobre el fondo, **contrastando el espacio lleno/vacío** con el cuadro médico superior.
* He **eliminado la falta de consistencia** de la página **separando la notificación COVID**. Ahora se percibe el conjunto, la sección entera de prueba diagnóstica.
* He querido darle un **aire de modernidad** a la página diseñando una **notificación con un fondo tipográfico.** Es del **mismo tamaño** que la original pero ahora los elementos tienen sus espacios y sus márgenes.

![](https://3503706417-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MNDDxhk8pEs40l281Pv%2F-MNJb2c-Eq5pFnk1PuTt%2F-MNKZpPosj6jvBfe_TeK%2FSanitas%20web%20middle.png?alt=media\&token=6455767f-a4e9-4014-9c79-38c9a59ff5c8)

![](https://3503706417-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MNDDxhk8pEs40l281Pv%2F-MNJb2c-Eq5pFnk1PuTt%2F-MNKZrsKPMmQHktVQJH5%2FSanitas%20web%20middle%20sin%20guias.png?alt=media\&token=d0a66a86-e7f7-4e90-97a4-0eabe23663a5)

![](https://3503706417-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MNDDxhk8pEs40l281Pv%2F-MNJb2c-Eq5pFnk1PuTt%2F-MNK_GnhyImvhdrvcOrF%2FSanitas%20web%20top%20sin%20fab.png?alt=media\&token=03170369-5ba8-4579-ac99-69eed8335cd1)

![](https://3503706417-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MNDDxhk8pEs40l281Pv%2F-MNJb2c-Eq5pFnk1PuTt%2F-MNK_4koDYlmRQ1UAVkM%2FSanitas%20web%20middle%20sin%20guias.png?alt=media\&token=1aec0ec2-1a9a-470b-9e08-a8e38a94c58b)

{% file src="<https://3503706417-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MNDDxhk8pEs40l281Pv%2F-MNJb2c-Eq5pFnk1PuTt%2F-MNK_ayCWKB8cjaMpybv%2FSanitas%20web%20sin%20guias.png?alt=media&token=a7283e37-1fc4-4ccf-8d21-58ac917b4a57>" %}
Descarga la Imagen completa&#x20;
{% endfile %}
