Diseño y Desarrollo de la Sección de Perfiles para la Red Social TODOS: Integración de Front-Backend y UX
Proponente(s):
Red TODOSCarreras afines:
Ciencias de la computaciónIngeniería AmbientalIngeniería industrial
Finalizado:
15-Nov-2025
Ubicación:
Logo Designer: Wilmar Andrés León; Developer: Josi Estiven Torres; Student: Juan Pablo Lamark
Créditos de la imagen: Screenshot de la página
Red TODOS
https://redtodos.com/esFecha de fundación: November 29, 2021Objetivos de desarrollo sostenible
- Periurbana
Zona
- Sector solidario y Tercer sector
Sector económico
- Corporación
Tipo de organización
Descripción
La plataforma TODOS un modelo de inteligencia social que busca agrupar y organizar conocimiento y habilidades técnicas humanas para generar el tipo de soluciones que las comunidades necesitan. Funciona como una red social, pero genera una conexión que va más allá de una lista de contactos, para unir a las personas a través de un sistema de participación orgánica que da soluciones a problemas comunes. Somos una organización dedicada al desarrollo de una plataforma que permite conectar personas y comunidades alrededor del mundo, que permita la rentabilidad de una económia que se base en el cuidado del otro y en el cuidado del medio ambiente. Buscamos promover una forma moderna de participación democrática que esté actualizada al contexto y a las necesidades de la sociedad tecnológica en la que vivimos.
Servicios
Red social para conectar iniciativas y oportunidades.
Banco de fotos, Diversa. Encuentro Retos Sergio Arboleda 2024-II
Opción de grado en Ingeniería Humanitaria
Universidad Sergio Arboleda
Carrera:
Ingeniería Industrial y Ambiental
Facultad:
Ingeniería
Docentes:
- Alejandro Ruiz Riaño, 2023
- Maritza Ruíz, 2024
- Mónica Gonzáles Gort, 2025-I
Descripción:
La Opción de Grado, está estructurada bajo la metodología de Aprendizaje Basado en Retos, donde el reto se define como una necesidad real de una fundación o comunidad en situación de vulnerabilidad económica, social o ambiental. El enfoque de trabajo orienta la dedicación de tiempo del estudiante a cocrear una solución que responda efectivamente al reto, dejando como entregables finales, el diseño y la apropiación de herramientas que garanticen el mantenimiento de la solución o de los avances.
Temas:
- Aprendizaje Basado en Retos
- Fortalecimiento de Negocios
- Medio ambiente
Pregunta orientadora
¿Cómo diseñar y desarrollar la sección de verificación de perfil, tanto en el frontend como en el backend de la red social “TODOS”, definiendo requisitos funcionales y no funcionales y los recorridos de experiencia de usuario más eficientes, para optimizar la navegación, la usabilidad y la interacción entre los usuarios y el sistema?
Ubicación: dónde se desarrolla este proyecto
Guasca, Cundinamarca, ColombiaPor qué es importante o relevante el proyecto
El concepto de inteligencia social se refiere a la capacidad humana para comprender y gestionar las relaciones de manera efectiva, permitiendo a las personas colaborar, empatizar y tomar decisiones de forma colectiva (Goleman, 2006). Dentro de este marco, la noción de la “sabiduría de las multitudes” sugiere que, cuando grupos diversos de personas aportan opiniones o conocimientos independientes para resolver un problema, el resultado agregado suele acercarse o incluso superar la precisión del juicio de un experto individual (Surowiecki, 2004). Este principio resalta el potencial del razonamiento colectivo y la toma de decisiones compartida como mecanismos para mejorar los resultados sociales y la gobernanza comunitaria.En el contexto de este proyecto académico, el objetivo es aprovechar esta inteligencia colectiva para determinar qué proyectos sociales o comunitarios deben recibir prioridad de financiación dentro de una población determinada. Al permitir que los ciudadanos expresen sus opiniones y evalúen iniciativas de manera colectiva, la red social “TODOS” busca democratizar la toma de decisiones y fortalecer la transparencia en la asignación de los recursos comunitarios.La etapa actual del proyecto se centra en el diseño y desarrollo de las secciones de perfil de usuario y perfil de proyecto de la plataforma “TODOS”. Estos entregables son esenciales por dos razones: (1) proporcionan los elementos de programación fundamentales que constituyen la base técnica de la red social, y (2) representan los pasos finales o esenciales hacia la creación completa del sistema “TODOS”. A través de estos desarrollos, la plataforma busca materializar los principios de la inteligencia social al facilitar la participación, la colaboración y la toma de decisiones colectivas informadas.
Reto: situación a cambiar, aprovechar o analizar durante tu proyecto
Actualmente, los procesos de toma de decisiones relacionados con la asignación de fondos comunitarios o sociales suelen estar centralizados, careciendo de transparencia y de una participación ciudadana significativa. Esta situación limita la inclusión de perspectivas diversas y reduce la eficiencia con la que se identifican y priorizan las necesidades colectivas. La red social “TODOS” busca transformar esta realidad aprovechando los principios de la inteligencia social y la sabiduría de las multitudes para crear un entorno digital participativo en el que las comunidades puedan evaluar, priorizar y promover colaborativamente proyectos que aborden desafíos sociales compartidos.La oportunidad radica en desarrollar una plataforma tecnológica que no solo empodere a las personas para crear y compartir sus propias iniciativas, sino que también aproveche la inteligencia colectiva para orientar la distribución de recursos de manera justa.
Objetivo principal de tu proyecto
Diseñar y desarrollar las funcionalidades de perfil de usuario para la red social “TODOS”, permitiendo a los usuarios crear exitosamente sus perfiles personales y cargar proyectos comunitarios o sociales dentro de un entorno de servidor local. Al lograr esta implementación, el proyecto busca establecer los componentes tecnológicos fundamentales que respaldarán el propósito general de la plataforma, aprovechando la inteligencia social y la sabiduría de las multitudes para determinar colectivamente las prioridades de financiación de las iniciativas comunitarias.
¿Cómo vas a lograr el objetivo?
1. La primera etapa consiste en la creación de una lista integral de requerimientos para las secciones de verificación de perfil de usuario. Este documento definirá las especificaciones funcionales y no funcionales necesarias para garantizar la calidad, la usabilidad y la alineación con el propósito previsto de la red social “TODOS”.2. Desarrollo y prueba del código, el cual será implementado y validado dentro de un repositorio local. Este proceso garantizará la adecuada integración de los componentes front-end y back-end, permitiendo que los usuarios se registren, gestionen sus perfiles eficientemente.3. Se elaborará un informe de documentación de pruebas para registrar los resultados de todos los procesos de verificación y validación.4. Finalmente, se desarrollará una propuesta de diseño para las secciones de verificación de perfil de usuario. Esta propuesta representará visual y funcionalmente la interfaz y la experiencia del usuario, sirviendo como guía para futuras iteraciones de la plataforma “TODOS”.
Fotografía de contexto
Actor/Cargo/Rol
| Actor | Cargo o rol | Actividad o cómo/porqué se involucró |
|---|---|---|
| Juan Lamark | Student | Industrial Engineer | Creation and design of requirements list and project management. |
| Juan Pablo Guayara | Student | Computer Science Engineer | Software development. |
| Wilmar Andrés León | Proponent | Community Partner | Baseline of design and graphic architecture. |
| Josi Estiven Torres | Proponent | Community Partner | Development and web programming baseline. |
| Ángel Norberto Alfonso Parra | Proponent | Community Partner | Project lead and founder. |
| Pedro Cárdenas | Tutor | Engineering Professor | Academic and project support. |
Nivel de participación del proponente
Nivel 1: proyecto en donde no participaron actores externos al equipo de trabajo. Nivel 2: proyecto en donde se contó con la participación de otros miembros de la comunidad a la que el equipo pertenece. Ejemplo: se hicieron validaciones con estudiantes de otras carreras. Nivel 3: se realizaron visitas y encuentros para conocer las percepciones, ideas y reali mentación de actores y comunidades externas. Ejemplo: se trabajó con comunidad cafetera. Nivel 4: el proyecto fue liderado conjuntamente por el equipo de trabajo y comunidades externas.
Nivel 2
Número de personas participantes:
3
Hallazgo/ Fuente/ Conclusión o influencia
| Hallazgo | Fuente | Conclusión |
|---|---|---|
| Se recomienda fomentar la diversidad de pensamiento en la red social, mezclando ideas rápidas con análisis más pensados entre los usuarios, ya que esto ayuda a reducir errores y mejora la precisión de las decisiones colectivas. | Keck, S., & Tang, W. (2020). Enhancing the Wisdom of the Crowd With Cognitive-Process Diversity: The Benefits of Aggregating Intuitive and Analytical Judgments. Psychological Science. | Para la plataforma “TODOS”, permitir que los usuarios expresen sus opiniones en diferentes modos (por ejemplo, voto rápido vs. comentario más reflexivo) puede mejorar la calidad de la toma de decisiones colectiva. Diseñar las secciones de perfil de proyecto y perfil de usuario para capturar no solo “qué” opiniones tienen los usuarios, sino también “qué tan seguros” o “qué tan reflexivos” están al respecto, puede ser valioso. |
| El algoritmo de lo “sorprendentemente popular”, que pregunta tanto qué cree una persona que es correcto como qué cree que los demás pensarán, reduce significativamente el error en comparación con los votos por mayoría o los votos ponderados por nivel de confianza. | Prelec, D., et al. (2017). Better wisdom from crowds: MIT News. | Implementar sistemas de votación o de ranking en la plataforma podría usar preguntas o mediciones duales similares para obtener juicios comunitarios más precisos. Por ejemplo, cuando los usuarios evalúen proyectos, preguntar “¿Qué proyecto debería recibir financiación?” y “¿Qué proyecto esperas que elijan los demás?” podría mejorar la priorización. |
| La diversidad de opinión es esencial para la sabiduría de las multitudes; sin embargo, ser demográfica o socialmente diverso no siempre garantiza una mejor precisión, a menos que esa diversidad también se traduzca en diferencias de puntos de vista o de conocimientos que sean relevantes para la decisión. | Curşeu, P. L., & others. “Demographically diverse crowds are typically not much wiser than homogeneous crowds” (2021). PNAS. | En los perfiles de usuario y de proyecto, es importante recopilar información que permita una diversidad significativa; no solo datos demográficos, sino también la experiencia en determinados temas, los intereses o el conocimiento local de los usuarios. Esto podría ayudar a garantizar que la “multitud” en TODOS sea diversa en aspectos que realmente importan. |
| Tomar decisiones en pequeños grupos que conversan y llegan a un acuerdo puede, en algunos casos, dar mejores resultados que simplemente seguir la opinión de una gran cantidad de personas. Hablar, discutir y compartir ideas dentro del grupo ayuda a mejorar la calidad de la decisión final. | Navajas, J., Niella, T., Garbulsky, B., Bahrami, B., & Sigman, M. (2017). Aggregated knowledge from a small number of debates outperforms the wisdom of large crowds. arXiv. | Para TODOS, esto sugiere que, además de la votación simple, podría ser valioso incorporar la deliberación en pequeños grupos (por ejemplo, foros de discusión o comités) al decidir qué proyectos tienen prioridad, especialmente en aquellos casos en los que la competencia entre proyectos sea muy reñida. |
| En tareas complejas (donde la información tiene muchos factores), la sabiduría de las multitudes sigue aplicando, pero la interacción entre el tamaño del grupo y la ponderación por confianza es importante; la agregación ponderada (basada en qué tan seguras están las personas de sus respuestas) mejora los resultados, especialmente cuando el grupo es más grande. | Suri, G., & others (2020). Wisdom of crowds and collective decision-making in a survival situation with complex information integration. Cognitive Research: Principles and Implications, 5, 48. | Para el sistema TODOS, la confianza (o credibilidad) del usuario podría registrarse de alguna forma en los perfiles de proyecto o de usuario. Al agregar votos o preferencias, ponderar según el nivel de confianza podría conducir a una priorización más fiable. Además, es importante asegurar un número suficientemente grande de respuestas para aprovechar el efecto de sabiduría colectiva. |
Hallazgo/ Fuente/ Conclusión o influencia
| Hallazgo | Fuente | Conclusión |
|---|---|---|
| Muchas personas de las comunidades no tienen acceso constante a internet de alta velocidad. | Conversaciones con el equipo durante visita de campo. | La plataforma debe ser ligera, optimizada para móviles y con bajo consumo de datos. |
| Hay desconocimiento técnico en zona rural de Colombia, sobre cómo manejar plataformas digitales complejas. | Conversaciones con el equipo durante visita de campo. | Se decidió que el proceso de registro, creación de perfil y proyectos debe ser muy intuitivo, con guías visuales y pocos pasos. (IA) |
| Utilizamos herramientas de software "Open-Source", como "Miro", "Figma", para ahorrar costos de diseños, ya que la organización saca fondos de sus colaboradores mientras se vuelve rentable. | Conversaciones con el equipo durante visita de campo. | La sección de proyectos se prioriza para dar máxima exposición, con filtros de búsqueda por temas sociales y ambientales. |
| Existen diversas habilidades técnicas en la comunidad que no están conectadas entre sí. | Conversaciones con el equipo durante visita de campo. | Se enfatizó que los perfiles deben incluir habilidades destacadas para fomentar conexiones entre usuarios. |
| La plataforma está inspirada en la filosofía social "inteligencia social", el fundador, Ángel, escribió un libro explicando esta forma de democratizar las decisiones. | Conversaciones con el equipo durante visita de campo. | El diseño del sistema prioriza proyectos con impacto social y ambiental medible, alineado con la misión de TODOS. |
Pasos
Proceso para llegar a los resultados:
- Definimos el alcance con el socio comunitario TODOS: acordamos que esta iteración se enfocaría solo en el módulo de verificación de perfil de usuario dentro de la red social.
- Diseñamos la arquitectura de back-end:
Modelo de datos con cinco tablas (usuario, perfil, formación, experiencia y conocimiento).
Arquitectura por capas con servicios y controladores usando DTO para estandarizar las peticiones.
Endurecimos la seguridad del back-end:
Migramos la autorización a JWT, derivando el usuario autenticado desde el token en cada petición.
Eliminamos el envío de IDs sensibles en el payload y dejamos solo lectura (GET) pública, protegiendo las rutas de escritura (crear/actualizar/eliminar).
Documentamos el entorno técnico y pruebas:
Dejamos registradas las herramientas usadas (Ubuntu, VS Code, Postman, Azure Data Studio, NestJS) y los pasos para probar el back-end en local.
Iniciamos el co-diseño de UX con la comunidad:
Sesión de alineación en Miro para clarificar alcance, recopilar referencias visuales y bosquejar las primeras pantallas, comenzando por versión móvil.
Iteramos los mockups y simplificamos el flujo:
Separación de tareas en pantallas (por ejemplo, foto de perfil y selección de identificadores en pasos distintos).
Ajustes de colores (verdes y azules), tratamiento de logo y estilo minimalista para reducir carga cognitiva.
Extendimos el diseño a web de escritorio:
Adaptamos el flujo móvil a vista de escritorio, manteniendo coherencia visual y funcional, según las preferencias estéticas del socio comunitario.
Consolidamos el paquete final de pantallas:
Definimos 6 pantallas que cubren todo el flujo de verificación (foto, identidad, avance, opciones de verificación y privacidad, confirmación y arranque de perfil).
Puesta en marcha:
Para el diseño
- Enviar Figma/Miro completo con el desarrollador para la implementación final.
Para el back-end de Red TODOS:
- Leer documentación para entender qué atributos recibe cada endpoint; esto va a ser útil al momento de hacer las peticiones desde el front.
- En caso tal de no alcanzar a corregir:
- La firma del JWT no es válida.
- Hacer peticiones con el JWT en vez de usar enviar textualmente el id al back.
- Estandarizar idioma de los atributos en el back.
- Cambiar las relaciones para la foreign key.
Fotografía del proceso o el equipo de trabajo
Resultado
Integración de back-end seguro y flujo UX de verificación de perfil para la red social TODOSDescripción
1. Se integró el back-end y la experiencia de usuario (UX) para el flujo de verificación de perfil de la red social TODOS.2. Se implementó un back-end con arquitectura por capas, servicios/controladores y uso de DTO sobre cinco tablas (usuario, perfil, formación, experiencia y conocimiento).3. Se reforzó la seguridad de las operaciones de escritura (crear, actualizar, eliminar) mediante un esquema de autorización basado en JSON Web Tokens (JWT) centrado en el usuario.4. Se actualizaron los métodos C/U/D y se dejaron los métodos GET como acceso público de solo lectura para reducir el riesgo de modificaciones no autorizadas.5. Se documentaron las herramientas de desarrollo utilizadas en back-end (Ubuntu, VS Code, Postman, Azure Data Studio y NestJS) y los lineamientos de prueba en entorno local.6. Se elaboró un documento de requisitos para el módulo de acceso y verificación (login, restablecimiento de contraseña y prerrequisitos de perfil) para alinear front-back y criterios de aceptación.7. Se aplicó una metodología iterativa de co-diseño con socios comunitarios para construir y validar rápidamente mockups del flujo de verificación de perfil.8. Se diseñó un paquete de aproximadamente seis pantallas que cubren de extremo a extremo la verificación de perfil (foto, identidad, opciones de verificación y privacidad, confirmación e inicio de perfil).9. Se adaptaron los mockups para versión móvil y web de escritorio con un estilo visual minimalista y decisiones de simplificación para reducir la carga cognitiva del usuario.10. Se prepararon estos diseños para su traspaso a Figma y posterior implementación en el frontend, sentando la base de la siguiente fase técnica de la plataforma.Conclusiones
- Se fortaleció la confiabilidad del ecosistema TODOS al reducir el riesgo de modificaciones no autorizadas en la información de perfil mediante endpoints seguros y una arquitectura de back-end por capas.
- Se aportó claridad y consistencia al flujo de verificación de perfil con un paquete de pantallas que cubre el proceso de extremo a extremo y está listo para su implementación en el frontend.
- Se disminuyó la carga cognitiva y el riesgo de desorientación del usuario al separar tareas complejas y adoptar un enfoque minimalista y modular en la interfaz.
- Se aumentó el control y la confianza del usuario sobre sus datos al ofrecer niveles de privacidad visibles por atributo (público, amigos, privado) dentro de la arquitectura de información del perfil.
- Se alineó el diseño de la interfaz con los requisitos técnicos y de seguridad (login, restablecimiento de contraseña, verificación), reduciendo inconsistencias entre lo que muestra la interfaz y lo que valida el sistema.
Sintetiza y comunica lo esencial a audiencias interesadas
| Audiencia | Posible uso de los resultados | Información clave |
|---|---|---|
| Equipo de desarrollo de TODOS | Usar la arquitectura y las decisiones técnicas como base para seguir construyendo módulos seguros y escalables en la plataforma. | Ya existe un back-end por capas con endpoints seguros para el perfil, documentado y probado en entorno local, que reduce riesgos de cambios no autorizados y facilita futuras iteraciones. |
| Diseñadores UX/UI y de Producto | Tomar el flujo de verificación de perfil y las pantallas diseñadas como referencia para nuevas funcionalidades y mejoras de experiencia. | Se diseñó un flujo de verificación de perfil de extremo a extremo (≈6 pantallas), minimalista y modular, que disminuye la carga cognitiva, mantiene al usuario orientado y está listo para ser implementado en frontend. |
| Organizaciones comunitarias y ONGs | Comprender cómo la plataforma mejora la confianza y la seguridad para impulsar procesos participativos reales con sus comunidades. | La verificación de perfil más segura y clara aumenta la credibilidad del sistema TODOS, ayudando a que la participación ciudadana en la priorización de proyectos comunitarios sea más confiable. |
Enlace con documentación detallada
https://drive.google.com/drive/u/4/folders/1Nf29-csVEuSnzzeuMxpLlrcakiDyIwSfFotografía de la solución o los resultados
Fortalezas
- La fácil replicación de recursos audiovisuales de las plataformas Miro y Figma.
- Para el MVP, el host de la base de datos es totalmente funcional y gratuito.
- Colaboradores de la organización con procesos claros, y de fácil acceso.
Debilidades
- Necesitamos reducir los grados de dificultad para el ruido visual y funcional para la experiencia de usuario.
- La organización, idealmente, en un futuro necesita especialistas y tiempo en desarrollo en la organización sobre front-end.
Oportunidades
Oportunidades
- La organización está a la espera de futuros inversionistas que permitirán escalar el proyecto.
- Los colaboradores de la organización contarán con más espacios para el desarrollo de secciones de la plataforma.
- El lenguaje es sencillo y replicable para la expansión del proyecto.
Amenazas
- Riesgos de seguridad: Al involucrarnos con proyectos públicos, debe considerarse la seguridad física de los colaboradores cuando haya intereses políticos en los proyectos.
- Riesgo de escalabilidad: que los usuarios pierdan interés en las aplicaciones de la plataforma TODOS.
Nivel de Novedad
Fase 1: Solución que no se había hecho antes en este contexto. Fase 2: Es la continuidad, mejora o iteración de una solución que ya se había hecho antes en este contexto. Fase 3: la solución ya se había hecho en este contexto pero este proyecto presenta un nuevo enfoque. Fase 4: Se desconoce si esta solución y se había intentado en este contexto
Fase 2Novedad
Alcance
Nivel 1: los resultados son ideas exploratorias iniciales Nivel 2: los resultados presentan un avance pero aún no se pueden usar o no son implementables Nivel 3: lo resultados ya se pueden usar o son imple-entables
Nivel 1Siguientes tres retos u oportunidades sugeridas
+ R1: Sección de registro de proyectos para la plataforma Red TODOS.
+ R2: Apoyo para la comunicación de la marca a través de redes y medios de comunicación. Socialización y promoción del proyecto.
+ R3: Planes de financiación y proyecciones de resultados económicos para la plataforma Red TODOS.
Wilmar A. León,
Baseline of design and graphic architecture.
Juan P. Guayara,
Software development.
Contacto,Nombre,Email
No se ha agregado información de impacto para este reto