Bitácora es una plataforma web educativa desarrollada para facilitar el acceso a contenido académico multimedia por parte de estudiantes de economía. El proyecto nace de una iniciativa independiente conformada por profesores e investigadores que buscan democratizar el conocimiento económico, ofreciendo materiales como cuadernos, videos, podcasts y eventos en un entorno amigable, accesible y libre de barreras técnicas. El diseño se apoya en elementos visuales como personajes ilustrados que guían a los usuarios en cada sección, haciendo que la experiencia sea más atractiva y cercana. Además, se prioriza la búsqueda rápida de contenido, el uso de iconografía intuitiva, y una arquitectura de información diseñada para minimizar la carga cognitiva de los usuarios.
Bitácora es una plataforma web educativa creada con el objetivo de facilitar el acceso a contenido académico multimedia para estudiantes de economía, dentro y fuera del aula. El proyecto nace como una iniciativa independiente liderada por un grupo de profesores e investigadores comprometidos con la democratización del conocimiento económico. Frente a la fragmentación de recursos y la limitada disponibilidad de materiales accesibles, Bitácora se concibe como un espacio libre, amigable y técnicamente accesible donde estudiantes puedan consultar cuadernos académicos, videos, podcasts y eventos especializados sin necesidad de pasar por filtros institucionales complejos. El sitio se distingue por un diseño centrado en el usuario que combina funcionalidad con elementos lúdicos: personajes ilustrados que guían la navegación, secciones claramente estructuradas por tipo de recurso y una interfaz que facilita tanto la búsqueda rápida como la exploración temática. Cada decisión de diseño fue pensada para reducir la carga cognitiva, mejorar la retención del contenido y permitir que tanto alumnos como docentes encuentren lo que necesitan sin distracciones, barreras técnicas ni frustración.
El desarrollo de Bitácora exigió una combinación equilibrada de funcionalidades técnicas, criterios pedagógicos y principios de accesibilidad web. Se planteó una landing page responsive que diera la bienvenida al proyecto, explicando su propósito de forma clara y concisa. La navegación se organizó en secciones temáticas —Cuadernos, Videos, Podcasts y Eventos— permitiendo a los usuarios localizar fácilmente los recursos que necesitan. Uno de los requerimientos clave fue la integración de un motor de búsqueda inteligente que permitiera filtrar contenidos por tipo, autor, fecha, palabras clave o nivel académico. También se incluyó un sistema de filtrado adicional que organizara los materiales por categoría, formato o dificultad, ofreciendo una experiencia personalizada. La incorporación de personajes ilustrados con rol de guías se convirtió en una herramienta estratégica para acompañar al usuario en su recorrido, reforzando la identidad del proyecto y humanizando la experiencia. La sección de eventos incluyó un calendario interactivo y un sistema sencillo de registro. Además, se habilitó una página de contacto con formulario y enlaces a redes sociales para facilitar la interacción y participación de la comunidad. Para el equipo docente y curador, se diseñó un panel administrativo donde pueden subir, editar y clasificar contenidos de manera autónoma. Todo el sitio fue optimizado para cumplir con criterios de accesibilidad, incluyendo etiquetas semánticas, contraste alto, tipografía legible y navegación compatible con teclado. Finalmente, se implementó la descarga de cuadernos en PDF, la reproducción embebida de materiales audiovisuales y una integración básica con herramientas de analítica como Matomo o Google Analytics para evaluar el uso y mejorar la toma de decisiones futuras.
Durante la fase de descubrimiento se identificaron problemáticas recurrentes que afectan tanto a estudiantes como a docentes del área económica. En primer lugar, se evidenció la dificultad generalizada para acceder a recursos académicos confiables, organizados y centralizados. Las plataformas institucionales existentes resultaban, en muchos casos, poco intuitivas, lentas o limitadas por credenciales específicas, lo que reducía significativamente su uso cotidiano. Además, una gran cantidad de contenido valioso creado por docentes e investigadores independientes no llegaba a difundirse adecuadamente debido a la falta de un repositorio accesible, actualizado y estructurado. Los estudiantes, en consecuencia, pasaban mucho tiempo navegando entre múltiples sitios, redes sociales o repositorios fragmentados, lo que generaba una experiencia ineficiente y frustrante. Otro hallazgo clave fue la falta de adaptación de las interfaces actuales a las necesidades de personas con discapacidad o a quienes utilizan el sitio desde dispositivos móviles. Esta combinación de factores hacía evidente la necesidad de un entorno digital más amable, accesible y centrado en la experiencia de aprendizaje.
El objetivo principal de Bitácora fue diseñar y desarrollar un sitio web que centralizara recursos educativos en economía producidos por docentes e investigadores independientes. La meta no era solo ofrecer acceso gratuito a materiales de calidad, sino también construir una experiencia digital que fuera intuitiva, visualmente atractiva y libre de barreras técnicas. Se buscó facilitar el descubrimiento de contenidos, promover el aprendizaje autónomo y motivar el uso frecuente del sitio a través de una interfaz cuidadosamente pensada. Adicionalmente, se buscó fomentar la participación docente mediante un entorno que les permitiera subir materiales con facilidad, sin depender de equipos técnicos. Otro objetivo fundamental fue garantizar el cumplimiento de principios de accesibilidad web para que cualquier estudiante —independientemente de sus condiciones visuales, motrices o tecnológicas— pudiera navegar y beneficiarse del contenido. En conjunto, Bitácora aspiraba a convertirse en un espacio inclusivo, sustentable y en constante crecimiento.
La solución diseñada para Bitácora fue una plataforma web responsiva, accesible y amigable, construida sobre una arquitectura clara que organizara el contenido por tipo: Cuadernos 📘, Videos 🎥, Podcasts 🎧 y Eventos 📆. Cada una de estas secciones contaba con una estética visual diferenciada, pero integrada dentro del sistema de diseño general del sitio, lo que permitía a los usuarios familiarizarse rápidamente con la estructura y desplazarse con confianza. Uno de los elementos más distintivos fue la implementación de personajes ilustrados con rol de guías pedagógicos. Estos personajes no solo embellecían la interfaz, sino que ofrecían orientación, sugerencias y mensajes de bienvenida en cada sección, humanizando la experiencia y creando una conexión emocional con el usuario. Para optimizar la búsqueda, se integró un motor semántico con filtros avanzados, permitiendo localizar recursos por tipo, autor, palabra clave o nivel. Se incluyó también un sistema de etiquetas y categorías para facilitar la exploración por temas. El sitio fue desarrollado con un diseño adaptativo, cumpliendo con estándares AA/AAA de accesibilidad. Esto incluyó soporte para lectores de pantalla, navegación por teclado, uso de contraste alto, y tipografías que facilitan la lectura a personas con dislexia. Animaciones ligeras y microinteracciones sutiles mejoraron el engagement sin sacrificar velocidad de carga ni compatibilidad con dispositivos más antiguos. El panel administrativo, desarrollado para profesores y colaboradores, fue diseñado con especial atención a la autonomía del usuario no técnico, permitiendo subir y editar contenido con facilidad. Para garantizar la sostenibilidad del proyecto, se eligieron tecnologías de código abierto y sistemas que redujeran la dependencia de servicios comerciales.
El proceso de desarrollo de Bitácora comenzó con una fase de investigación cualitativa que incluyó entrevistas con estudiantes de licenciatura y posgrado, así como con profesores y colaboradores externos. Se mapearon los principales perfiles de usuario —como el estudiante autodidacta, el docente colaborador o el visitante ocasional interesado en eventos— y se trazaron recorridos de usuario desde la búsqueda hasta la descarga o visualización del recurso. La fase de diseño UX incluyó la definición de una arquitectura de información jerarquizada, flujos centrados en las tareas principales del usuario y prototipos de baja y media fidelidad que fueron validados con los stakeholders. Durante la fase UI se desarrolló un sistema visual de estilo editorial, moderno pero respetuoso del contexto académico. Se diseñaron personajes ilustrados para cada sección, iconografía personalizada y se elaboraron prototipos interactivos en Figma para pruebas con usuarios reales. El proceso continuó con sesiones de validación moderadas, ajustes iterativos según resultados de usabilidad y pruebas A/B. Finalmente, se entregó un manual de diseño completo, documentación funcional para desarrollo front-end, y se desplegó la versión final en un entorno web educativo con dominio propio. El proyecto incluyó soporte post-lanzamiento para mejoras incrementales y monitoreo mediante analítica web.
Como UX Engineer a cargo del proyecto Bitácora, lideré la investigación contextual y el diseño centrado en usuarios, asegurándome de que las soluciones propuestas respondieran a las necesidades reales de estudiantes y profesores. Diseñé la experiencia de navegación completa, optimizada para el descubrimiento eficiente de contenido y estructurada para reducir la carga cognitiva en cada paso. Colaboré con el equipo de ilustración para definir el tono visual de los personajes guía, asegurando su funcionalidad didáctica y su coherencia con la identidad de la plataforma. Desarrollé un sistema de diseño flexible y accesible que permitió escalar fácilmente la solución en futuras versiones. Trabajé en estrecha colaboración con el equipo de desarrollo para documentar todas las decisiones de interfaz, validando que cada componente cumpliera con los estándares de accesibilidad (WCAG 2.1) y que la experiencia se mantuviera coherente en desktop y mobile. Asimismo, coordiné las pruebas de usabilidad con usuarios reales, priorizando siempre el feedback directo como fuente de mejora continua. Durante todo el proceso actué como vínculo entre el equipo técnico y el equipo académico, garantizando que Bitácora cumpliera su doble función: ser un espacio pedagógicamente sólido y técnicamente impecable.
Metodología centrada en el usuario desde la investigación hasta la implementación
Entrevistas con 15 pediatras y observaciones en contexto real para entender desafíos en documentación clínica.
Notas de investigación
Notas de investigación
Entrevistas con 15 pediatras y observaciones en contexto real para entender desafíos en documentación clínica.
Notas de investigación
Notas de investigación
Síntesis de hallazgos para crear artefactos que guíen el diseño de la solución.
Creación de 3 arquetipos de pediatras basados en comportamiento, necesidades y frustraciones.
Mapeo detallado del proceso actual de documentación con puntos críticos de dolor.
Evaluación de soluciones existentes para identificar oportunidades de diferenciación.
Análisis de 12 soluciones de documentación médica y sus modelos de negocio.
Matriz comparativa de características, precios y enfoques de productos competidores.
Desarrollo iterativo de prototipos para validar flujos y interacciones clave.
Evaluación con usuarios reales para validar usabilidad y eficacia de la solución.
Desarrollo y despliegue de la solución con seguimiento continuo de métricas.
Elementos innovadores que diferencian nuestra solución
Flujo conversacional que permite a médicos dictar notas en lenguaje natural, transformado en documentos estructurados automáticamente.
Sistema modular que los médicos pueden personalizar según especialidad y preferencias individuales.
IA analiza historial del paciente para sugerir diagnósticos diferenciales y redacciones optimizadas.
Modo "consulta rápida" para casos simples que reduce pasos necesarios al mínimo esencial.
Métricas clave que demuestran el éxito del proyecto
Reflexiones clave que surgieron durante el proyecto
La observación en contexto real reveló necesidades no expresadas en entrevistas, como la importancia de flujos que permitan mantener contacto visual con el paciente.
Los médicos priorizan precisión sobre velocidad. Implementamos mecanismos de verificación que no interrumpen el flujo pero garantizan exactitud.
El testing temprano con prototipos funcionales evitó costosos rediseños en etapas avanzadas de desarrollo.
El modelo de lenguaje necesitó entrenamiento especializado para manejar correctamente términos médicos y abreviaturas.
Combinar entrada por voz y texto fue crucial para adaptarse a diferentes preferencias y contextos de uso.
Implementar encriptación end-to-end desde el inicio fue fundamental para ganar confianza de usuarios.