VAL. All projects Todos los proyectos
AgendaPro App · Marketplace ONGOING EN CURSO

Turning a B2B SaaS into a consumer-first marketplace — one system at a time.

Convirtiendo un SaaS B2B en un marketplace consumer-first — un sistema a la vez.

Role / Services
Rol / Servicios
Senior Product Designer AI-native Design Systems Design Systems AI-native Spec-driven Design Diseño spec-driven Mobile UX
Tenure
Desde
Dec 2025 — present
Dic 2025 — actualidad
AgendaPro app — home and search screens on iPhone 16 Pro mockup
Project Overview
Resumen del proyecto

LatAm's leading booking SaaS, pivoting to consumer marketplace.

El SaaS de agendamiento líder en LatAm, pivoteando a marketplace consumer.

AgendaPro is LatAm's leading booking software for beauty, wellness and health — 135,000+ professionals across 20 countries, 100M+ appointments a year. I joined as Senior Product Designer for the consumer-facing marketplace app: the product that has to turn a business tool into something end-clients actively want on their phones.

I work in a PM–Dev–PD triad under Shape Up, shipping end-to-end with a tight engineering team — a two-sided marketplace built on top of a mature B2B SaaS, with all the tension that implies.

AgendaPro es el software líder de agendamiento para belleza, bienestar y salud en LatAm — 135.000+ profesionales en 20 países, 100M+ citas al año. Entré como Senior Product Designer de la app B2C del marketplace: el producto que tiene que convertir una herramienta de negocio en algo que los clientes finales realmente quieran en sus teléfonos.

Trabajo en triada PM–Dev–PD con Shape Up, shipping end-to-end con un equipo de ingeniería chico y ajustado — un marketplace de dos lados sobre un SaaS B2B maduro, con toda la tensión que eso implica.

AgendaPro marketplace app — hand holding iPhone with app screen
Strategic Shift
Cambio estratégico

From order and control to a living network.

De orden y control a una red viva.

The B2B SaaS keeps running. But real compounding value lives in connecting supply and demand — consumers discovering, booking and returning while providers gain clients they couldn't reach alone.

This reframing changes decisions at every level. The app isn't a companion to a business tool anymore. It's the front door of a marketplace.

El SaaS B2B sigue funcionando. Pero el valor real se compone al conectar oferta y demanda — consumidores descubriendo, reservando y volviendo, mientras los comercios ganan clientes nuevos que no podían alcanzar solos.

Este reframing cambia decisiones en cada nivel. La app ya no es un companion de la herramienta de negocio. Es la puerta de entrada de un marketplace.

Before · The SaaS era
Antes · Era SaaS

Order and control

Orden y control

A B2B SaaS focused on the provider: scheduling, reminders, invoicing, reports, commissions.

Value prop: "AgendaPro helps you organise your business so you can focus on what matters."

Un SaaS B2B enfocado en el comercio: agenda, recordatorios, facturación, reportes, comisiones.

Propuesta: "AgendaPro te ayuda a ordenar tu negocio para que te preocupes de lo importante."

Pivot Pivot
Now · The marketplace era
Ahora · Era marketplace

A living marketplace

Un marketplace vivo

A two-sided network: end-consumers discover and book, providers gain a reliable source of new clients.

Value prop: when you think beauty, wellness or health — think AgendaPro first.

Una red de dos lados: los consumidores descubren y reservan, los comercios ganan una fuente confiable de clientes nuevos.

Propuesta: cuando piensas en belleza, bienestar o salud — piensa primero en AgendaPro.

How I work
Cómo trabajo

Systems that survive when I'm not in the room.

Sistemas que sobreviven cuando no estoy en la sala.

My differentiator isn't speed or visual craft — I have both, but they're not what makes my work distinct. What's distinct is that I build systems — specs, Design Systems, processes — that keep working after I hand them off.

Three principles are the ones I apply every week. They're not branding; they're how the work actually gets done.

Mi diferencial no es velocidad ni oficio visual — tengo ambos, pero no son lo que distingue mi trabajo. Lo que distingue es que construyo sistemas — specs, Design Systems, procesos — que siguen funcionando cuando los entrego.

Hay tres principios que aplico cada semana. No son branding; son cómo se hace el trabajo realmente.

01

Spec-driven before pixel-driven.

Spec-driven antes de pixel-driven.

I write what a screen does — behaviour, states, edge cases — in markdown, before I open Figma. For bigger shapes I go further and build high-fidelity HTML prototypes using DS tokens. Decisions live in specs and real behaviour, not in my head and not in a pretty frame.

Escribo qué hace una pantalla — comportamiento, estados, casos borde — en markdown, antes de abrir Figma. Para shapes grandes voy más allá y construyo prototipos HTML de alta fidelidad con tokens del DS. Las decisiones viven en specs y comportamiento real, no en mi cabeza ni en un frame bonito.

02

AI & data as daily sparring.

IA y datos como sparring diario.

Claude + Figma and Notion MCPs are part of my daily process — research, synthesis, prototyping, DS sync. Same for data: I model scenarios with cohort numbers before writing a PRD. "I feel it should work this way" doesn't go in a spec — a behavioural finding or a funnel insight does.

Claude + MCPs de Figma y Notion son parte de mi proceso diario — research, síntesis, prototipado, sync del DS. Lo mismo con data: modelo escenarios con números de cohorte antes de escribir un PRD. "Me parece que debería ser así" no va en una spec — un hallazgo conductual o un insight de funnel sí.

03

Experience over surface.

Experiencia antes que superficie.

Every shape is defended by asking "does this make the user's life easier, or add friction?" — not "does this complete the roadmap?" The end-client has to understand without being trained, so I design for their moment first and let the business side adapt. Contracultural in a company that grew up as B2B SaaS.

Cada shape se defiende preguntando "¿esto hace la vida del usuario más fácil, o le agrega fricción?" — no "¿esto completa el roadmap?". El cliente final tiene que entender sin ser entrenado, así que diseño primero para su momento y el lado del negocio se adapta. Contracultural en una empresa que creció como SaaS B2B.

I build systems that survive when I'm not in the room.
Construyo sistemas que sobreviven cuando no estoy en la sala.
— Designer's note
Design System
Design System

Opal Pro — an AI-native Design System.

Opal Pro — un Design System AI-native.

Before I arrived, the app had been assembled feature by feature — each screen with its own spacing, type and component logic. A formal audit put compliance baseline around 37%: wrong primaries, chips conflated with tabs, empty states built by hand, gradients hardcoded where tokens should live.

The DS existed as a library. It didn't exist as infrastructure. So I refounded it.

Opal Pro is the result — 43 components, 27 semantic colours, 11 typographic styles (consolidated down from 15 — a DS wins when it has fewer options, not more). Every component ships versioned JSON metadata synced from Figma. That's what makes it AI-native: Claude agents and engineers read the same source of truth without asking me.

Antes de que yo llegara, la app se armó feature por feature — cada pantalla con su propio spacing, tipografía y lógica. Una auditoría formal dio un baseline de compliance del 37%: primaries equivocados, chips confundidos con tabs, empty states hechos a mano, gradientes hardcodeados donde deberían vivir tokens.

El DS existía como librería. No existía como infraestructura. Así que lo refundé.

Opal Pro es el resultado — 43 componentes, 27 colores semánticos, 11 estilos tipográficos (consolidados hacia abajo desde 15 — un DS gana cuando tiene menos opciones, no más). Cada componente trae metadata JSON versionada sincronizada desde Figma. Eso es lo que lo vuelve AI-native: agentes y engineers leen la misma fuente de verdad sin preguntarme.

Opal Pro Design System — typography playground in iOS simulator with Claude Code and Xcode
43
Components — 18 atoms, 8 shared molecules, 17 module-local
Componentes — 18 átomos, 8 moléculas compartidas, 17 locales
27
Semantic colour tokens consolidated from legacy palette
Tokens de color semánticos consolidados desde paleta heredada
11↓ from 15
Typographic styles — consolidated 27%, not expanded
Estilos tipográficos — consolidados 27%, no expandidos
43
Figma doc pages — Summary / Patterns / Reference per component
Páginas de doc en Figma — Resumen / Patrones / Referencia por componente
Rebuilding the core
Reconstruir el core

Rebuilding the spine of the app.

Reconstruyendo la columna vertebral de la app.

With Opal Pro in place, I redesigned the four screens that carry most of the product's weight: Home, Search, Scheduler and My Bookings. Every screen rebuilt on the new system — consistent components, clear hierarchy, coherent patterns across the flow.

Special focus on Search — discovery, not conversion, is the real bottleneck. People sign up, land on home, and too many never see a provider's profile.

Con Opal Pro en su lugar, rediseñé las cuatro pantallas que cargan más peso del producto: Home, Search, Scheduler y Mis Reservas. Cada pantalla reconstruida sobre el nuevo sistema — componentes consistentes, jerarquía clara, patrones coherentes en todo el flujo.

Foco especial en Search — descubrimiento, no conversión, es el verdadero cuello de botella. La gente se registra, llega a home, y demasiados nunca ven el perfil de un comercio.

Before Antes
Home screen before redesign
After Después
Home screen after redesign
Search redesign
Rediseño de búsqueda

Discovery, not just search.

Descubrimiento, no solo búsqueda.

The old search acted like a directory filter. The new one behaves like discovery — prompts, recent searches, location input, category shortcuts, empty states that guide rather than punish. Built for the user who doesn't yet know what they're looking for.

La búsqueda anterior funcionaba como un filtro de directorio. La nueva se comporta como descubrimiento — prompts, búsquedas recientes, input de ubicación, atajos por categoría, estados vacíos que guían en vez de castigar. Construido para el usuario que todavía no sabe qué está buscando.

Before Antes
After Después
Shapes shipped & in motion
Shapes entregados y en curso

Eight shapes end-to-end in five months.

Ocho shapes end-to-end en cinco meses.

Every shape starts the same way: evidence review, PRD, flow map in FigJam, specs per screen, HTML prototypes, decision, Figma handoff.

Cada shape arranca igual: revisión de evidencia, PRD, flow map en FigJam, specs por pantalla, prototipos HTML, decisión, handoff a Figma.

Still in progress
En curso

Designing for a product that keeps becoming itself.

Diseñando para un producto que sigue volviéndose él mismo.

Unlike the other cases in this portfolio, this one isn't finished. The pivot is live, the marketplace is compounding, and the product changes every sprint.

What I take from it so far: the most interesting design work at a mature SaaS isn't inside the features — it's at the strategic seams. Where the business model is changing. Where a B2B company learns to talk to consumers. Where a Design System has to enable velocity without flattening the product's personality.

A diferencia de los otros casos de este portfolio, este no está cerrado. El pivot está vivo, el marketplace se está componiendo, y el producto cambia cada sprint.

Lo que me llevo hasta ahora: el trabajo de diseño más interesante en un SaaS maduro no vive dentro de los features — vive en las costuras estratégicas. Donde el modelo de negocio cambia. Donde una empresa B2B aprende a hablarle al consumidor. Donde un DS tiene que habilitar velocidad sin aplanar la personalidad del producto.

⁃ Strategic details, internal metrics and specific numbers remain confidential. This case focuses on publicly-visible scope, role, and decisions. ⁃ ⁃ Los detalles estratégicos, métricas internas y números específicos se mantienen confidenciales. Este caso se enfoca en scope público, rol y decisiones. ⁃

Let's build something meaningful together.

Construyamos algo con sentido juntas/os.

Get in touch Hablemos