Saltar al contenido
Volver a proyectos
FixxyApp

FixxyApp

Exploramos cómo las personas buscan y contratan servicios en Honolulu, uno de los destinos turísticos más concurridos de Estados Unidos, para identificar fricciones y oportunidades de mejora en la experiencia digital.
Cliente
FixxyApp
Rol
UX/UI Designer · Product
Año
2025
Herramientas
Figma
Entregables e impacto
01
Auditoría UX y benchmark de cuatro competidores del sector
02
12 insights de testeo con usuarios finales y prestadores
03
Prototipo de alta fidelidad navegable en Figma (Home, Explore, Profile y vendor onboarding)
04
Design system completo: paleta, tipografía, espaciado, radios, sombras e iconografía

Rediseño de plataforma de servicios

Contexto y objetivos

Una necesidad

FixxyApp ofrece diferentes tipos de servicios dentro de su app, desde quien te corte el césped hasta una niñera.

Nuestro modelo de negocio apunta hacia un marketplace de servicios completamente gratis para los usuarios y los vendors, por lo que es importante mejorar día a día nuestro engagement.

Plataforma: Mobile Android/IOS

Lo que se encontró

El 65% de los usuarios les interesa revisar imágenes y/o videos relacionados a los proyectos que realizan los vendors.

El 80% de los encuestados adquieren servicios en apps locales o generales, esto les genera una inmediatez para satisfacer sus necesidades lo más pronto posible.

Objetivo del rediseño

  • Generar confianza y percepción de seguridad
  • Mejorar onboarding y propuesta de valor para proveedores (vendors)
  • Mejorar el engagement
  • Preparar la interfaz para escalabilidad
  • Aumentar la conversión de contratación de servicios

Auditoría y Benchmark

Cómo se empezó

Analicé la app actual y la comparé con diferentes marketplaces de USA, competencia directa e indirecta.

Competencia directa

Mismo modelo, mismo usuario, mismo problema.

  • TaskRabbit: Marketplace de servicios del hogar con match entre usuario y profesional, pago dentro de la plataforma.
  • Handy: Misma categoría, mismo flujo, mismo mercado angloparlante donde Fixxy opera (Honolulu, Hawaii).

Competencia indirecta

Resuelven el mismo problema pero con un modelo diferente o en un mercado adyacente.

  • Thumbtack: Conecta usuarios con profesionales pero funciona más como directorio con cotizaciones, no como marketplace de booking directo. El pago ocurre fuera de la plataforma en muchos casos.
  • GetNinjas: Mismo concepto pero mercado Latam (Brasil principalmente), y el pago también ocurre fuera de la plataforma, sin escrow nativo.

Resumen de competidores

Matriz de dimensiones

El reto

Identificando el problema

Después de analizar la interfaz de FixxyApp, identifiqué 3 fricciones críticas que podrían limitar la retención de usuarios y generar confusión durante el uso de la aplicación.

1. Desalineación entre la intención de uso y el formato social (Home/Feed)

Problema: El punto de entrada actual utiliza un patrón similar al de una red social, lo que no se alinea con la intención principal de un marketplace de servicios.

Impacto en el engagement: Los usuarios no reciben estímulos inmediatos para resolver una necesidad específica, lo que limita la exploración y el tiempo de permanencia, ya que no encuentran una relevancia directa desde el primer momento.

Evidencia: El feed muestra imágenes de gran tamaño con poca información contextual sobre la utilidad, el precio o la cercanía de los servicios.

2. Sobrecarga cognitiva durante la exploración (Vista de mapa)

Problema: Los marcadores del mapa aparecen agrupados, generando una alta carga visual y cognitiva.

Impacto en el engagement: Esto obliga al usuario a realizar múltiples intentos de prueba y error para encontrar lo que busca. Esta fricción en la navegación geográfica desincentiva el descubrimiento de nuevos servicios en la zona.

Evidencia: Un usuario que busca un electricista no puede diferenciar visualmente de un paseador de perros sin interactuar individualmente con cada marcador.

3. Brecha de confianza y fricción en la conversión

Problema: El flujo de reserva es ambiguo y presenta mensajes del sistema que pueden resultar confusos al intentar contratar un servicio.

Impacto en el engagement: La falta de retroalimentación clara sobre el siguiente paso genera incertidumbre. Si el usuario no comprende qué ocurre con su dinero o con su solicitud, es más probable que abandone el proceso antes de completar la transacción.

Evidencia: Pasar directamente desde un botón de reserva a un chat, sin una confirmación clara del estado de la solicitud, rompe el modelo mental de una transacción segura y confiable.

Oportunidades

El objetivo principal del rediseño es alejar la percepción de la aplicación de una red social. Para lograrlo, la actualización va más allá de una mejora estética; introduce un tono profesional pero cercano mediante el uso estratégico de llamadas a la acción (CTA) en botones y campos de entrada.

Mejoras principales

Acceso directo mediante categorías

La incorporación de chips interactivos de categorías (por ejemplo, Plomería, Limpieza) justo debajo de la barra de búsqueda facilita una navegación mucho más rápida que la búsqueda individual de profesionales a través del mapa o del feed.

Sección "Explora opciones cercanas"

A diferencia de la aplicación actual, donde el feed presenta imágenes grandes sin un contexto claro, la nueva interfaz utiliza tarjetas compactas que muestran el nombre del servicio, calificaciones y un botón de acción visible, facilitando el descubrimiento y la toma de decisiones.

Fortalecimiento de la confianza y la credibilidad

Prueba social (Reseñas)

El nuevo diseño incorpora una sección llamada "Mejores experiencias", que muestra reseñas detalladas con insignias de "Verificado", marcas de tiempo y distancia exacta (por ejemplo, "1,6 km"). En la versión actual mostrada en el video, el feed solo exhibía fotografías de gran tamaño sin información relacionada con la satisfacción de los clientes.

Portafolios relevantes

Esta mejora aborda uno de los principales puntos de fricción detectados. Mientras que en el video se mostraba un paseador de perros con herramientas mecánicas en su portafolio, el nuevo diseño de perfil profesional (por ejemplo, José Berríos) presenta imágenes coherentes con los servicios de plomería, junto con años de experiencia y la cantidad de proyectos completados.

Orientación del proceso

Se añadió una sección llamada "Comenzar es simple" dentro del perfil profesional, donde se explican claramente los pasos para contratar un servicio: enviar una solicitud, confirmar disponibilidad y realizar un pago seguro. Esto reduce significativamente la incertidumbre y la ansiedad de los usuarios que utilizan la plataforma por primera vez.

Engagement

Principios de engagement

1. Reducción de la fricción en la toma de decisiones (El efecto Google)

En la aplicación original, los usuarios llegaban a un feed genérico con una estructura similar a la de una red social, donde debían "adivinar" cuál era el siguiente paso.

Intención clara desde el primer segundo: Al implementar una barra de búsqueda orientada a servicios ("¿Qué servicio estás buscando?") junto con chips de categorías, se elimina gran parte de la carga cognitiva del usuario.

Acceso rápido: Los usuarios ya no navegan simplemente para "ver qué hay disponible"; ahora ingresan con el objetivo de encontrar una solución específica, lo que reduce considerablemente la tasa de abandono inicial.

2. Gamificación y curiosidad (Exploración guiada)

En la aplicación original, todos los marcadores del mapa aparecen agrupados y sin diferenciación por categoría, generando ruido visual y dificultando la exploración.

Retroalimentación visual inmediata: Al diferenciar los marcadores según el tipo de servicio, el mapa se transforma en una herramienta de exploración dinámica y más intuitiva.

Descubrimiento de necesidades no identificadas: Secciones como "Explora opciones cercanas" o "Mejores experiencias" motivan a los usuarios a seguir explorando el contenido, no por entretenimiento, sino para descubrir servicios relevantes y de valor. Esto incrementa significativamente el tiempo de permanencia de calidad dentro de la aplicación.

3. La confianza como moneda de cambio (Prueba social)

La principal barrera para la interacción en plataformas de servicios locales es la incertidumbre frente a lo desconocido. En la versión anterior, los perfiles resultaban confusos y con frecuencia contenían imágenes poco relevantes para el servicio ofrecido.

Validación en tiempo real: La incorporación de insignias de "Verificado", contadores de "Proyectos realizados" y testimonios que incluyen distancias exactas (por ejemplo, "1,6 km") genera la percepción de una comunidad activa, confiable y transparente.

El efecto de proximidad: Saber que una persona ubicada a solo 500 metros tuvo una experiencia positiva proporciona la confianza necesaria para que el usuario avance al siguiente paso y complete la contratación del servicio.

4. Ciclo de retroalimentación y cierre del proceso

La aplicación original dejaba a los usuarios en un estado de incertidumbre después de intentar realizar una reserva, mostrando mensajes del sistema confusos que interrumpían la experiencia.

Confirmación de la acción: La nueva pantalla de "Éxito" junto con la integración de calendario permiten cerrar correctamente el ciclo psicológico del usuario, entregando una confirmación clara de que la acción fue completada con éxito.

Retención impulsada por la utilidad: Al incorporar una pestaña de "Calendario", la aplicación deja de ser únicamente una herramienta para buscar servicios y se convierte también en una herramienta de gestión. Esto incentiva a los usuarios a regresar regularmente a la plataforma para administrar sus citas, fortaleciendo la retención a largo plazo.

Primera iteración del rediseño

Pantalla principal: de navegación pasiva a resolución activa

El objetivo fue transformar un feed social genérico en un centro proactivo y orientado a la resolución de necesidades dentro del marketplace local.

1. Jerarquía basada en la intención del usuario

Búsqueda semántica: Se reemplazó la búsqueda centrada únicamente en la ubicación por un campo de búsqueda enfocado en las necesidades del usuario: "¿Qué servicio estás buscando?"

Chips de categorías: Se incorporó una fila de acceso directo a categorías (Plomería, Limpieza, etc.), permitiendo segmentar servicios con un solo toque y eliminando la carga cognitiva asociada a la exploración sin filtros.

2. Fortalecimiento de la prueba social

Para proporcionar el contexto que faltaba en la aplicación original, se diseñó la sección "Mejores experiencias":

Proximidad y actualidad: Cada reseña muestra la distancia exacta (por ejemplo, "1,5 km") y el tiempo transcurrido desde la experiencia, reforzando la propuesta de valor basada en la inmediatez y cercanía de los servicios locales.

Señales de confianza: Se integraron insignias de "Verificado" para generar credibilidad instantánea antes de que el usuario acceda al perfil de un profesional.

3. Tarjetas orientadas a la conversión

Los nuevos perfiles profesionales dentro de la sección "Los mejores profesionales" están diseñados para transmitir autoridad y confianza:

Métricas de desempeño: Se destacan de forma clara indicadores como el volumen de trabajo realizado (por ejemplo, "80+ proyectos") y las calificaciones obtenidas.

Acceso directo: Un CTA de "Ver perfil" dirige al usuario directamente a las evidencias de trabajo del profesional, solucionando el problema detectado de portafolios irrelevantes o poco representativos.

4. Utilidad estructural

Integración con calendario: Se añadió un ícono de "Calendario" en la barra de navegación, transformando la aplicación de una simple herramienta de búsqueda en una solución integral para la gestión de servicios y citas. Esto aporta valor continuo y fomenta el retorno recurrente de los usuarios a la plataforma.

Optimización de la exploración geoespacial

Diferenciación iconográfica: Se implementaron pines específicos por categoría (por ejemplo, una huella para servicios de mascotas), permitiendo a los usuarios identificar visualmente los servicios cercanos sin necesidad de interactuar previamente con cada marcador.

Búsqueda híbrida y filtros avanzados: Se añadió una barra de búsqueda que combina "servicio + ubicación", junto con un botón de filtros avanzados para segmentar resultados por radio de distancia, calificación y disponibilidad.

Dualidad de vistas (Mapa/Lista): Se incorporó un selector claro para alternar entre la vista de mapa y la vista de lista, adaptándose a los distintos modelos mentales de búsqueda de los usuarios.

Tarjeta de vista rápida: Al seleccionar a un profesional (por ejemplo, Mariana López), se despliega una tarjeta con información clave:

  • Disponibilidad en tiempo real: Muestra horarios específicos disponibles (por ejemplo, "Hoy, 15:00 hrs").
  • Transparencia en costos: Destaca claramente la tarifa por hora del servicio.
  • Acceso directo: Incluye botones de "Reservar ahora" y "Chatear" para agilizar el flujo de conversión.

Perfiles de alta confianza

  • Validación basada en datos: Se implementaron métricas de desempeño clave en el encabezado del perfil —años de experiencia, proyectos completados y tareas realizadas— para otorgar autoridad y credibilidad inmediata al profesional.
  • Curación del portafolio: El nuevo diseño garantiza una correspondencia perfecta entre el servicio ofrecido y la evidencia visual presentada. En el caso de José Berríos (Plomero), el portafolio ahora muestra proyectos reales de plomería, eliminando la confusión visual observada en la versión original.
  • Guía del proceso "Comenzar es simple": Se añadió una explicación clara del proceso en tres pasos (Enviar solicitud, Confirmar disponibilidad y Pago seguro). Esto educa al usuario sobre el flujo de contratación y reduce la incertidumbre o el temor al compromiso antes de realizar una reserva.
  • Interacción optimizada: Un destacado botón de "Reservar ahora" se complementa con una opción secundaria de chat para consultas rápidas, manteniendo siempre el foco en el principal objetivo de conversión.

Wireframes

Cómo fue el proceso de diseño

Partí desde los hallazgos de research para definir flujos clave y estructura de la información, luego exploré distintas alternativas en wireframes de baja fidelidad, iteré con el equipo y con usuarios, y finalmente llegué a versiones de mayor fidelidad listas para prototipar y probar.

Primera iteración

Wireframes en baja fidelidad

Wireframes en alta fidelidad

Testeo con usuarios reales

Se realizaron pruebas de usabilidad con métricas cualitativas para validar los cambios que se realizaron y poder iterar en el flujo para entregar un servicio de mayor alto valor para nuestros usuarios.

Pasos de la prueba

Pruebas realizadas

1. Primera impresión / Prueba del primer clic

Tiempo estimado: 3–5 segundos

Objetivo: Verificar qué entienden los usuarios al ver el nuevo feed.

Preguntas:

  • ¿De qué crees que se trata esta aplicación?
  • ¿Qué es lo primero que harías aquí?

Una vez que el usuario responda estas preguntas, podemos proporcionar una breve explicación de la aplicación actual. Usando esto como una actividad inicial para romper el hielo, continuaremos con una prueba de usabilidad moderada (basada en tareas).

Objetivo: Observar si los usuarios comprenden el flujo específico que estamos desarrollando.

Tareas típicas:

  • Encuentra a alguien para limpiar tu casa hoy.
  • Busca un servicio de corte de césped cerca de ti.
  • Reserva (simulado) y paga un servicio directamente desde el chat.

Comprensión de estados y confianza

Durante la simulación de reserva/pago:

  • ¿Entienden cuándo un servicio ha sido aceptado?
  • ¿Son conscientes de que el pago se procesa mediante Stripe?
  • ¿Saben qué ocurrió con su dinero al final del proceso?

Buenas prácticas:

  • Medir el tiempo de finalización de cada tarea.
  • No ayudar al usuario a completar las tareas.

2. Usuarios objetivo

Usuarios finales (Clientes)

Tamaño de muestra: 6–8 participantes.

Perfil: Personas que actualmente usan o han utilizado aplicaciones como Uber, Rappi, Uber Eats, Cornershop, Lyft, Instacart, TaskRabbit, Femm, Urban Company, etc.

Objetivo: Ver si navegan rápidamente por el feed, encuentran servicios fácilmente y evalúan su experiencia con el flujo de reserva/pago.

Proveedores / Prestadores de servicios locales

Tamaño de muestra: 4–6 participantes.

Rubros: Limpieza, jardinería, electricidad, gasfitería, cuidado de mascotas, etc.

Objetivo:

  • Determinar si perciben valor en el bloque de "Servicios destacados" (promoción pagada).
  • Validar si el flujo de contratación y pago les entrega una sensación de seguridad.

Insights

Los 12 insights levantados

Tabla ordenada por número de insight. Cada insight está desarrollado en detalle en las páginas siguientes.

#InsightÁreaRiesgoImpactoEsfuerzo
01El eslogan queda cortado y el valor de la app no es claro de inmediatoOnboardingAltoAltoMedia
02El buscador no es el hero — el usuario no sabe qué hacer primeroHome ScreenAltoAltoMedia
03'Promoted' genera desconfianza activa — el usuario filtra mentalmente esos resultadosListings / ExplorarAltoAltoBaja
04Falta de prueba social visual — los proveedores no muestran trabajo terminadoListings / ExplorarMedioAltoMedia
05Book Now ejecuta sin confirmación — genera ansiedad y desconfianza en el flujoBooking FlowAltoAltoAlta
06Inconsistencia de precio entre vistas quiebra la confianza justo antes de pagarBooking FlowMedioAltoMedia
07El chat no se percibe como canal directo con el proveedor — reduce el engagement post-bookingChat / ComunicaciónMedioAltoBaja
08El sistema de escrow no está comunicado — el usuario no sabe que su dinero está protegidoTrust & SafetyAltoAltoMedia
09No hay mecanismo de evidencia post-servicio — el usuario no puede resolver disputasTrust & SafetyMedioMedioAlta
10Opciones de pago limitadas — usuarios con hábitos de pago distintos se quedan fueraPaymentMedioMedioAlta
11No hay loop de retención visible — el usuario no tiene razón para volver después del primer servicioRetentionAltoAltoAlta
12El badge 'Verified' es la señal de confianza más fuerte — no se aprovecha al máximoHome ScreenBajoMedioBaja

Las mejoras

Creación de un prototipo de alta fidelidad

Home feed

Antes vs Después — Evolución de Feed

Antes: La pantalla de Feed no comunicaba claramente la propuesta de valor de la aplicación, dando la impresión de estar enfocada únicamente en servicios de limpieza. La navegación no incentivaba el descubrimiento ni la retención, y faltaban elementos que generaran confianza o motivos para volver a utilizar la plataforma.

Después: El nuevo Feed se transforma en un punto de entrada más claro y atractivo, priorizando la búsqueda, categorías rápidas y contenido relevante. Se incorporan señales de confianza como profesionales verificados, pagos protegidos y prueba social, además de secciones personalizadas como favoritos y proveedores guardados. La experiencia pasa de ser una herramienta transaccional a un espacio de descubrimiento continuo de servicios locales.

Explore

Antes vs Después — Evolución de Explore

Antes: Explore funcionaba principalmente como una vista de mapa/listado básico, donde los usuarios tenían poca información para evaluar proveedores. La experiencia no entregaba suficiente contexto sobre precios, disponibilidad, calidad del servicio ni seguridad del pago, generando dudas antes de reservar. El chat no era claro y la exploración se sentía limitada.

Después: Explore evoluciona hacia una herramienta de búsqueda más guiada y confiable. Se incorporan vistas de Mapa y Lista, tarjetas de proveedores con información relevante, filtros, precios y disponibilidad visibles, además de señales de confianza como pago protegido y profesionales verificados. La experiencia facilita comparar opciones, conversar con proveedores y avanzar con mayor seguridad hacia la reserva.

Profile

Antes vs Después — Evolución de Profile

Antes: El perfil del profesional funcionaba principalmente como una vista informativa, con poca estructura para ayudar al usuario a tomar una decisión. La información sobre servicios, cobertura y confianza no estaba suficientemente organizada, dificultando evaluar si el proveedor era adecuado antes de contratar.

Después: El perfil evoluciona hacia una herramienta de conversión más completa, organizada en tres secciones: Portafolio, Servicios y Reseñas. Se incorpora información clave como zona de servicio, mapa de cobertura, detalles de servicios y opiniones de otros usuarios. Además, los botones de Chat y Reservar permanecen visibles para facilitar la contratación en cualquier momento.

Nuevo flujo del vendor onboarding

Antes

La plataforma no contaba con un flujo claro para que los usuarios pudieran convertirse en proveedores de servicios. No existía una experiencia guiada que permitiera configurar información profesional, definir servicios, establecer disponibilidad ni generar confianza antes de comenzar a recibir solicitudes.

Después

Se crea un nuevo flujo de registro y configuración de Vendor, diseñado para transformar a un usuario en un profesional listo para ofrecer servicios dentro de FixxyApp.

El proceso guía al usuario paso a paso para completar su perfil:

  • Creación del perfil profesional: El usuario ingresa información básica, agrega foto de perfil y selecciona los servicios que ofrece.
  • Configuración del servicio: Puede definir categorías, subcategorías, descripción, modalidad de cobro y tarifas, permitiendo presentar una oferta más clara a futuros clientes.
  • Definición de cobertura y disponibilidad: Se configura la zona donde trabaja mediante ubicación y radio de servicio, además de horarios disponibles.
  • Construcción del portafolio: El proveedor puede subir imágenes de proyectos realizados para demostrar experiencia y aumentar la confianza.
  • Validación y activación: Al finalizar, el sistema confirma requisitos completados como identidad, información comercial y método de pago, habilitando el perfil para comenzar a recibir solicitudes.

Resultado

El nuevo flujo convierte el proceso de convertirse en proveedor en una experiencia guiada, reduciendo fricción y aumentando la confianza. El usuario pasa de no tener presencia dentro de la plataforma a contar con un perfil profesional completo, preparado para conectar con clientes y generar ingresos.

Design System

Fundamentos del sistema

Paleta de colores

Indigo cálido como primary (confianza + personalidad), Teal como secondary (frescura + verificación), Amber como accent (calidez + energía).

Primary

Secondary

Accent

Colores semánticos

Neutrals

Tipografía

Plus Jakarta Sans para headings (geométrica con personalidad) + Inter para body (diseñada para pantallas).

TokenTamaño / InterlineadoUsoRecomendación
4xl40px/48 · -1.0Display headingSolo hero screens grandes
3xl34px/42 · -0.8Hero textTitle1 / display según espacio
2xl28px/36 · -0.6Screen titleTitle1 / display: más estándar
xl24px/32 · -0.4Section titleTitle2 — Más presencia
lg20px/28 · -0.3Card titleTitle3 / headline
md17px/24 · -0.2Subtitle / NameHeadline / body principal
base15px/22 · 0Body textSubheadline → body principalmente
sm13px/18 · +0.2Secondary labels, metadataFootnote — para metadata
xs11px/16 · +0.4Captions, timestamps, badgesCaption2 — timestamps y badges

Font Weights

Regular 400Medium 500SemiBold 600Bold 700
Body text, descriptionsLabels, subtitlesButtons, linksHeadings, prices

Espaciado

Base de 4px. Cada step es un múltiplo de 4px para granularidad fina en mobile.

Radios de borde

Bordes redondeados para transmitir accesibilidad y cercanía. Diferencia visual respecto a competidores.

Sombras y elevación

4 niveles de elevación. Sombras con base neutral-900 para mantener calidez.

Iconografía

Phosphor Icons recomendado. Estilo friendly con bordes redondeados. Variantes: regular, fill, duotone.

Lo que se aprendió

La confianza no se diseña, se construye.

El hallazgo más contundente del testeo fue que el escrow, que era el diferenciador más potente de Fixxy frente a la competencia, era invisible para los usuarios. Nadie sabía que su dinero estaba protegido. Eso me enseñó que una feature técnica sin comunicación UX clara simplemente no existe para el usuario.

Los usuarios castigan más la ambigüedad que los errores.

El insight del "Book Now sin confirmación" (insight 05) fue revelador: el botón funcionaba correctamente, pero la ausencia de feedback generaba más ansiedad que un error real. Aprendí que el diseño de estados intermedios —cargando, procesando, confirmado— es tan importante como el flujo principal.

El "promoted" destruye más de lo que vende.

Ver que los usuarios filtraban mentalmente los resultados patrocinados (insight 03) cambió mi perspectiva sobre los modelos de monetización. Un marketplace gratuito que introduce publicidad mal integrada puede destruir la confianza que se intentó construir en el resto del diseño.

Validación

Se realizaron pruebas de usabilidad utilizando la función Motion de Figma para crear un prototipo funcional, optimizando recursos de producción y permitiendo validar las iteraciones y mejoras propuestas antes del desarrollo final.

Estas pruebas fueron realizadas tanto con stakeholders del equipo de FixxyApp como con usuarios finales, con el objetivo de validar la solución, recopilar feedback y asegurar la alineación con la propuesta de valor del negocio.

Gracias

Quiero agradecer a quienes entregaron retroalimentación y me apoyaron en la mejora constante de FixxyApp: Sebastián Castillo, Nicolás Arancibia, Johan Reyes, Taren Parley, Ganesh Vardhanapu y Mervin Raja.

Siguiente proyecto
ClientHub

ClientHub

Portal B2B de Koywe donde los clientes revisan el estado de sus órdenes y gestionan sus transacciones on/off-ramp sin depender del soporte técnico.