Case 05 · Caso personalCase 05 · Personal project

humman

Diseñé una plataforma de RRHH para empresas constructoras que ataca la rotación de personal apostando por el desarrollo del talento interno antes que por la contratación externa.I designed an HR platform for construction companies that tackles staff turnover by betting on developing internal talent before hiring outside.

RolRoleUX/UI Designer — caso individualUX/UI Designer — solo project
SectorSectorRRHH — construcciónHR — construction
AñoYear2024
PrototipoPrototypeFigma ↗
humman HR platform dashboard
01

El retoThe challenge

Dos problemas de talento que se retroalimentan.Two talent problems that feed each other.

El sector de la construcción en Colombia —cerca de 36.000 empresas según DANE e Informa— arrastra dos problemas: cuesta encontrar candidatos con las habilidades técnicas específicas que requieren obras y proyectos, y la rotación es alta porque la naturaleza temporal de los proyectos impide estabilidad laboral. Cada rotación devuelve a la empresa al primer problema, con el costo de contratación y capacitación otra vez encima.Construction in Colombia —around 36,000 companies according to DANE and Informa— carries two problems: it is hard to find candidates with the specific technical skills that sites and projects demand, and turnover is high because the temporary nature of projects prevents job stability. Every departure sends the company back to the first problem, with hiring and training costs on top again.

La respuesta convencional es reclutar más rápido. La hipótesis del proyecto fue otra: si el talento adecuado es escaso, la palanca no está en buscar mejor afuera sino en desarrollar y retener lo que ya está adentro.The conventional answer is to recruit faster. The project's hypothesis was different: if the right talent is scarce, the lever is not searching better outside but developing and retaining what is already inside.

Desk research on the Colombian construction sector, with cited sources
Desk research del sector, con fuentes citadas.Desk research on the sector, with cited sources.
02

El procesoThe process

Design Thinking completo, esta vez con las cuatro fases: desk research con fuentes, benchmark comparativo, user persona y journey map — y una decisión de alcance tomada mirando la caída del recorrido, no una lista de funcionalidades deseadas.Full Design Thinking, this time with all four phases: sourced desk research, comparative benchmark, user persona and journey map — with a scope decision made by looking at the dip in the journey, not at a wish list of features.

EmpatizarEmpathise
Desk research Tamaño y comportamiento del sector, con fuentes citadas (DANE, Informa, SAP, Emprenderte).Size and behaviour of the sector, with cited sources (DANE, Informa, SAP, Emprenderte).
Benchmark Factorial, Personio y Bizneo evaluados en cuatro ejes: navegación, diseño, vocabulario y usabilidad. Personio salió mejor calificada en conjunto; de Factorial rescaté el dashboard de inicio con información relevante y el diseño modular.Factorial, Personio and Bizneo assessed on four axes: navigation, design, vocabulary and usability. Personio scored best overall; from Factorial I took the home dashboard with relevant information and the modular layout.
User research Enfocado en el perfil con mayor tiempo de uso: técnicos y analistas de selección. Documenté de forma explícita que en un escenario real la secuencia sería encuestas → user persona → entrevistas de validación, y que aquí se trabajó con el marco definido sin ejecutar el campo.Focused on the profile with the most time in the platform: recruitment technicians and analysts. I explicitly documented that in a real scenario the sequence would be surveys → user persona → validation interviews, and that here I worked with the defined framework without running fieldwork.
DefinirDefine
User persona: Ana Rodríguez, HR coordinator
Ana Rodríguez, 32 Coordinadora de RRHH en una constructora, 8 años de experiencia. Sus dolores: no encuentra candidatos con las habilidades técnicas requeridas, tiene muchas herramientas y quisiera tenerlas todas en una sola plataforma, y la presión por cumplir plazos vuelve caótico el proceso inicial de búsqueda.HR coordinator at a construction firm, 8 years of experience. Her pains: she cannot find candidates with the required technical skills, she juggles many tools and would like them all in one platform, and deadline pressure makes the initial search process chaotic.
Customer journey map across seven hiring stages
Customer journey mapCustomer journey map Siete etapas, de "nueva vacante activa" a "capacitación del nuevo empleado". Los dos valles profundos aparecieron en búsqueda de candidatos internos y proceso de contratación. El primero confirmó la hipótesis: la empresa no sabe qué tiene adentro.Seven stages, from "new open role" to "training the new hire". The two deep valleys appeared at internal candidate search and hiring process. The first confirmed the hypothesis: the company does not know what it already has inside.

En la fase de Idear, el MVP se concentró en la rama de aprendizaje y desarrollo — explorar cursos con filtros, detalle del curso, learning paths, mi aprendizaje y perfil. La decisión responde al valle del journey map: no se puede filtrar candidatos internos si no se está midiendo su desarrollo.In the Ideate phase, the MVP focused on the learning and development branch — course exploration with filters, course detail, learning paths, my learning and profile. The decision answers the journey-map valley: you cannot filter internal candidates if you are not measuring their development.

03

De la forma
a la función
From form
to function

La consolidación se resuelve dando control sobre la densidad, no imponiéndola.Consolidation is solved by giving control over density, not by imposing it.

El dashboard modular responde al pain pointThe modular dashboard answers the pain point

Ana dijo que tiene muchas herramientas y quiere todo en un solo lugar. La traducción no fue "meter todo en una pantalla" —eso es la definición de saturación— sino un tablero de widgets que el usuario puede expandir o cerrar individualmente, cada uno con sus dos controles en la esquina.Ana said she has too many tools and wants everything in one place. The translation was not "cram everything onto one screen" —that is the definition of clutter— but a board of widgets the user can expand or close individually, each with its two controls in the corner.

Modular widgets the user can expand or close individually
Cada widget habla el idioma de su datoEach widget speaks its data's language

Jornada es un cronómetro con dos botones semánticos (ingreso / salida). Tareas del día es una checklist editable. Ausencias separa "hoy" de "pendientes por aprobar", y estas últimas traen los botones de decisión ahí mismo — aprobar o denegar sin abrir nada.Shift is a timer with two semantic buttons (clock in / clock out). Today's tasks is an editable checklist. Absences separates "today" from "pending approval", and the latter carry the decision buttons right there — approve or deny without opening anything.

Desarrollo profesional y Vacantes activas usan la misma barra de progreso, y esa repetición es intencional: hace legible en paralelo el avance de una persona y el avance de una vacante. Formalmente son el mismo componente; conceptualmente ponen a competir al candidato interno con el proceso externo.Professional development and Open roles use the same progress bar, and that repetition is deliberate: it makes a person's progress and a vacancy's progress readable side by side. Formally they are the same component; conceptually they put the internal candidate in competition with the external process.

El calendario como columna, no como secciónThe calendar as a column, not a section

La agenda ocupa una franja lateral permanente con vista mensual arriba y timeline por horas abajo, con leyenda de color por tipo. Para un rol que vive de agendar entrevistas, el calendario no es un lugar al que se navega: es contexto que siempre está.The agenda occupies a permanent side strip with a monthly view on top and an hourly timeline below, with a colour legend by type. For a role that lives on scheduling interviews, the calendar is not a place you navigate to: it is context that is always there.

Permanent agenda side panel with monthly calendar and hourly timeline
MarcaBrand

La paleta es naranja cálido sobre navy profundo. Las plataformas del benchmark tienden al azul corporativo o al rosa de producto. El naranja hace dos cosas a la vez: se conecta con el imaginario visual del sector —señalización, elementos de seguridad, maquinaria— y sostiene la promesa del producto, que es de crecimiento y desarrollo, no de control administrativo.The palette is warm orange over deep navy. The benchmarked platforms tend towards corporate blue or product pink. Orange does two things at once: it connects to the sector's visual imagery —signage, safety gear, machinery— and it holds the product's promise, which is growth and development, not administrative control.

"humman", con la doble m ligada y en minúscula sostenida — humano y human resources en la misma palabra, sin gritar. El producto se llama como lo que quiere defender."humman", with the double m ligature and lowercase throughout — human and human resources in the same word, without shouting. The product is named after what it wants to defend.

04

La soluciónThe solution

Un dashboard modular con agenda permanente y un MVP concentrado en aprendizaje y desarrollo.A modular dashboard with a permanent agenda and an MVP focused on learning and development.

humman home dashboard with widgets and the agenda side panel
Dashboard de inicio con widgets y panel lateral de agenda.Home dashboard with widgets and side agenda panel.
Vacancy flow wireframes, from request to hire
Flujo de vacante — de la solicitud a la contratación.Vacancy flow — from request to hire.
humman design system pieces: orange over navy
Piezas del design system — naranja sobre navy.Design system pieces — orange over navy.
ComponentesComponents
Dashboard de inicioHome dashboardWidgets expandibles y cerrables: jornada, tareas del día, ausencias y aprobaciones, desarrollo profesional por colaborador, vacantes activas con estado y progreso.Expandable, closable widgets: shift, today's tasks, absences and approvals, professional development per employee, open roles with status and progress.
Panel de agendaAgenda panelCalendario mensual, timeline por horas y leyenda por tipo de evento.Monthly calendar, hourly timeline and legend by event type.
NavegaciónNavigationInicio, Correo, Vacantes, Colaboradores, Calendario, Carrera.Home, Mail, Openings, People, Calendar, Career.
Módulo de desarrollo (MVP)Development module (MVP)Explorar cursos con filtros y comparación, detalle del curso, learning paths, mi aprendizaje.Course exploration with filters and comparison, course detail, learning paths, my learning.
Flujo de vacanteVacancy flowDe la solicitud a la contratación, con filtrado de colaboradores internos como paso explícito.From request to hire, with internal candidate filtering as an explicit step.
05

El resultadoThe result

El valle del journey map no confirmó una sospecha: señaló dónde construir primero.The journey-map valley did not confirm a hunch: it pointed at where to build first.

Un caso completo de Design Thinking con research secundario citado, benchmark comparativo estructurado y journey map que derivó directamente en la decisión de alcance del MVP.A complete Design Thinking case with cited secondary research, a structured comparative benchmark and a journey map that fed directly into the MVP scope decision.

Un dashboard modular que traduce un pain point declarado —"quiero todo en una plataforma"— en una decisión de arquitectura de interfaz en lugar de una lista de features.A modular dashboard that turns a stated pain point —"I want everything in one platform"— into an interface architecture decision instead of a feature list.

Aprendizaje: la arquitectura del MVP se decidió mirando la caída del recorrido, no la lista de funcionalidades deseadas.Takeaway: the MVP architecture was decided by looking at the dip in the journey, not at the wish list of features.

Caso personal, sin métricas de producción.Personal project, no production metrics.