Rediseño de Aldeas Infantiles

Proyecto Individual

Me propuse rediseñar un sitio web o aplicación gubernamental sin fines de lucro. Elegí el sitio web de la ONG Aldeas Infantiles. Para quienes no conocen su trabajo, Aldeas Infantiles se ocupa de niños y jóvenes vulnerables en 134 países, entre ellos Perú.

1 . Desafío

Un sitio web con demasiada información a primera vista, con contenido duplicado y sin jerarquía que dificulta la navegación y consigue un usuario confuso que no encuentra lo que quiere.

2 . Investigación

Las encuestas y las entrevistas fueron decisivas para obtener información. De los encuestados:

• 63% colaboran con ONG (26% como socios, 15% como donantes, 15% como voluntarios y 5% como patrocinadores)

• 84% colaboraría a través de la web

• El 58% conocía las ONG Aldeas Infantiles, pero solo el 5% conocía su web

Las entrevistas determinaron que los usuarios quieren información con resultados, transparente, clara y confiable, con gráficos super visuales. Haz que sea muy simple de usar, con una imagen para transmitir, hazlo fácil y rápido para lograr tus objetivos. Aquí los datos organizados en un diagrama de afinidad .

Creación de 3 posibles usuarios para nuestra web, las Personas de Usuario y yo nos centramos en Rosa la dudosa para continuar con el proceso, porque entre nuestros objetivos está el rediseño web, pero también una mayor conversión de donaciones en línea.

Para entrar en su piel usé el mapa de empatía .

Para ver la interacción del usuario con la web y detectar los puntos de fricción que debo resolver, utilicé el viaje de usuario .

Busqué referencias del alcance, como Traperos de Amaus, ADRA Perú, Cáritas, CARE, Perú Champs . Buscando inspiración en la navegación, la página de inicio, el proceso de donancion.

3 . Arquitectura de la información

Una vez que se establecieron estos puntos, usé crazy8 para obtener tantas soluciones como fuera posible.

Utilicé el mapa del sitio para jerarquizar y organizar el contenido de la nueva web.

Así llegué al Concept Sketching de las páginas principales, donde los elementos fueron eliminados y jerarquizados y otros reubicados, lo que resultó en una página más actual y legible, con menos información en la primera capa, más ordenada y más fácil de leer.

Y desarrolle wireframes de baja fidelidad .

4 . Diseño

El moodboard busca lograr un ambiente acogedor, cálido y hogareño, con formas redondeadas y colores complementarios con el azul existente que proviene de la imagen corporativa. Tipografía muy limpia, Work Sans y San Francisco .SF NS Text

En resumen, el moodboard final se vería así:

Y de aquí obtengo la paleta de colores y las fuentes tipográficas para la maqueta.

5 . Prototipos

Y este es el resultado final versión móvil de la remodeladas Aldeas Infantiles SOS.

Ver prototipo aquí