Espejo Ciudadano - Dashboard de Percepción Ciudadana

Plataforma interactiva R Shiny para visualización de datos cívicos de Ciudad Juárez

R Shiny
Dashboard
Análisis de Encuestas
Visualización de Datos
Gobierno
Autor/a

Frank Leyva

Fecha de publicación

1 de enero de 2024

Resumen Ejecutivo

Espejo Ciudadano es un dashboard interactivo de R Shiny desarrollado para Así Estamos Juárez que visualiza datos de percepción y participación ciudadana en Ciudad Juárez. La aplicación presenta resultados de encuestas a través de múltiples áreas temáticas incluyendo gobierno, bienestar, infraestructura, participación y planeación urbana, permitiendo a los ciudadanos explorar indicadores de calidad de vida de manera intuitiva y accesible.

🔗 Sitio en Vivo: asiestamosjuarez.org

Contexto del Proyecto

Organización Cliente

Así Estamos Juárez es una iniciativa de monitoreo cívico que recopila y analiza datos sobre calidad de vida en Ciudad Juárez. La organización realiza encuestas anuales de percepción y participación ciudadana para generar evidencia que informe el diálogo público y la toma de decisiones.

Problemática

La organización necesitaba una plataforma digital que: - Democratizara el acceso a datos cívicos complejos - Permitiera comparaciones temporales (2023-2024) - Visualizara datos de encuestas y fuentes gubernamentales de manera integrada - Proporcionara una experiencia de usuario intuitiva para audiencias no técnicas - Escalara para manejar múltiples años y tipos de encuestas

Solución Técnica

Arquitectura de la Aplicación

Desarrollé una aplicación R Shiny modular de página única con las siguientes características:

Arquitectura del Sistema:
├── Frontend: R Shiny + Bootstrap 5.3.1
├── Backend: Procesamiento de datos en R
├── Base de Datos: SQLite para analytics
├── Despliegue: Docker + Traefik + Let's Encrypt SSL
└── Datos: Encuestas + Datos Gubernamentales (México)

Stack Tecnológico

Core: - R Shiny: Framework principal para la aplicación web interactiva - tidyverse: Manipulación y transformación de datos - ggplot2: Visualizaciones de datos de alta calidad - sf: Procesamiento de datos geoespaciales - leaflet: Mapas interactivos por distrito

Infraestructura: - Docker: Containerización para despliegue consistente - Traefik: Reverse proxy con SSL automático - Let’s Encrypt: Certificados SSL/TLS - SQLite: Sistema de analytics integrado

Análisis de Datos: - SPSS/Excel Import: Procesamiento de datos de encuestas - GeoJSON: Visualización de datos geográficos - memoise: Caching para optimización de rendimiento

Características Principales

1. Diseño Modular por Áreas Temáticas

La aplicación organiza la información en 5 áreas temáticas principales:

Calidad de Vida

Economía, recreación, identidad, medio ambiente, salud, educación

Movilidad Urbana

Transporte público, movimiento peatonal

Instituciones

Confianza, rendición de cuentas, representación, expectativas

Infraestructura

Servicios públicos, vivienda, instalaciones

Participación Cívica

Involucramiento comunitario y participación ciudadana

2. Sistema de Visualización de Datos

Tipos de Visualizaciones Implementadas: - Gráficas de barras comparativas por distrito - Series temporales para análisis de tendencias - Mapas coropléticos interactivos con Leaflet - Tableros de indicadores con métricas clave - Distribuciones de frecuencia para datos categóricos

Ejemplo de código para visualización:

# Sistema de clasificación automática de preguntas
question_classifier.R detecta tipo de pregunta
→ Routing a módulo apropiado (bar_chart, map, time_series)
→ Aplicación de tema visual consistente
→ Pre-caching de resultados para rendimiento

3. Integración de Datos Múltiples

La aplicación integra: - Datos de Encuestas: Percepción ciudadana (PER_2023, PER_2024) - Datos de Participación: Involucramiento cívico (PAR_2023, PAR_2024) - Datos Gubernamentales: Estadísticas oficiales de México - Datos Geográficos: Límites de distritos en formato GeoJSON

4. Sistema de Analytics Integrado

Desarrollé un sistema de analytics personalizado para rastrear uso:

AnalyticsManager Class:
├── Rastreo de sesiones con análisis de duración
├── Métricas de engagement por sección
├── Logging de interacciones de usuario
├── Estadísticas de uso diario
└── Capacidades de exportación de datos

Triggers de Analytics: - Teclado: Ctrl+Shift+A - UI: Triple-click en título “Vista Rápida” - Consola: Función showAnalytics()

5. Optimización de Rendimiento

Estrategias Implementadas: - Caching extensivo: Uso de memoise para operaciones costosas - Pre-computación: Plots y porcentajes almacenados como .rds - Carga en background: Pre-carga asíncrona de datos - Gestión eficiente de datos: data_manager.R optimiza carga - Procesamiento multi-core: Limitado a 4 cores en Docker

Visualizaciones del Proyecto

Dashboard principal

Vista principal del dashboard

Mapas interactivos

Visualización de mapas interactivos

Análisis distrital

Análisis por distrito

Series temporales

Comparaciones temporales

Desafíos Técnicos y Soluciones

Desafío 1: Arquitectura Modular Escalable

Problema: Necesidad de agregar nuevos temas y años sin refactorización mayor

Solución: Implementé sistema modular con pares *_ui.R / *_server.R:

R/
├── wellness/wellness_ui.R + wellness_server.R
├── government/government_ui.R + government_server.R
└── [Nuevos módulos siguen el mismo patrón]

Desafío 2: Configuración Multi-Encuesta

Problema: Diferentes encuestas usan nombres de columnas y codificaciones distintas

Solución: Creé survey_config.R con mapeos centralizados:

survey_config.R:
├── Mapeos de columnas (distrito, género, edad)
├── Mapeos de valores categóricos
└── Configuraciones específicas por encuesta

Desafío 3: Rendimiento con Datos Grandes

Problema: Tiempo de carga lento con cálculos en tiempo real

Solución: Pipeline de procesamiento en 3 etapas:

1. Pre-procesamiento → data/processed/ (CSV)
2. Pre-computación → data/plots/ (.rds)
3. Caching en memoria → memoise + data_manager

Desafío 4: Despliegue Seguro en Producción

Problema: Necesidad de HTTPS, SSL, y monitoreo

Solución: Stack completo con Docker:

docker-compose.yml:
├── Shiny App Container (Puerto 3838)
├── Traefik Reverse Proxy
├── Let's Encrypt SSL automático
└── Configuración de headers de seguridad

Pipeline de Datos

graph LR
A[Datos Crudos<br/>Excel/SPSS] --> B[Limpieza<br/>CSV]
B --> C[Clasificación<br/>question_classifier]
C --> D[Visualización<br/>Pre-computada]
D --> E[Presentación<br/>Módulos UI]
  1. Datos Crudos: Archivos Excel/SPSS en data/raw/
  2. Procesamiento: Limpieza y clasificación
  3. Datos Procesados: CSVs limpios en data/processed/
  4. Visualización: Plots pre-computados almacenados como .rds
  5. Presentación: Componentes UI modulares presentan los datos

Código de Ejemplo

Clasificación Automática de Preguntas

# question_classifier.R
classify_question <- function(question_data) {
  if (is_geographic(question_data)) {
    return(list(type = "map", module = "map_module"))
  } else if (is_temporal(question_data)) {
    return(list(type = "timeseries", module = "timeseries_module"))
  } else if (is_categorical(question_data)) {
    return(list(type = "bar", module = "bar_chart_module"))
  }
}

Sistema de Analytics

# analytics.R
AnalyticsManager <- R6Class("AnalyticsManager",
  public = list(
    log_interaction = function(session_id, section, action) {
      dbWriteTable(conn, "interactions", data.frame(
        session_id = session_id,
        section = section,
        action = action,
        timestamp = Sys.time()
      ), append = TRUE)
    },

    get_section_metrics = function() {
      dbGetQuery(conn, "
        SELECT section, COUNT(*) as visits,
               AVG(duration) as avg_duration
        FROM sessions
        GROUP BY section
      ")
    }
  )
)

Resultados e Impacto

Despliegue Exitoso: Sitio en vivo en asiestamosjuarez.orgExperiencia de Usuario: Interfaz intuitiva accesible para audiencias no técnicas ✅ Rendimiento: Tiempos de carga rápidos con datos pre-computados y caching ✅ Escalabilidad: Arquitectura modular soporta múltiples años y tipos de encuestas ✅ Seguridad: HTTPS con SSL automático vía Let’s Encrypt ✅ Analytics: Sistema de rastreo proporciona insights de uso

Métricas de Rendimiento: - Tiempo de carga inicial: < 3 segundos - Interacción con visualizaciones: Instantánea (pre-cached) - Soporte multi-dispositivo: Desktop, tablet, móvil - Disponibilidad: 99.9% uptime con Docker

Trabajo Futuro y Mejoras Potenciales

Habilidades Técnicas Demostradas

Este proyecto showcasea competencia en:

Desarrollo R Shiny Aplicaciones web interactivas, diseño modular, optimización de rendimiento

Ciencia de Datos Análisis de encuestas, visualización de datos, integración de fuentes múltiples

DevOps & Deployment Docker, Traefik, SSL/TLS, CI/CD, gestión de infraestructura

Análisis Geoespacial Procesamiento GeoJSON, mapas Leaflet, análisis por distrito

Arquitectura de Software Diseño modular, gestión de estado, separación de responsabilidades

Bases de Datos SQLite, diseño de esquemas, queries optimizadas, analytics

Conclusión

El proyecto Espejo Ciudadano representa mi capacidad para desarrollar aplicaciones de datos del mundo real que sirven al interés público. Al combinar análisis de datos de encuestas, integración de datos gubernamentales, visualización interactiva y despliegue moderno, creé una plataforma que empodera a los ciudadanos con información accesible y accionable.

Este proyecto demuestra no solo competencia técnica en R Shiny y ciencia de datos, sino también la capacidad de traducir requisitos complejos de stakeholders en soluciones de software robustas, escalables y centradas en el usuario.


Tecnologías: R Shiny, Docker, Traefik, ggplot2, leaflet, SQLite, Bootstrap, GeoJSON Repositorio: Privado (cliente) Sitio en Vivo: asiestamosjuarez.org Cliente: Así Estamos Juárez - Iniciativa de Monitoreo Cívico