BUILD YOUR IDEA

LEONTERCERO · César Estrada

Portafolio de César Estrada. Diseño gráfico, desarrollo web y marketing para marcas y productos digitales, desde Querétaro, México. Cotiza tu proyecto en línea.

Proyectos

Medzquare

Infraestructura de procurement para la investigación de mercados en salud

Marketplace B2B SaaS que conecta clientes de investigación con proveedores de muestra a través de un sistema estructurado de RFQ y bidding. Sustituye el caos del correo electrónico por un flujo de trabajo centralizado, comparable y auditable.

Producto SaaS. 2025 — 2026. Rol: Fundador, Product designer, Desarrollador full stack. Stack: Next.js 16, TypeScript, Supabase, PostgreSQL + RLS, CSS Variables, Vercel, Cloudflare, Stripe.

El reto

La compra de trabajo de campo en investigación de mercados en salud sigue viviendo en el correo electrónico. Un project manager manda el mismo brief a doce proveedores, recibe doce formatos distintos de cotización, y termina construyendo a mano una hoja de cálculo para poder comparar peras con peras.

El costo no es solo tiempo. Es falta de trazabilidad, márgenes que nadie mide, proveedores que quedan esperando una respuesta que nunca llega, y decisiones de compra que se toman con información incompleta.

El reto era convertir un proceso conversacional y desordenado en una estructura de datos, sin que se sintiera como llenar un formulario de gobierno.

Cómo lo abordé

Modelar el flujo antes que la interfaz

El primer trabajo no fue de diseño, fue de arquitectura de dominio. Definí las entidades reales del negocio: organización, RFQ, bid, sample plan, proyecto adjudicado. Y definí tres roles estrictos en base de datos, client, partner e hybrid, con un flag separado para el administrador de la organización.

Esa decisión temprana evitó el problema más común en marketplaces de dos lados: mezclar permisos de compra y de venta en la misma cuenta y terminar con reglas de acceso imposibles de mantener.

Convertir el brief en un wizard de 8 pasos

El RFQ Wizard toma lo que antes era un correo de texto libre y lo descompone en campos tipados: mercados, especialidades, incidencia, duración de la entrevista, cuotas, honorarios. Cada campo que se estructura es un campo que después se puede comparar, filtrar y analizar.

El formulario del proveedor es el espejo exacto del wizard. Por eso los bids llegan alineados y se pueden poner uno junto a otro en una misma cuadrícula.

Cerrar el ciclo, no solo abrirlo

Casi todas las herramientas de cotización se olvidan del final. Aquí, cuando el cliente adjudica un proyecto, la plataforma cierra automáticamente los bids no ganadores y notifica a cada proveedor con un mensaje claro. Ningún proveedor se queda esperando.

Después de la adjudicación, el sample plan se vuelve un objeto vivo con avance en tiempo real, y el KanBan de pipeline permite ver todos los proyectos en vuelo de un solo golpe de vista.

Decisiones técnicas

CSS Variables en lugar de Tailwind

El producto necesitaba un sistema de diseño propio y consistente en cientos de pantallas. Las variables CSS nativas dieron control total sobre tokens de color, tipografía y espaciado sin acoplar el markup a nombres de clases utilitarias.

Row Level Security desde el día uno

En un marketplace donde compradores y vendedores comparten base de datos, la seguridad no puede vivir solo en el frontend. RLS activo en las tablas centrales significa que el aislamiento de datos se garantiza en la capa más profunda.

Modelo de precios de dos lados

Suscripción del lado de la compra con un modelo de PODs de nueve asientos flexibles, y comisión plana solo sobre proyectos ganados del lado de la venta. El proveedor nunca paga por participar, solo por ganar.

Approved Vendor List en vez de lista negra

La misma función técnica, un encuadre completamente distinto. La gobernanza de proveedores se administra a nivel organización, todas las empresas aparecen aprobadas por default y el administrador retira las que no quiere, confirmando cada cambio con contraseña.

Resultados

Resultado final

Medzquare está en producción y en fase de siembra de proveedores antes de abrir el lado comprador. Es el proyecto donde converge todo: quince años de contexto de industria, diseño de producto y código escrito línea por línea.

También es la prueba más honesta de que se puede construir software serio sin venir de ingeniería, siempre que el problema se entienda mejor que nadie.

medzquare.com

Hola Capital

Precalificación hipotecaria que no lastima el buró

Marca completa y motor de captación para una broker hipotecaria en Querétaro. Un quiz de precalificación de 17 preguntas convierte tráfico frío en leads segmentados y priorizados, con un dashboard interno que ordena todo el pipeline.

Marca + plataforma de captación. 2025 — 2026. Rol: Consultor externo de marketing, Diseñador de marca, Desarrollador. Stack: Next.js 14, Supabase, Stripe, Resend, Calendly, Vercel.

El reto

Una broker hipotecaria con excelente reputación tenía un problema de embudo, no de demanda: recibía muchos mensajes, pero la mayoría eran de personas que todavía no calificaban para un crédito. Cada conversación consumía el mismo tiempo, calificara o no.

El activo escaso no era el tráfico. Era su agenda. Y estaba siendo consumida por conversaciones que no podían terminar en una operación.

Cómo lo abordé

Calificación inversa como mecánica central

En lugar de perseguir a todos, el sistema pone una barrera de entrada deliberada. El visitante contesta un quiz de 17 preguntas y recibe un puntaje de 0 a 100 con una recomendación concreta.

El mensaje cambia de lado: no es la broker pidiendo la cita, es el usuario descubriendo si está listo para tenerla. Un límite duro de cinco espacios semanales refuerza la escasez sin inventarla.

Tres rutas, no una

El puntaje enruta al usuario a una de tres salidas. Quien ya califica pasa directo al banco. Quien está cerca recibe asesoría gratuita para cerrar la brecha. Quien todavía no llega entra a un programa de mejora de perfil.

Nadie se va con las manos vacías, y la broker solo dedica tiempo cara a cara a la ruta que sí puede cerrar. Un bank matcher compara diez instituciones mexicanas y aterriza la recomendación.

Sistema de marca Eléctrico

La categoría hipotecaria en México se ve toda igual: azul institucional, familias sonriendo, jerga bancaria. Construí lo opuesto.

Paleta crema, violeta, lima y tinta. Plus Jakarta Sans para estructura, Instrument Serif Italic para el momento emocional, JetBrains Mono para los datos. Manual de marca en versión 1.2 y un plan de 36 guiones de video a doce semanas para dos cuentas de Instagram, una B2C y otra B2B.

Decisiones técnicas

Consulta sin impacto en buró

La precalificación corre con un modelo propio de scoring, no con una consulta al buró de crédito. Elimina la fricción número uno del usuario mexicano y permite que la barrera de entrada al quiz sea prácticamente cero.

Kanban de cinco columnas en el dashboard interno

El lead no termina cuando llena el formulario. El panel interno mueve cada prospecto por etapas visibles, para que la broker vea su pipeline como un sistema y no como una bandeja de entrada.

Modelo de revenue share

En vez de cobrar por proyecto, la relación se estructuró como participación en resultados. Alinea los incentivos: si el sistema no genera operaciones cerradas, no genera ingreso.

Resultados

Resultado final

El sitio dejó de ser un folleto y se convirtió en el filtro que protege el recurso más caro del negocio: el tiempo de la experta.

El sistema de contenido corre en ciclos de cuatro semanas con nomenclatura propia de archivos, para que la producción de video no dependa de la memoria de nadie.

holacapital.mx

Club Splendor

Un club de Toastmasters operado como plataforma, no como grupo de WhatsApp

Sitio público y panel administrativo completo para un club de Toastmasters en Querétaro. Membresías, planeación de sesiones, calendario público, seguimiento de metas DCP y tesorería, construido sobre Supabase.

Plataforma web + admin. 2026. Rol: VP de Educación y Presidente entrante, Diseñador, Desarrollador. Stack: HTML, JavaScript, Supabase, PostgreSQL, Hostinger.

El reto

Los clubes de Toastmasters se operan casi siempre con hojas de cálculo sueltas, grupos de mensajería y la memoria de quien lleva más tiempo. Cada cambio de mesa directiva reinicia el conocimiento acumulado.

El reto doble: por fuera, atraer profesionistas que no buscan un curso de oratoria sino un laboratorio continuo de comunicación. Por dentro, dejar una infraestructura que sobreviva al cambio anual de directiva.

Cómo lo abordé

Posicionamiento contra la categoría

El sitio público no vende un curso. Argumenta explícitamente contra el formato curso: continuidad en vez de evento, práctica real en vez de teoría, retroalimentación de pares en vez de calificación de un instructor, progreso documentado en vez de constancia.

La segmentación es deliberada: profesionistas en fase de consolidación o liderazgo. Un formulario de aplicación de cuatro pasos filtra por perfil, motivación y nivel de compromiso.

Un panel administrativo real

Detrás del sitio corre un admin completo: CRUD de miembros, planeador de sesiones con modal de Orden del Día, kanban de prospectos, calendario público sincronizado, módulo de progreso DCP y módulo de tesorería con análisis financiero.

También construí una herramienta de calendario anual para el ciclo de mesa directiva, que cruza días festivos mexicanos, patrones de lluvia de Querétaro, precios de sede y ventanas de campaña de membresía.

Cumplimiento antes de que lo pidan

Un club maneja datos personales de sus miembros. El sitio incluye aviso de privacidad conforme a la LFPDPPP desde el primer día, no como parche posterior.

Decisiones técnicas

Vanilla JS en lugar de un framework

El siguiente responsable del sitio no será necesariamente desarrollador. HTML y JavaScript directo contra Supabase significa que cualquiera con nociones básicas puede abrir un archivo y entender qué hace, sin cadena de build.

GRANT explícito en cada tabla nueva

Supabase moderno no otorga privilegios automáticamente. La regla del proyecto es acompañar cada tabla con sus GRANT y sus CREATE POLICY WITH TO anon, authenticated. Un detalle que ahorra horas de depuración silenciosa.

Diferir el módulo DCP

El seguimiento de metas se pospuso a propósito hasta que existiera data real que mostrar. Construir dashboards sobre datos vacíos genera confianza falsa en el equipo.

Resultados

Resultado final

El club pasó de operar en mensajería a operar en una plataforma con datos consultables, calendario público y trazabilidad financiera.

Lo más valioso no es el software: es que el conocimiento del club dejó de vivir en la cabeza de una persona.

clubsplendor.com

Dalia Krohf

Identidad y sitio para un proyecto musical conceptual

Marca completa y sitio de una sola página para un proyecto musical mexicano cuyo nombre es un anagrama exacto de Frida Kahlo. Manual de identidad, sistema de logo, press kit, rider técnico y web con estética de galería.

Identidad de marca + sitio. 2025 — 2026. Rol: Director creativo, Diseñador de identidad, Desarrollador, Productor musical. Stack: HTML, CSS, JavaScript, Hostinger, Embeds de Spotify y YouTube.

El reto

Un proyecto musical conceptual necesita que la identidad visual cargue el mismo peso que la música. Aquí el concepto ya venía cifrado en el nombre: Dalia Krohf es un anagrama exacto de Frida Kahlo.

El riesgo era obvio: caer en la iconografía turística de Frida, cejas, flores y colores saturados. La marca tenía que evocar el mundo sin citarlo de manera literal.

Cómo lo abordé

Una web que se comporta como exposición

El sitio no está estructurado como página de artista sino como sala de exhibición. Las secciones son Sobre, Obra, Diario, Sesiones, Fechas, Archivo y Contacto.

Diario funciona como discografía en capítulos. Archivo entrega press kit, rider técnico y manual de marca a quien programa o cubre al proyecto, sin tener que pedirlos por correo.

Sistema tipográfico y cromático

La paleta se movió de tierras y ocres a un sistema más filoso de carmesí, crema y tinta. La tipografía evolucionó a Lexend para títulos, Montserrat para texto y JetBrains Mono para datos técnicos.

El resultado se lee editorial y contemporáneo, no folclórico.

Entregables que un proyecto real necesita

Manual de identidad de diez páginas, sistema de logo en SVG, press kit de seis páginas y rider técnico de siete páginas cubriendo tres configuraciones de show en vivo.

El rider es lo que separa a un proyecto de escritorio de uno que puede llegar a un escenario y montar sin fricción.

Decisiones técnicas

mix-blend-mode: screen para logos sobre fondo oscuro

Los logos venían con fondo negro. La solución fácil, filter: invert(1), destruye los colores de marca. mix-blend-mode: screen elimina el negro y conserva el carmesí intacto.

Una sola página, no un sitio de múltiples rutas

Un proyecto musical se consume en una sola sesión de scroll. Una página con animaciones de scroll-reveal mantiene el ritmo narrativo y elimina cualquier tiempo de carga entre secciones.

SVG en lugar de imágenes rasterizadas para el logo

El sistema de logo vive en SVG para escalar desde favicon hasta backdrop de escenario sin pérdida y sin generar veinte archivos distintos.

Resultados

Resultado final

El proyecto tiene hoy un sistema visual completo, un archivo público de prensa y una web que se siente galería.

Es el proyecto donde el diseño gráfico manda y el código simplemente se pone al servicio de la idea.

daliakrohf.com

INFQCER

La casa de los CSR: capacitación automotriz con lógica de procurement

Sitio institucional para una firma mexicana de capacitación y consultoría en sistemas de calidad automotriz con casi veinte años en el mercado. Arquitectura de contenido pensada para el comprador industrial, no para el visitante casual.

Sitio institucional B2B. 2026. Rol: Estratega de contenido, Diseñador, Desarrollador. Stack: HTML, CSS, JavaScript, Formularios de cotización, Hostinger.

El reto

La compra de capacitación técnica en la industria automotriz no la decide una sola persona. La pide un gerente de calidad, la valida ingeniería y la ejecuta compras. Cada uno busca información distinta en el mismo sitio.

El sitio anterior hablaba de la firma. El nuevo tenía que hablar del proceso de compra del cliente.

Cómo lo abordé

Estructurar por requerimiento, no por catálogo

La navegación se organizó alrededor de cómo se compra realmente: cuatro programas núcleo (IATF 16949, Core Tools, CSR por armadora y Auditor Interno ISO 19011), y una sección dedicada a OEMs donde el visitante encuentra su armadora específica.

Ford, GM, Stellantis, Toyota, BMW. El proveedor Tier 1 o Tier 2 no busca un curso genérico, busca el requerimiento de su cliente.

Hacer visible el proceso de cotización

Un bloque de cuatro pasos explica el recorrido completo desde la solicitud de cotización hasta la certificación. En compras industriales, la certidumbre del proceso vende tanto como el contenido del curso.

El FAQ ataca directamente las objeciones de procurement: logística, mínimo de participantes, modalidades y validez de la certificación.

Credibilidad como elemento estructural

Casi veinte años de especialización, respaldo AIAG y testimonios no se guardaron en una página de nosotros. Se distribuyeron a lo largo del recorrido, cerca de cada decisión de compra.

Decisiones técnicas

Posicionamiento en una sola frase

La casa de los CSR. En una categoría donde todos ofrecen lo mismo, elegir el territorio más difícil y específico, los Customer Specific Requirements, hace la firma memorable ante el comprador exacto que la necesita.

Tres modalidades explícitas y comparables

In company, en línea sincrónica y curso abierto se presentan lado a lado con sus condiciones. El comprador se autocalifica antes de pedir cotización, lo que reduce ciclos de ida y vuelta.

Sitio estático por decisión, no por limitación

El contenido cambia pocas veces al año. Un sitio estático da tiempos de carga mínimos, superficie de ataque casi nula y costo de mantenimiento cercano a cero.

Resultados

Resultado final

El sitio dejó de ser un folleto institucional y se convirtió en una herramienta de preventa que califica al comprador antes del primer contacto humano.

Es el proyecto que más se parece a lo que hago en Medzquare: entender un proceso de compra industrial y ordenarlo.

institutoqcer.com

Cotizador

Motor de estimación por horas. Tarifa de 500 pesos mexicanos por hora antes de IVA, con 25 horas por semana dedicadas a un proyecto. Pagos en tres partes: 40 por ciento de anticipo al firmar, 30 al aprobar el diseño y 30 contra entrega. Los estimados tienen 30 días de vigencia y llegan por correo a hola@leontercero.com.