← Volver al portfolio
Proyecto indie · Julio 2026

GeoChallenge

Un juego diario de geografía tipo Wordle: adivina un país a partir de 4 pistas progresivas basadas en datos curiosos, no en mapas. Bilingüe (ES/EN), con una aurora de color que cambia según la hora del día.

Jugar ahora Ver código en GitHub
Ver dashboard de analíticas → Ver en Product Hunt →
Rol
Product Design & desarrollo (solo)
Duración
2-3 semanas · lanzado en julio de 2026
Herramientas
React 19 · Vite · TypeScript · Lovable · Vercel
Estado
Live
Imagen de portada de GeoChallenge: '¿Adivinaste el país de hoy?'

Resumen rápido

El contexto y el problema

Antes de diseñar nada, investigué varios juegos de geografía existentes (GeoGuessr, Sporcle y varios clones de Wordle). El patrón era claro: la mayoría se basa en mapas y reconocimiento de formas — un formato mecánico, poco educativo y ya saturado. Ahí vi el hueco: no había ningún juego diario construido sobre datos curiosos de geografía en vez de sobre geografía visual.

La propuesta: el mismo país para todo el mundo cada día (crea comunidad, como Wordle), con pistas progresivas de Experto a Fácil que premian saber cosas poco conocidas y enseñan algo nuevo aunque falles. Target: viajeros, amantes de la geografía y fans de este tipo de retos diarios.

El proceso — Double Diamond

Discover Define Develop

Exploré varias direcciones y descarté las que no aportaban diferenciación o metían scope creep:

Deliver
"Perfecto para mi café de la mañana ☕" — comentario real de una usuaria

Funcionalidades principales

1. Daily Country System

Mismo país para todo el mundo, calculado de forma determinista a partir de la fecha UTC. Cambia cada 24h.

2. Pistas progresivas (4 niveles)

Experto (dato que solo un 5% sabría) → Difícil → Medio → Fácil (capital, símbolo obvio).

2.1 Pistas desplegables

Mejora sobre la idea original: al avanzar a la siguiente pista, las anteriores no desaparecen — se convierten en desplegables que puedes volver a abrir. Ver todo el contexto a la vez es más lógico para adivinar, y los usuarios lo agradecen frente a perder información.

3. Aurora dinámica

La paleta de color cambia según la hora del día: cálidos por la mañana, amarillos al mediodía, rosas/naranjas al atardecer, púrpuras y azules por la noche.

4. Bilingüe (ES/EN)

Interfaz y pistas completas en ambos idiomas, con un toggle que no hace perder el progreso de la partida.

5. Validación inteligente

Normalización de texto (acentos, mayúsculas), 195 países validados y autocompletado con sugerencias.

6. Racha diaria (streak)

Racha diaria guardada en localStorage para mantener el hábito de volver cada día.

7. Compartir resultado

Comparte tu resultado sin revelar el país (estilo Wordle), mostrando cuántas pistas necesitaste. Enlaces directos a Twitter, WhatsApp y LinkedIn.

8. Dashboard de analíticas

Google Analytics visualizado dentro del propio producto: KPIs interactivos y gráficos de tráfico y usuarios.

Decisiones clave de diseño

Pistas progresivas en vez de pistas básicas

Decisión

Estructurar cada partida en 4 niveles de pista (Experto → Fácil), cada uno con un dato curioso distinto sobre el país.

Por qué

Maximiza el engagement (quieres seguir jugando para desbloquear la siguiente pista) y convierte cada partida en una mini lección de geografía, que es justo el hueco que detecté en la competencia.

Alternativa descartada

Pistas básicas de un solo nivel: se descartaron porque no aportaban ninguna diferenciación frente al resto del mercado.

Aurora dinámica como identidad visual

Decisión

La paleta de color de fondo cambia automáticamente según la hora del día de quien juega.

Por qué

Da al producto una identidad visual reconocible sin depender de ilustración o branding pesado, y hace que volver cada día se sienta distinto.

Alternativa descartada

Una interfaz con tema estático: más simple de construir, pero sin ningún diferenciador visual frente a otros daily games.

localStorage en vez de backend para el MVP

Decisión

Guardar racha y progreso en el navegador (localStorage) en lugar de montar una base de datos con backend propio.

Por qué

Permitía lanzar en 2-3 semanas y validar la idea con usuarios reales antes de invertir tiempo en infraestructura que quizá no hiciera falta.

Alternativa descartada

Backend con base de datos: se descartó para el MVP por tiempo y porque no era necesario para validar la hipótesis del producto.

Stack técnico

React 19 · Vite · TypeScript · Lovable · Vercel · localStorage (sin backend en el MVP).

¿Por qué Lovable?

Resultados e impacto

Métricas de las primeras 4 semanas tras el lanzamiento:

1.000
usuarios activos
11.000
eventos registrados
1:16
min de engagement medio
24,2%
tasa de rebote
24,2%
conversión visitante → jugador

Origen del tráfico:

Dashboard de Google Analytics de GeoChallenge: usuarios activos, eventos, engagement, tráfico por fuente y por ciudad
Dashboard de analíticas integrado en el propio producto.

Skills demostrados

Product Design
Market research & gap analysis · Double Diamond · Validación con usuarios · Priorización de features (mindset MVP)
Frontend Development
React Hooks (useState, useEffect, useMemo) · Diseño responsive (mobile-first) · Normalización y validación de strings · Persistencia con localStorage
IA & herramientas
Lovable (vibe coding) · Prompt engineering · Prototipado rápido
Despliegue
Git + GitHub · CI/CD en Vercel · Lanzamiento en Product Hunt · Difusión orgánica · Medición con Analytics

Aprendizajes

Qué funcionó

  • La racha diaria (streak), que anima a volver a jugar cada día.
  • Las pistas desplegables: poder revisar el contexto anterior sin perder información mejoró la experiencia de juego.
  • La aurora dinámica como diferenciador visual único.
  • Compartir en Twitter generó el 76% del tráfico sin invertir en ads.
  • Validar con usuarios reales desde el primer día, no al final.

Bugs y cosas que aprendí

  • Era mi primer proyecto de vibe coding y mi primera vez usando Lovable.
  • Un bug de z-index en el autocompletado, causado por contextos de apilamiento en CSS, que resolví tocando el código a mano en VSCode — igual que hice con varias de las pistas, ya que usé en todo momento la versión gratuita de Lovable.
  • Diferencia entre UTC y hora local al calcular el país del día.
  • Quité el badge de "Made with Lovable" de la versión gratuita tocando el CSS directamente.

Los propios usuarios pidieron más países — la siguiente iteración natural del roadmap.

← Volver al portfolio Siguiente proyecto: Roomeet →