Plataforma de ticketing de eventos para Costa Rica — descubrí eventos, comprá entradas por tier y llevá pases QR verificables. Un solo codebase React Native para iOS, Android y web.
Planora
Rol
Lead de frontend y UI/UXLead de frontend y UI/UX
Periodo
2026 – presente2026 – presente
Equipo
Equipo de dosEquipo de dos
Contexto
MVP de ticketing · en desarrolloMVP de ticketing · en desarrollo
/ El reto
Comprar una entrada en Costa Rica demasiadas veces es un DM de Instagram, una transferencia y un screenshot como comprobante. Planora junta descubrimiento, checkout por tiers y un pase QR verificable en un solo lugar — y es mi patio de juegos de frontend: un codebase, tres plataformas y una identidad de diseño propia.
/ Resumen
Planora es un MVP de ticketing de eventos construido con un compañero; yo llevo el frontend y el diseño de producto. Un solo codebase Expo SDK 57 / TypeScript sale a iOS, Android y web vía Expo Router, con motores de mapa por plataforma (react-native-maps en nativo, Leaflet en web). El wallet renderiza pases QR con stub perforado, cuenta regresiva de embarque, haptics y token seguro por ticket; el organizador tiene creación de eventos con preview del pase en vivo y check-in en tiempo real. La interfaz es un design system propio — 47 componentes sobre tokens de NativeWind, claro y oscuro — bajo una dirección de arte con nombre: SEÑAL. Mientras aterriza el backend Flask/PostgreSQL, toda la app corre sobre una capa mock tipada que espeja el contrato futuro del API.
/ Enfoque
/01
Un codebase, tres plataformas
Expo Router sirve iOS, Android y web desde un solo codebase TypeScript — con decisiones por plataforma donde importa: react-native-maps en nativo, Leaflet en web, haptics solo donde hay manos que los sientan.
/02
SEÑAL — dirección de arte con nombre
El design system tiene identidad, no solo tokens: tipografía pixel, sombras duras, blanco y negro casi puros con un solo verde de señal. 47 componentes sobre tokens de NativeWind, claro y oscuro, para que cada pantalla hable el mismo idioma.
/03
Arquitectura mock-first
El backend no está listo — por diseño, eso nunca frenó el producto. Una capa mock tipada espeja el contrato futuro del API en Flask: los flujos, estados y pantallas se entregan y prueban hoy; conectar el API real es un cambio de transporte, no un rewrite.
/ Alcance
✓Flujo de consumidor completo: descubrir → evento → checkout por tier → pase QR en el wallet
✓Suite de organizador: creación de eventos con preview del pase en vivo, check-in en tiempo real
✓Wallet de tickets: stubs QR perforados, cuenta regresiva, haptics, token seguro por ticket
✓Descubrimiento por mapa + calendario con motores de mapa por plataforma
✓Design system: 47 componentes, tokens de NativeWind, claro/oscuro
