

PARK planner es una herramienta digital que conecta a ciudadanos y profesionales de la planificación urbana para decidir no solo dónde hace falta un parque, sino qué tipo de parque se necesita y para qué. A través de una app móvil y una plataforma web complementaria, permite superponer capas de información territorial, evaluar criterios técnicos y facilitar la participación comunitaria con base en datos reales, tomando decisiones informadas y colaborativas sobre el espacio público, integrando herramientas para evaluar el entorno urbano, los requerimientos normativos y las prioridades sociales de los barrios.

ROL
UX Design, User Research, Information Design
HERRAMIENTAS
Figma, Wireframing, Adobe Suite, User Interview, Research, Prototyping
DURACIÓN
5 semanas
PROBLEMA
En muchas ciudades, la identificación de la necesidad de un parque se limita a reconocer su ausencia, sin considerar qué tipo de parque se requiere ni para qué propósito. Además, las herramientas existentes para la planificación urbana carecen de acceso intuitivo a información técnica, normativa y participación ciudadana. Esto genera procesos fragmentados, decisiones poco contextualizadas y escasa articulación entre los actores involucrados.
SOLUCIÓN
OBJETIVOS
Park Planner propone una solución dual:
-
Una app móvil donde tanto ciudadanos como planificadores pueden generar solicitudes de nuevos parques, aportando información desde sus necesidades o conocimientos técnicos.
-
Una página web complementaria, dirigida principalmente a planificadores, que permite cargar archivos técnicos, consultar mapas oficiales y acceder a normativa especializada.
-
Facilitar una planificación urbana más inclusiva y contextual.
-
Unificar criterios ciudadanos y planificadores técnicos para la creación de espacios públicos.
-
Aprovechar datos abiertos e institucionales para una visualización clara y estratégica del territorio.
-
Incentivar la participación ciudadana como detonante de transformación urbana sostenible.
Investigación de usuarios
Para entender mejor identifico dos usuarios clave: CIUDADANOS que quieren transformar su entorno a través de un parque y PLANIFICADORES técnicos que ejecutan este tipo de proyectos, analizando sus deseos, expectativas y necesidades y cómo planificadores y ciudadanos se relacionan con la creación de nuevos parques. Realicé entrevistas, mapas de empatía y análisis comparativo de plataformas existentes. Descubrí que, aunque comparten el interés por transformar su entorno urbano, sus necesidades y niveles de acceso a información son muy distintos.
Los ciudadanos desean participar activamente en la mejora de su barrio, pero se enfrentan a barreras como procesos poco claros o la falta de visibilidad sobre el estado de sus solicitudes. Por otro lado, los planificadores técnicos trabajan con información dispersa y herramientas poco integradas, lo que dificulta tomar decisiones informadas y sustentadas.
Estos hallazgos destacaron la necesidad de una herramienta que conecte lo técnico con lo comunitario: una plataforma que facilite la toma de decisiones estratégicas para los planificadores y que permita a los ciudadanos participar activamente, con transparencia y acompañamiento.
PUNTOS DÉBILES
El proceso para proponer un parque no es claro, lo que limita la participación activa.
Guía
Los planificadores deben consultar diferentes plataformas para obtener datos relevantes, lo que hace lento el análisis.
Información
Entre actores no existen herramientas que articulen propuestas ciudadanas con procesos técnicos de planeación.
Desconexión
No hay orientación clara sobre qué parque conviene según el contexto urbano y ambiental.
Definir
Los usuarios no pueden ver fácilmente el estado o avance de sus solicitudes.
Trazabilidad
desarrollo de PERSONA
Para abordar el diseño de PARK planner, fue fundamental comprender que existen dos tipos de usuarios con necesidades y motivaciones muy distintas: por un lado, los CIUDADANOS que usarán los parques (beneficiarios), y por otro, los PLANIFICADORES, técnicos encargados de planificar y ejecutar los proyectos urbanos.
Esta dualidad de usuarios exigía diseñar experiencias diferenciadas tanto en la app como en la plataforma web, equilibrando la participación ciudadana con el rigor técnico de los procesos de planeación. A partir de entrevistas y mapas de empatía, desarrollé dos perfiles representativos que guiaron la toma de decisiones durante el proyecto.
PLANIFICADORA - Paula es una diseñadora urbana de 30 años que trabaja en una entidad pública en Bogotá. Desde su rol como ingeniera civil con especialización en diseño urbano, está comprometida con mejorar el acceso y la calidad del espacio público en su ciudad. En su día a día, enfrenta desafíos como la falta de herramientas para evaluar de forma eficiente el territorio, la dificultad de integrar participación ciudadana sin retrasar los proyectos, y la poca articulación entre entidades gubernamentales.
Crear un mapa de recorrido del usuario para Paula permitió entender sus necesidades en cada etapa del proceso técnico: desde la identificación de áreas críticas hasta la justificación normativa de una propuesta. Su experiencia resalta la importancia de una plataforma que le permita superponer información territorial, explorar diferentes tipos de parques y tomar decisiones fundamentadas que beneficien realmente a la comunidad.
CIUDADANO - Juan es un administrador de 49 años que vive con su esposa y sus hijos adolescentes en una zona densamente poblada de Bogotá. Aunque su trabajo es administrativo, ha desarrollado un fuerte interés por cómo los parques influyen en la calidad de vida del barrio. Le preocupa el deterioro de los espacios verdes existentes y la falta de lugares adecuados para el esparcimiento familiar.
Al analizar el recorrido de Juan como usuario, descubrí que sus principales frustraciones están relacionadas con la falta de participación en los procesos de planeación, la mala distribución de parques en la ciudad y la dificultad para ser escuchado por las entidades. Su caso evidencia la necesidad de una herramienta accesible y clara que le permita proponer zonas donde hacen falta parques y entender cómo avanza una solicitud, haciendo de su experiencia como ciudadano algo más activo y efectivo.
Diseño y Concepto
El diseño de PARK planner partió de la necesidad de conectar datos urbanos, participación ciudadana y procesos técnicos de planificación en una plataforma accesible y útil para todos los usuarios. Se desarrolló una arquitectura de información clara que distingue entre los flujos de los ciudadanos y los planificadores, adaptando cada experiencia según sus objetivos y nivel de conocimiento.
Para los ciudadanos, la interfaz permite proponer nuevos parques mediante un proceso guiado, visual e intuitivo. Para los planificadores, se diseñó una experiencia más técnica que facilita el análisis de datos, la evaluación de terrenos y la toma de decisiones basada en evidencias.
El concepto visual equilibra simplicidad y profundidad, utilizando mapas interactivos, filtros contextuales y visualizaciones comparativas. El sistema de diseño incorpora íconos claros, paletas amigables inspiradas en la naturaleza y elementos visuales que refuerzan la confianza y la comprensión. Además, se implementó un enfoque responsive para asegurar que la plataforma funcione de manera óptima en dispositivos móviles y de escritorio, facilitando el acceso desde cualquier lugar.
El diseño busca facilitar la toma de decisiones informadas, fomentar la participación activa y promover el desarrollo de parques que respondan realmente a las necesidades de cada comunidad.

Iteraciones para Home con posibles componentes para la página web

Componentes

Página web
PROTPTIPO lo-fi
Se diseñaron prototipos de baja fidelidad para estructurar los flujos de navegación y establecer la jerarquía de información de PARK Planner. Dado que la herramienta atiende a dos perfiles distintos —planificadores urbanos y ciudadanos—, los prototipos ayudaron a definir un recorrido claro y específico para cada uno, asegurando que la experiencia respondiera a sus necesidades y nivel de conocimiento técnico.
En el caso de los ciudadanos, el flujo se enfocó en facilitar la propuesta de nuevos parques de forma lineal intuitiva, guiando paso a paso desde la identificación de la necesidad hasta el seguimiento del proyecto. Para los planificadores, se diseñó un flujo más técnico que permite analizar datos, comparar ubicaciones y justificar decisiones con base en evidencia.
Estos prototipos permitieron validar la estructura inicial, identificar oportunidades de mejora y garantizar una experiencia fluida antes de pasar a etapas de diseño de mayor fidelidad.
Se incluyeron señales visuales como indicadores de progreso, resaltado de la etapa activa y mensajes informativos que acompañan al usuario durante su recorrido. Esto mejora la orientación y reduce la fricción durante el uso de la herramienta.
Retroalimentación visual y navegación guiada
En cada flujo, las pantallas priorizan el objetivo clave: en el caso del ciudadano, visibilizar la propuesta de parque; en el del planificador, facilitar el análisis técnico y la toma de decisiones informadas.
Enfoque en el objetivo principal
Cada flujo fue organizado con encabezados informativos, navegación lateral o superior según el usuario, y una estructura central orientada a la acción principal: proponer o evaluar un nuevo parque.
Jerarquía visual clara








Se desarrollaron prototipos de baja fidelidad para estructurar el sitio web de PARK planner, concebido como una plataforma complementaria a la app móvil. Su objetivo principal es ofrecer herramientas más robustas a los planificadores urbanos y a las entidades encargadas del desarrollo de espacios públicos, permitiendo un trabajo más detallado y técnico.
A diferencia de los primeros wireframes de la app, este prototipo ya contaba con componentes visuales consolidados. Gracias al avance en la construcción del Design System, fue posible aplicar desde el inicio la tipografía definida, el logo oficial, paleta de color, animaciones básicas y estructuras visuales coherentes con el resto del producto digital. Esto permitió que, aun en baja fidelidad, el sitio web ofreciera una experiencia visual más sólida y representativa del producto final.
El diseño del sitio web se centró en facilitar la carga y consulta de archivos especializados, explorar solicitudes existentes mediante filtros avanzados, y acceder a documentación normativa relevante. Además, se integró una sección informativa para nuevos usuarios, con el fin de explicar cómo funciona la herramienta y su impacto potencial en la planificación urbana.


Interfaz más cercana a la versión final, íconos explicativos, bloques bien definidos, y una navegación clara que favorece el trabajo técnico sin perder la coherencia del ecosistema Park Planner.
Consistencia visual con la app
Menú lateral con acceso rápido a secciones clave. Se organizó la interfaz en columnas que separan la navegación, el área de trabajo y los detalles del contenido consultado.
Estructura técnica y funcional





Sitemap y Flujo de Usuario
La arquitectura de la información de PARK planner se construyó en función de las necesidades, roles y objetivos específicos de sus dos perfiles principales: PLANIFICADORES y CIUDADANOS. La plataforma se divide en dos entornos complementarios (app y sitio web), ambos diseñados bajo un sistema modular, coherente y escalable que garantiza la navegación fluida, la jerarquía clara y la eficiencia en la experiencia de uso.
APP PARK planner
La app es el núcleo operativo para ambos perfiles de usuario. Se organizó con una estructura que permite acceder rápidamente a acciones clave, adaptando el contenido y la interacción según el rol.
PLANIFICADOR
El flujo de usuario para el PLANIFICADOR en la app está diseñado para optimizar la planificación de nuevos parques mediante un sistema guiado, técnico y escalable. Tras el inicio de sesión, el usuario accede a un panel con acciones claras que permiten crear un nuevo proyecto, analizar solicitudes ciudadanas o revisar proyectos en curso.
En el flujo de creación de proyectos, el planificador inicia seleccionando una ubicación geográfica sobre un mapa interactivo, eligiendo la tipología de parque sugerida automáticamente según la escala urbana (metropolitano, urbano, vecinal, de bolsillo). Luego, personaliza el parque según su propósito (ecológico, recreativo, deportivo, cultural, etc.) y ajusta variables urbanas relacionadas con normativas, movilidad, densidad y morfología.
El sistema le permite sobreponer capas de información urbana, como mapas de densidad poblacional y uso de suelo, para tomar decisiones fundamentadas. Finalmente, puede generar un informe automatizado que será enviado para revisión y seguimiento por parte de entidades reguladoras.


CIUDADANO
El flujo para usuarios CIUDADANOS está enfocado en simplificar la participación comunitaria y democratizar la propuesta de nuevos parques. Luego de registrarse con sus datos personales, el ciudadano puede iniciar una solicitud desde la opción principal.
El flujo inicia con la selección de una ubicación en el mapa, seguido por la elección del tipo de parque y los equipamientos deseados. El sistema le permite justificar su solicitud añadiendo comentarios y razones de relevancia para la comunidad.
Posteriormente, el usuario puede hacer seguimiento a su propuesta, recibir notificaciones sobre su estado, y participar en módulos de interacción como encuestas y foros comunitarios. Este flujo fue diseñado para ser inclusivo, claro y fomentar la participación ciudadana desde una experiencia móvil accesible.

WEB PARK planner
El sitio web complementa la experiencia móvil ofreciendo un entorno más robusto para la consulta técnica, exploración documental y análisis de datos. También permite a los ciudadanos interactuar, ampliar información sobre los parques, su importancia, beneficios y forma de implementación y mantenerse informados.
PLANIFICADOR
En la versión web, el planificador accede a una plataforma más robusta con funciones ampliadas para gestión de datos, carga de archivos técnicos y análisis detallado. Una vez autenticado, accede al Panel de Planificación, donde puede crear proyectos o consultar recursos normativos y técnicos.

El flujo permite cargar datos del Plan de Ordenamiento Territorial (POT), normas ambientales, informes urbanos y documentos geoespaciales, vinculando esta información con proyectos en curso. También puede revisar solicitudes ciudadanas con filtros de análisis y agregar observaciones directamente en el sistema.
La web está diseñada como un entorno de trabajo técnico para planificadores, integrando funcionalidades de edición, documentación colaborativa y generación de reportes consolidados para aprobación institucional.
CIUDADANO
El flujo web para el ciudadano está pensado como un complemento participativo e informativo a la experiencia móvil. Desde el sitio, los ciudadanos pueden consultar el estado de su solicitud, acceder a foros de discusión y participar en encuestas abiertas.
Además, pueden explorar solicitudes colectivas en un mapa interactivo, participar con votos o comentarios, y conocer cómo avanzan los proyectos en su zona. También tienen acceso a una sección educativa sobre los beneficios de los parques y el rol de la ciudadanía en la planificación urbana.
La web brinda transparencia al proceso, permite mayor profundidad en la interacción y promueve el seguimiento constante desde una experiencia accesible y amigable.

Estudio de usabilidad
Se realizaron dos rondas de estudios de usabilidad para evaluar la eficiencia, claridad y accesibilidad de PARK Planner, en diferentes niveles de fidelidad del prototipo. Estas pruebas se llevaron a cabo con usuarios representativos de los dos perfiles principales: PLANIFICADORES técnicos y CIUDADANOS beneficiarios, lo cual permitió contrastar necesidades, lenguaje y expectativas.
La primera ronda se centró en prototipos de baja fidelidad tanto de la app como de la web, permitiendo identificar fricciones en los flujos, puntos críticos de interacción y ajustes en la jerarquía visual. En la segunda ronda, se testearon prototipos de alta fidelidad con componentes más cercanos al producto final, poniendo a prueba el entendimiento de funcionalidades avanzadas como la interacción con mapas y las capas de información, la carga de capas urbanas y la participación ciudadana.
Descubrimientos de la Ronda 1
Complejidad en flujos técnicos
Los usuarios planificadores encontraron útil el nivel de detalle en la creación de proyectos, pero sugirieron una mayor guía visual para entender la secuencia lógica de pasos (ubicación, tipología, normativas, modelado, informe).
Descubrimientos de la Ronda 2
Mejor recepción del sistema de capas
Los planificadores valoraron positivamente la integración de mapas interactivos y la superposición de datos urbanos. Sin embargo, sugirieron íconos más intuitivos y una leyenda expandible.
Retroalimentación visual insuficiente
En la versión lo-fi, no existían señales visuales claras que confirmaran acciones completadas, como el envío de una solicitud o el paso al siguiente nivel del flujo de planificación.
Interés en visualizaciones predictivas
Planificadores manifestaron que una función de simulación de impacto visual o estimaciones automáticas sobre afluencia, vegetación o servicios públicos sería de gran valor agregado.
Lenguaje técnico poco accesible
Los beneficiarios ciudadanos señalaron que algunos términos urbanos o geoespaciales no eran claros, lo que limitaba su comprensión y autonomía durante la solicitud de nuevos parques.
Necesidad de personalización visual
Los usuarios destacaron la necesidad de que la plataforma permita adaptar la interfaz a distintos contextos (por ejemplo, rural vs. urbano) para mejorar la pertinencia de las decisiones proyectuales.
Guía de estilo
La guía de estilo para PARK planner fue diseñada para evocar el carácter técnico, estructurado y preciso de los procesos de planificación urbana, con una estética inspirada en el mundo de la arquitectura e ingeniería. La paleta de colores transmite profesionalismo, estructura y acción: el verde oscuro #1B463B se utiliza como color principal para títulos, texto y botones clave, proyectando estabilidad y profundidad. Como color complementario y de alto contraste, el naranja vibrante #FF720D en lineas y palabras clave.
El fondo general es un tono neutro claro #EEEAE4, sobre el cual se despliega una línea de mapa urbano de Duitama (Colombia), ciudad escogida para los prototipos. Este mapa aporta contexto territorial y conecta visualmente al usuario con el entorno real. Además, el diseño recurre al uso de sombras y planos superpuestos para dividir secciones, simulando la lógica de las capas en planos técnicos.
La tipografía también juega un papel crucial en la identidad visual: Houstone Expanded se utiliza para los títulos por su fuerza visual y sentido de avance horizontal, evocando el dinamismo de los flujos dentro de la app. Para el cuerpo de texto, se emplea Reader Pro, una tipografía de trazo técnico que equilibra precisión con legibilidad, ideal para representar contenido urbano y de datos.
Los íconos siguen un estilo de línea continua y formas planas, como si fueran trazos de un plano arquitectónico, reforzando la noción de lectura técnica. Finalmente, las transiciones y animaciones se diseñaron para simular el cambio de capas o planos, como cuando un ingeniero revisa distintas secciones de un proyecto: un gesto visual que refuerza la estructura del sistema y permite al usuario "leer" el espacio urbano desde distintas dimensiones.

Prototipo hi-fi
Luego de implementar los aprendizajes obtenidos en las rondas de estudios de usabilidad, se desarrolló el prototipo de alta fidelidad de PARK Planner, consolidando mejoras visuales, estructurales e interactivas tanto para la app como para la web. Las iteraciones se centraron en reforzar la jerarquía visual, facilitar la navegación entre secciones técnicas y ciudadanas, y optimizar los flujos según el perfil del usuario (PLANIFICADOR o CIUDADANO).
Se integraron todos los componentes del sistema visual definidos en la guía de estilo: tipografías, colores, iconografía técnica, mapas urbanos de fondo y microinteracciones que simulan el cambio de planos, reforzando la metáfora visual del proyecto urbano. Los botones y tarjetas fueron refinados para ofrecer retroalimentación visual inmediata, mientras que las transiciones simulan capas superpuestas, tal como se haría en una lectura técnica de planos.

En la app móvil, se perfeccionaron los flujos tanto para la planificación técnica de nuevos parques como para la solicitud ciudadana, destacando las funciones clave como el mapa interactivo con capas urbanas, la selección de tipología de parque, el análisis normativo y la carga de información georreferenciada.

En la versión web, pensada especialmente para el perfil experto, se enfatizó el acceso a recursos técnicos, bibliotecas normativas y el seguimiento detallado de solicitudes ciudadanas con un enfoque más estructurado, visualmente claro y alineado con los procesos de planificación urbana.
Este prototipo de alta fidelidad permite simular con mayor realismo la experiencia de navegación completa del sistema, facilitando la validación final del diseño de interfaz, la estructura de contenido y el comportamiento de los flujos clave. Su resultado refuerza la visión de PARK Planner como una herramienta técnica pero accesible, que combina precisión institucional con participación ciudadana activa.


Navegación intuitiva y jerárquica
Tanto en la app como en la web, la arquitectura de la información está pensada para guiar al usuario de forma fluida y clara, diferenciando los flujos de navegación según su perfil. La estructura prioriza tareas clave como crear una solicitud, explorar tipologías de parque o consultar estados, utilizando una jerarquía visual clara y un sistema de menús accesible en todo momento.
Mapa interactivo con capas urbanas
El núcleo visual de la experiencia es un mapa de la ciudad que permite a los usuarios visualizar su entorno, identificar posibles ubicaciones para parques y superponer capas como densidad poblacional, accesibilidad o cobertura verde. Esta herramienta ayuda a fundamentar mejor cada solicitud y a tomar decisiones informadas sobre el uso del espacio urbano.


Flujos diferenciados por rol
PARK planner cuenta con flujos de usuario diseñados específicamente para ciudadanos y planificadores. El flujo ciudadano es directo, asistido y con lenguaje sencillo, mientras que el flujo técnico está orientado a usuarios expertos, ofreciendo control total sobre los datos, filtros avanzados y opciones de carga documental.
Diseño responsive y escalable
La plataforma está completamente adaptada para una experiencia fluida en dispositivos móviles y de escritorio. La app permite capturar solicitudes desde el terreno, mientras que la web potencia el trabajo técnico y colaborativo entre equipos. Ambas versiones comparten una estética basada en planos, capas y trazos urbanos, transmitiendo una identidad coherente.


Interacciones funcionales
Cada componente cuenta con animaciones sutiles que evocan el paso entre planos de arquitectura o ingeniería. Estas microinteracciones permiten al usuario identificar acciones clave, confirmar sus avances y explorar el sistema con una sensación de solidez y profesionalismo, sin sacrificar la accesibilidad.
Navegación intuitiva y jerárquica
Tanto en la app como en la web, la arquitectura de la información está pensada para guiar al usuario de forma fluida y clara, diferenciando los flujos de navegación según su perfil. La estructura prioriza tareas clave como crear una solicitud, explorar tipologías de parque o consultar estados, utilizando una jerarquía visual clara y un sistema de menús accesible en todo momento.

Consideraciones de Accesibilidad
Texto alternativo y semántica para lectores de pantalla
Todos los íconos lineales, botones interactivos y elementos visuales relevantes incluyen etiquetas descriptivas (textos alternativos) que facilitan su lectura por parte de tecnologías asistivas. Esto asegura que usuarios con discapacidades visuales o que utilicen lectores de pantalla puedan navegar por toda la plataforma sin perder información crítica.
Contraste alto y jerarquía visual clara
La combinación de un fondo neutro (#EEEAE4), texto en verde oscuro (#1B463B) y acentos en naranja (#FF720D) garantiza legibilidad en distintos niveles de visión. Se aplicó un sistema de jerarquía visual robusto que guía al usuario por medio de tamaños, pesos tipográficos y uso de color, facilitando la comprensión de cada sección, incluso en condiciones de baja visión.
Retroalimentación visual inmediata
Cada vez que se crea o edita una solicitud, se recibe retroalimentación inmediata mediante mensajes de confirmación, microanimaciones y cambios visuales en botones y campos. Esta retroalimentación brinda seguridad al usuario y reduce errores durante procesos críticos como la carga de documentos técnicos o selección de capas urbanas.


