C230 / Fundación IDEA

Diseño de interacción para firma de consultoría y fundación mexicana.

C230 es una firma mexicana especializada en crear insumos para la toma de decisiones de líderes en el sector público y privado; su oferta se centra en temas económicos, sociales, regulatorios, de política pública e innovación. Por su parte, Fundación IDEA fue uno de los primeros Think Tanks de Política Pública en México, contando con múltiples publicaciones en diversos temas como salud o justicia.

Como parte de su nueva estrategia de negocios, buscaron el rediseño de interacción de su sitios institucionales.

Cliente: C230 Consultores / Fundación IDEA.
Sector: Consultoría, Sociedad Civil.
Año: 2017..
Disciplinas: Experiencia de usuario, diseño de Interfaz, diseño de interacción, estrategia de innovación.
Actividades clave: Conceptualización, arquitectura de Información, wireframes, prototipado, Design System.
Equipo: Soluciones Digitales y Equipo de C230/ Fundación IDEA.

[fig 1] Parte del reporte del Design SPRINT interno realizado.

Definición

En conjunto con la coordinación del área de soluciones digitales, planteamos una ruta de diseño e innovación con un levantamiento información sustantiva tanto interna como externa.

La ruta crítica del proyecto se desarrolló en las siguientes etapas:

a) Levantamiento de información primaria sobre el estado actual del consorcio.
b) Mapeo de áreas, servicios, proyectos y capacidades generales.
c) Diseño, facilitación y documentación de un Design Sprint de 3 días con Directivos, Coordinadores y Analistas Senior del consorcio.
b) Entrevistas a profundidad con clientes y otros actores.
c) Propuestas de Diseño; Arquitectura de información del sitio, Wireframes, UX, UI y Design System.
d) Producción y mejora: Trabajo colaborativo interno para programación de sitios responsivos.

[fig 2] Lightning Demos, parte de la sesión del Design SPRINT realizado.

[fig 3] Primeros acercamientos de wireframes del sitio.

Ideación

Respetando la base de identidad de cada organización, retomamos los colores corporativos, voz y valores de comunicación; con lo anterior, diseñamos un conjunto de elementos de interfaz para centralizarse en una guía de estilo y posteriormente adaptados en un Sistema de Diseño básico.

[fig 4] Nuevos elementos de comunicación e identidad; ilustraciones, fotografías y símbolos.

Desarrollamos un prototipo de la Interfaz de usuarias y usuarios con los ajustes finales de retroalimentación basada en pruebas de usabilidad con equipo interno y externo.
Preparé y compartí con el equipo de desarrollo todos los elementos de estilo para las plataformas con sus especificaciones de color, dimensión y considerando resoluciones de dispositivos.

[fig 5] Pantallas desarrolladas para el sitio c-230.com

Ambos sitios comparten lenguajes de diseño y consistencia pero considerando el programa de necesidades de “jobs to be done” para cada perfil de personas usuarias de cada organización.