Seleccionar página

CIRCE

La web estatal para la creación de empresas

rediseño de Crice

¿Por qué rediseñar Circe?

Muchas webs gubernamentales no cuentan con una buena experiencia de usuario a pesar de que nos veamos obligados a usarlas. Con el objetivo de mejorar alguna de ellas me centro en Circe, portal web donde podemos crear nuestra empresa con un sólo documento. Aunque la propuesta es tentadora, evitarnos desplazamientos y colas, el problema es que la web no guía al usuario en el proceso, generándole confusión y, por tanto, bloqueando el fin que se propone.

Seguro que hay miles de webs que mejorar, pero ésta me parecía un auténtico desafío y aquí os presento la evolución en cuatro semanas de trabajo.

Research

Este es el estado de la web de Circe en el momento de la investigación.

pagina actual Circe
  • Gran cantidad de información repetida tanto en la home como en las páginas interiores.
  • Toda esta cantidad de contenido está desorganizado, haciendo imposible una navegación fluida.
  • El objetivo principal de la web es ayudar al usuario a crear su empresa, para lo cual debe rellenar un documento casi imposible de localizar. 

Como la creación de una empresa es un proceso complicado y al mismo tiempo puede resultar tedioso, quiero ver como lo tratan las webs de otros países. Además de inspirarme en ellas para dotar al rediseño de un toque más amigable y distendido. Las que os muestro a continuación son: www.gov.uk, www.ge.com, www.nebraska.govtoolkit.climate.gov y www.hioscar.com.

empathy map y proto journey circe
Quiero confirmar mis observaciones y extraer más datos con los actuales usuarios o aquellos potenciales.
encuestas y entrevistas para el rediseño de Circe.es
Las encuestas y entrevistas me aportan muchos datos, algunos confirman mis hipótesis y otros revelan nuevos enfoques en los que no había pensado. Los organizo en un affinity diagram.
affinity diagram
 Extraemos las conclusiones y vamos profundizando mediante un mind map y problem statement.
mind map y problem statement
Todos los ejercicios anteriores confirman el planteamiento inicial y me ayudan a identificar lo que necesitan los usuarios. A los cuales podemos conocer ya.
Identificamos quiénes son nuestros user persona, desde el nuevo emprendedor que por primera vez inicia el proceso hasta el usuario habitual que podría usar Circe todas las semanas. Recordamos que son personajes que creamos con las características de nuestros usuarios.
user persona

Mediante los empathy maps, customer journey y storyboards conocemos mejor a nuestros usuarios e identificamos los puntos de fricción de CIRCE.

empathy map y proto journey circe

Definimos e ideamos

Llegó la hora de plasmar toda la investigación en las funcionalidades que le daremos a nuestra nueva web. Los user stories nos ayudan a ello.

user stories circe

A veces tenemos ya ideas de cómo plasmar en las pantallas nuestras funcionalidades, pero siempre hay más formas de representarlo. Una buena manera de conocerlas es exprimiendo la mente con uno o varios crazy 8.

crazy 8 circe
Lo más importante de este rediseño ha sido la arquitectura de la información. La web tenía contenido duplicado en la home y páginas secundarias, además de colocar ciertos contenidos en lugares no relacionados con la temática tratada. Por eso era esencial tener un site map muy definido.
site map circe
Una vez tenemos la estructura de la web podemos empezar a definir nuestras pantallas en baja fidelidad. ¿Cuál es el mejor modo? El sketching con rotulador y papel es una forma rápida y de bajo coste que nos servirá para testar con los usuarios. Además, de este modo no nos centraremos en aspectos poco prácticos para este momento del proyecto, como los colores, tipografía, imagen… Sólo nos interesa una buena estructura.
low fi wireframes
Ahora ya podemos continuar con el aspecto visual. Queremos seguir manteniendo la seriedad que conlleva la creación de un proyecto empresarial, pero con un tono más moderno y positivo que ayude a la lectura. Así queda nuestro moodboard:
moodboard circe

Otra opción es realizar wireframes de fidelidad media. En ellos podemos destacar en color el call to action, pero seguimos sin añadir detalles como colores, fotos, degradados, sombras, etc.

mid fi wireframes

El último paso es añadir el look final a nuestra web app y la interacción. Así obtenemos nuestro prototipo final con el que poder testear a los usuarios para realizar los cambios necesarios antes de lanzarlo.

Otros proyectos