UI / UX Design
Colmena: Digital Health in Times of Pandemic
How we designed a health insurer's digital experience from scratch during the pandemic, on a broken technical foundation, with non-digital stakeholders, and for users who had never used a health app.
Year:
2020-2021
Industry :
Health — Isapre
Client:
Colmena Health Insurance
Role :
UX/UI
Context
COVID-19 pandemic. Colmena's physical branches collapsed. Users needed to manage vouchers, reimbursements, and health services from home. The problem: the existing app didn't work.
Colmena had an app. It had been built by developers with no experience in product design and without UX involvement. The result was an interface where the most critical flows, buying a voucher and requesting a reimbursement, were broken or so confusing that no one completed them. The app existed, but it wasn't useful.
When the pandemic hit and branches had to reduce their operations, that reality became urgent. I was part of the team brought in to design the real digital experience: not to patch what was there, but to build the right flows from scratch, within the existing technical constraints.
What we found upon arrival
The initial diagnosis was clear. There was an app installed on members' phones, but it worked more like a barrier than a solution.
Initial state | What we built |
|---|---|
Incomplete bond purchase flow. Users got halfway through and couldn't continue. | End-to-end bond purchase flow, with cost summary visible from the start. |
Refunds with no functional flow. They could only be handled in person. | Functional digital refund flow for the first time in the product's history. |
Navigation built by developers without UX criteria. No hierarchy or task logic. | Redesigned navigation architecture centered on the 3 most frequent tasks. |
Insurance technical language incomprehensible to the average user. | Everyday language throughout the interface. Zero insurance jargon. |
40% abandonment in the first 3 minutes of the session. | +35% of active sessions completed in the first 3 months. |
The real challenges
There was no design to inherit. Everything started from scratch in UX terms, but within an already built technical foundation in Ionic that we couldn't change. The design had to adapt to what the framework allowed. |
The end users were older adults or people with low digital familiarity. Designing for someone who has never used a health app is radically different from designing for a tech user. |
The stakeholders were health and business executives, with no digital experience. Approving each design decision first required educating them about what was being approved. |
Time was critical. The pandemic wouldn't wait. Every week of delay was another week of overloaded branches and users without digital care. |
The Invisible Challenge: Stakeholders
One part of the work that does not appear in the wireframes was learning how to work with decision-makers who had no digital reference point. Colmena's executives were health and business professionals with decades of experience in their industry, but without the context to evaluate a UX flow.
Designing for non-digital users and convincing non-digital stakeholders at the same time was the project's most complex challenge.
End user Colmena member | Internal client Colmena executives | Technical team Ionic development |
|---|---|---|
Adult 40 to 65 years old. Limited digital proficiency. Needs to handle health procedures without going to a branch during the pandemic. | Decision-makers without a digital background. They approved or rejected proposals based on business intuition, not UX criteria. | Hybrid framework with real visual constraints. The design had to work within what Ionic allowed to implement. |
Results
+35%Increase in active sessions | +18%Adoption of the digital channel | −12%In-person branch visits |
|---|
My process
Auditoría de lo existente
Lo primero fue entender exactamente qué estaba roto y por qué. Mapeé todos los flujos existentes, identifiqué en qué pasos se caían los usuarios y cuáles eran técnicamente no funcionales. Eso nos dio una lista clara de prioridades: los flujos de bono y reembolso eran los más críticos y los más rotos. Por ahí empezamos.
Research con usuarios reales
Hicimos entrevistas y tests de usabilidad con afiliados. El hallazgo más importante fue que los usuarios no abandonaban por pereza, sino por miedo a equivocarse. "No sé si estoy haciendo bien esto" era la frase que más se repetía. Eso cambió el enfoque del diseño: el objetivo principal pasó a ser reducir la ansiedad, no solo la fricción.
Diseño de flujos críticos desde cero
Construí el flujo de compra de bonos y el de reembolso completos en Figma. El principio guía fue mostrar el resumen de costos al inicio, no al final. Simplifiqué el lenguaje: fuera los términos técnicos de seguros de salud, adentro lenguaje cotidiano. Cada pantalla tenía una sola acción posible para no abrumar a un usuario que ya llegaba con ansiedad.
Diseño dentro de las limitaciones de Ionic
onic tenía restricciones visuales reales. No todo lo que diseñaba era implementable sin costo técnico alto. Aprendí a trabajar con el equipo de desarrollo desde el inicio de cada flujo para diseñar dentro de lo posible. Algunas propuestas las simplifiqué, otras las adapté. El resultado no era el UI más pulido del mundo, pero era funcional y usable, que era lo que importaba en ese momento.
Gestión de stakeholders no digitales
Los prototipos interactivos no eran suficientes para convencer a los ejecutivos. Necesitaban ver el problema en su propio lenguaje. Empecé a presentar con datos de sucursales: "Este flujo genera X llamadas de soporte por semana. Si lo resolvemos digitalmente, ese número baja y las sucursales se descongestionan." Los números de negocio y el contexto de pandemia movieron las aprobaciones más que cualquier wireframe.
Testing y ajuste continuo
Hicimos rondas de testing antes de cada release. Con usuarios finales validamos que los flujos eran comprensibles sin explicación previa. Las iteraciones más importantes vinieron de observar a personas reales intentando comprar un bono por primera vez. Eso era imposible de simular en una reunión de stakeholders.
Key design decisions
The most impactful decision was to show the cost summary at the beginning of the bond purchase flow. It was counterintuitive for stakeholders. I argued with the abandonment data we had: most of the users who reached the final step and saw the cost for the first time dropped off. By putting the cost up front, abandonment decreased significantly.
The second decision was to radically simplify the language. The original copy used insurance terminology that users did not understand. We rewrote every label, title, and error message in everyday language. That change did not require additional development and had a direct impact on the completion rate.
The UI was not perfect. But it was the first one that really worked. That was enough to change users' behavior.
With Ionic I learned to distinguish between a real technical limitation and resistance to change from the development team. Some design simplifications that seemed impossible were perfectly implementable when I presented them with the right context. That constant negotiation between the ideal and the possible was one of the most valuable lessons of the project.
Learnings
Functional first, polished later | Fear is friction |
|---|---|
The Ionic UI was not the prettiest. But it was the first one that allowed users to buy a pass without dropping off. In a pandemic context, that mattered more than any animation. | Users were not dropping off because of laziness. They were dropping off because of anxiety. Designing to reduce the fear of making a mistake was more effective than simplifying the steps. |
Speak the business language | Language is UI |
With non-digital stakeholders, wireframes do not convince. Branch data and operational impact do. I learned to translate every design decision into business language. | Rewriting the copy in everyday language was the change with the best effort-to-impact ratio. Without additional development, it improved the completion rate immediately. |
More projects
UI / UX Design
Colmena: Digital Health in Times of Pandemic
How we designed a health insurer's digital experience from scratch during the pandemic, on a broken technical foundation, with non-digital stakeholders, and for users who had never used a health app.
Year:
2020-2021
Industry :
Health — Isapre
Client:
Colmena Health Insurance
Role :
UX/UI
Context
COVID-19 pandemic. Colmena's physical branches collapsed. Users needed to manage vouchers, reimbursements, and health services from home. The problem: the existing app didn't work.
Colmena had an app. It had been built by developers with no experience in product design and without UX involvement. The result was an interface where the most critical flows, buying a voucher and requesting a reimbursement, were broken or so confusing that no one completed them. The app existed, but it wasn't useful.
When the pandemic hit and branches had to reduce their operations, that reality became urgent. I was part of the team brought in to design the real digital experience: not to patch what was there, but to build the right flows from scratch, within the existing technical constraints.
What we found upon arrival
The initial diagnosis was clear. There was an app installed on members' phones, but it worked more like a barrier than a solution.
Initial state | What we built |
|---|---|
Incomplete bond purchase flow. Users got halfway through and couldn't continue. | End-to-end bond purchase flow, with cost summary visible from the start. |
Refunds with no functional flow. They could only be handled in person. | Functional digital refund flow for the first time in the product's history. |
Navigation built by developers without UX criteria. No hierarchy or task logic. | Redesigned navigation architecture centered on the 3 most frequent tasks. |
Insurance technical language incomprehensible to the average user. | Everyday language throughout the interface. Zero insurance jargon. |
40% abandonment in the first 3 minutes of the session. | +35% of active sessions completed in the first 3 months. |
The real challenges
There was no design to inherit. Everything started from scratch in UX terms, but within an already built technical foundation in Ionic that we couldn't change. The design had to adapt to what the framework allowed. |
The end users were older adults or people with low digital familiarity. Designing for someone who has never used a health app is radically different from designing for a tech user. |
The stakeholders were health and business executives, with no digital experience. Approving each design decision first required educating them about what was being approved. |
Time was critical. The pandemic wouldn't wait. Every week of delay was another week of overloaded branches and users without digital care. |
The Invisible Challenge: Stakeholders
One part of the work that does not appear in the wireframes was learning how to work with decision-makers who had no digital reference point. Colmena's executives were health and business professionals with decades of experience in their industry, but without the context to evaluate a UX flow.
Designing for non-digital users and convincing non-digital stakeholders at the same time was the project's most complex challenge.
End user Colmena member | Internal client Colmena executives | Technical team Ionic development |
|---|---|---|
Adult 40 to 65 years old. Limited digital proficiency. Needs to handle health procedures without going to a branch during the pandemic. | Decision-makers without a digital background. They approved or rejected proposals based on business intuition, not UX criteria. | Hybrid framework with real visual constraints. The design had to work within what Ionic allowed to implement. |
Results
+35%Increase in active sessions | +18%Adoption of the digital channel | −12%In-person branch visits |
|---|
My process
Auditoría de lo existente
Lo primero fue entender exactamente qué estaba roto y por qué. Mapeé todos los flujos existentes, identifiqué en qué pasos se caían los usuarios y cuáles eran técnicamente no funcionales. Eso nos dio una lista clara de prioridades: los flujos de bono y reembolso eran los más críticos y los más rotos. Por ahí empezamos.
Research con usuarios reales
Hicimos entrevistas y tests de usabilidad con afiliados. El hallazgo más importante fue que los usuarios no abandonaban por pereza, sino por miedo a equivocarse. "No sé si estoy haciendo bien esto" era la frase que más se repetía. Eso cambió el enfoque del diseño: el objetivo principal pasó a ser reducir la ansiedad, no solo la fricción.
Diseño de flujos críticos desde cero
Construí el flujo de compra de bonos y el de reembolso completos en Figma. El principio guía fue mostrar el resumen de costos al inicio, no al final. Simplifiqué el lenguaje: fuera los términos técnicos de seguros de salud, adentro lenguaje cotidiano. Cada pantalla tenía una sola acción posible para no abrumar a un usuario que ya llegaba con ansiedad.
Diseño dentro de las limitaciones de Ionic
onic tenía restricciones visuales reales. No todo lo que diseñaba era implementable sin costo técnico alto. Aprendí a trabajar con el equipo de desarrollo desde el inicio de cada flujo para diseñar dentro de lo posible. Algunas propuestas las simplifiqué, otras las adapté. El resultado no era el UI más pulido del mundo, pero era funcional y usable, que era lo que importaba en ese momento.
Gestión de stakeholders no digitales
Los prototipos interactivos no eran suficientes para convencer a los ejecutivos. Necesitaban ver el problema en su propio lenguaje. Empecé a presentar con datos de sucursales: "Este flujo genera X llamadas de soporte por semana. Si lo resolvemos digitalmente, ese número baja y las sucursales se descongestionan." Los números de negocio y el contexto de pandemia movieron las aprobaciones más que cualquier wireframe.
Testing y ajuste continuo
Hicimos rondas de testing antes de cada release. Con usuarios finales validamos que los flujos eran comprensibles sin explicación previa. Las iteraciones más importantes vinieron de observar a personas reales intentando comprar un bono por primera vez. Eso era imposible de simular en una reunión de stakeholders.
Key design decisions
The most impactful decision was to show the cost summary at the beginning of the bond purchase flow. It was counterintuitive for stakeholders. I argued with the abandonment data we had: most of the users who reached the final step and saw the cost for the first time dropped off. By putting the cost up front, abandonment decreased significantly.
The second decision was to radically simplify the language. The original copy used insurance terminology that users did not understand. We rewrote every label, title, and error message in everyday language. That change did not require additional development and had a direct impact on the completion rate.
The UI was not perfect. But it was the first one that really worked. That was enough to change users' behavior.
With Ionic I learned to distinguish between a real technical limitation and resistance to change from the development team. Some design simplifications that seemed impossible were perfectly implementable when I presented them with the right context. That constant negotiation between the ideal and the possible was one of the most valuable lessons of the project.
Learnings
Functional first, polished later | Fear is friction |
|---|---|
The Ionic UI was not the prettiest. But it was the first one that allowed users to buy a pass without dropping off. In a pandemic context, that mattered more than any animation. | Users were not dropping off because of laziness. They were dropping off because of anxiety. Designing to reduce the fear of making a mistake was more effective than simplifying the steps. |
Speak the business language | Language is UI |
With non-digital stakeholders, wireframes do not convince. Branch data and operational impact do. I learned to translate every design decision into business language. | Rewriting the copy in everyday language was the change with the best effort-to-impact ratio. Without additional development, it improved the completion rate immediately. |
More projects
UI / UX Design
Colmena: Digital Health in Times of Pandemic
How we designed a health insurer's digital experience from scratch during the pandemic, on a broken technical foundation, with non-digital stakeholders, and for users who had never used a health app.
Year:
2020-2021
Industry :
Health — Isapre
Client:
Colmena Health Insurance
Role :
UX/UI
Context
COVID-19 pandemic. Colmena's physical branches collapsed. Users needed to manage vouchers, reimbursements, and health services from home. The problem: the existing app didn't work.
Colmena had an app. It had been built by developers with no experience in product design and without UX involvement. The result was an interface where the most critical flows, buying a voucher and requesting a reimbursement, were broken or so confusing that no one completed them. The app existed, but it wasn't useful.
When the pandemic hit and branches had to reduce their operations, that reality became urgent. I was part of the team brought in to design the real digital experience: not to patch what was there, but to build the right flows from scratch, within the existing technical constraints.
What we found upon arrival
The initial diagnosis was clear. There was an app installed on members' phones, but it worked more like a barrier than a solution.
Initial state | What we built |
|---|---|
Incomplete bond purchase flow. Users got halfway through and couldn't continue. | End-to-end bond purchase flow, with cost summary visible from the start. |
Refunds with no functional flow. They could only be handled in person. | Functional digital refund flow for the first time in the product's history. |
Navigation built by developers without UX criteria. No hierarchy or task logic. | Redesigned navigation architecture centered on the 3 most frequent tasks. |
Insurance technical language incomprehensible to the average user. | Everyday language throughout the interface. Zero insurance jargon. |
40% abandonment in the first 3 minutes of the session. | +35% of active sessions completed in the first 3 months. |
The real challenges
There was no design to inherit. Everything started from scratch in UX terms, but within an already built technical foundation in Ionic that we couldn't change. The design had to adapt to what the framework allowed. |
The end users were older adults or people with low digital familiarity. Designing for someone who has never used a health app is radically different from designing for a tech user. |
The stakeholders were health and business executives, with no digital experience. Approving each design decision first required educating them about what was being approved. |
Time was critical. The pandemic wouldn't wait. Every week of delay was another week of overloaded branches and users without digital care. |
The Invisible Challenge: Stakeholders
One part of the work that does not appear in the wireframes was learning how to work with decision-makers who had no digital reference point. Colmena's executives were health and business professionals with decades of experience in their industry, but without the context to evaluate a UX flow.
Designing for non-digital users and convincing non-digital stakeholders at the same time was the project's most complex challenge.
End user Colmena member | Internal client Colmena executives | Technical team Ionic development |
|---|---|---|
Adult 40 to 65 years old. Limited digital proficiency. Needs to handle health procedures without going to a branch during the pandemic. | Decision-makers without a digital background. They approved or rejected proposals based on business intuition, not UX criteria. | Hybrid framework with real visual constraints. The design had to work within what Ionic allowed to implement. |
Results
+35%Increase in active sessions | +18%Adoption of the digital channel | −12%In-person branch visits |
|---|
My process
Auditoría de lo existente
Lo primero fue entender exactamente qué estaba roto y por qué. Mapeé todos los flujos existentes, identifiqué en qué pasos se caían los usuarios y cuáles eran técnicamente no funcionales. Eso nos dio una lista clara de prioridades: los flujos de bono y reembolso eran los más críticos y los más rotos. Por ahí empezamos.
Research con usuarios reales
Hicimos entrevistas y tests de usabilidad con afiliados. El hallazgo más importante fue que los usuarios no abandonaban por pereza, sino por miedo a equivocarse. "No sé si estoy haciendo bien esto" era la frase que más se repetía. Eso cambió el enfoque del diseño: el objetivo principal pasó a ser reducir la ansiedad, no solo la fricción.
Diseño de flujos críticos desde cero
Construí el flujo de compra de bonos y el de reembolso completos en Figma. El principio guía fue mostrar el resumen de costos al inicio, no al final. Simplifiqué el lenguaje: fuera los términos técnicos de seguros de salud, adentro lenguaje cotidiano. Cada pantalla tenía una sola acción posible para no abrumar a un usuario que ya llegaba con ansiedad.
Diseño dentro de las limitaciones de Ionic
onic tenía restricciones visuales reales. No todo lo que diseñaba era implementable sin costo técnico alto. Aprendí a trabajar con el equipo de desarrollo desde el inicio de cada flujo para diseñar dentro de lo posible. Algunas propuestas las simplifiqué, otras las adapté. El resultado no era el UI más pulido del mundo, pero era funcional y usable, que era lo que importaba en ese momento.
Gestión de stakeholders no digitales
Los prototipos interactivos no eran suficientes para convencer a los ejecutivos. Necesitaban ver el problema en su propio lenguaje. Empecé a presentar con datos de sucursales: "Este flujo genera X llamadas de soporte por semana. Si lo resolvemos digitalmente, ese número baja y las sucursales se descongestionan." Los números de negocio y el contexto de pandemia movieron las aprobaciones más que cualquier wireframe.
Testing y ajuste continuo
Hicimos rondas de testing antes de cada release. Con usuarios finales validamos que los flujos eran comprensibles sin explicación previa. Las iteraciones más importantes vinieron de observar a personas reales intentando comprar un bono por primera vez. Eso era imposible de simular en una reunión de stakeholders.
Key design decisions
The most impactful decision was to show the cost summary at the beginning of the bond purchase flow. It was counterintuitive for stakeholders. I argued with the abandonment data we had: most of the users who reached the final step and saw the cost for the first time dropped off. By putting the cost up front, abandonment decreased significantly.
The second decision was to radically simplify the language. The original copy used insurance terminology that users did not understand. We rewrote every label, title, and error message in everyday language. That change did not require additional development and had a direct impact on the completion rate.
The UI was not perfect. But it was the first one that really worked. That was enough to change users' behavior.
With Ionic I learned to distinguish between a real technical limitation and resistance to change from the development team. Some design simplifications that seemed impossible were perfectly implementable when I presented them with the right context. That constant negotiation between the ideal and the possible was one of the most valuable lessons of the project.
Learnings
Functional first, polished later | Fear is friction |
|---|---|
The Ionic UI was not the prettiest. But it was the first one that allowed users to buy a pass without dropping off. In a pandemic context, that mattered more than any animation. | Users were not dropping off because of laziness. They were dropping off because of anxiety. Designing to reduce the fear of making a mistake was more effective than simplifying the steps. |
Speak the business language | Language is UI |
With non-digital stakeholders, wireframes do not convince. Branch data and operational impact do. I learned to translate every design decision into business language. | Rewriting the copy in everyday language was the change with the best effort-to-impact ratio. Without additional development, it improved the completion rate immediately. |