Un juego de reparto en moto por todo el Madrid de dentro de la M-30. Los edificios están en su sitio, las calles se llaman como se llaman, los restaurantes existen y muchas fachadas son las de verdad, fotografiadas por el Catastro y pasadas a píxeles. Y el horizonte se curva hacia arriba: la calle de delante se ve normal y la ciudad lejana, desde el cielo, como un mapa. Hay además una versión de prueba que cambia los píxeles por los edificios 3D fotorrealistas de Google, a través de su API oficial.
#juego#Madrid#pixel art#datos abiertos#Three.js#Google 3D Tiles
Una partida en el juego publicado: salida desde Sol, el centro en píxeles con la ciudad curvándose hacia arriba y la app del rider con las ofertas.
262trozos de 500 m cubren el interior de la M-30, y se cargan sólo los que tienes cerca
~40.000edificios de OpenStreetMap levantados sobre su planta real
6.527restaurantes y bares reales donde recoger pedidos
>10.000fachadas reales del Catastro, enderezadas y pixeladas en local; siguen entrando
01 · Cómo se juega
Abre la app del rider, elige pedido y llega antes de que se enfríe
Arrancas en la Puerta del Sol y puedes conducir libremente. Cuando quieras trabajar, abres la app del rider: un mapa con las calles reales, tu posición y cada oferta con su restaurante, su portal de entrega, el pago, la distancia, el tiempo y un extra si llegas antes de una hora. Las ofertas caducan y entran otras.
Con lo que ganas compras extras: una moto más rápida con turbo, el GPS pintado en el suelo, una bocina que aparta a peatones y coches, propinas multiplicadas o ir sin matrícula. Uno lo eliges gratis al empezar y lo puedes cambiar.
La app: tú en el mapa, cada restaurante numerado y su entrega del mismo color. Abajo, pago, tiempo, extra por rapidez y cuánto falta para que caduque.
Horizonte curvola ciudad lejana se ve desde arriba
Pedidos realesrestaurante → portal, con reloj
Historialcada entrega, su desglose y estrellas
Extrasmoto, GPS, bocina, propinas, sin matrícula
Policíatermómetro que se calienta con los golpes
Tráficocoches, autobuses EMT y peatones por la calle
El jefe al teléfonovoz en español: avisos, atascos, chistes e ironía
Motor sintetizadobicilíndrico con marchas, sin un solo audio grabado
Orientaciónbrújula, flecha y marca en el horizonte
Cámara a tu gustozoom, inclinación, altura y curva
Móvilbotones táctiles, pellizco y dos dedos
Se guardadinero, extras e historial en tu navegador
El termómetro sube con cada golpe, sobre todo si es a un peatón. Arriba, en el horizonte, el punto azul y rojo es el coche patrulla.
02 · La policía
Ir rápido sale caro si vas dando golpes
Cada golpe calienta un termómetro. Desde el primer grado sale un coche patrulla por las calles reales, con su sirena y su baliza; con más temperatura, más coches y más rápidos. Si te pillan casi parado, pierdes el dinero que no hayas gastado.
El termómetro se enfría solo, más deprisa si te pierden de vista y si te alejas. Con poca temperatura les puedes dar esquinazo del todo.
03 · Con los edificios 3D de Google
El mismo juego, sobre el Madrid fotorrealista de Google
Una prueba de concepto: la misma moto, la misma cámara y el mismo horizonte curvo, pero en vez de la ciudad pixelada se cargan en directo los Photorealistic 3D Tiles de Google con la Map Tiles API oficial. Las teselas se piden mientras conduces y no se guardan, como exigen sus condiciones; los choques siguen saliendo de los edificios de OpenStreetMap, invisibles debajo.
API oficialMap Tiles API · Photorealistic 3D Tiles, con clave propia
Coste1.000 sesiones gratis al mes; luego 6 $ cada 1.000
Contadorpeticiones, megas y euros, en pantalla
Atribuciónlogo de Google y proveedores de lo que se ve
04 · Fuentes de datos
Todo Madrid sale de datos abiertos
Nada está dibujado a mano: la ciudad se hornea con unos scripts a partir de fuentes públicas y el juego la carga por trozos alrededor de la moto.
OpenStreetMap · Overpass
Calles, edificios y restaurantes
Plantas y alturas de los edificios, calles con su anchura y sentido, parques, plazas, árboles, bocas de metro y los restaurantes donde se recoge. Con ellas se construye también el grafo de calles del GPS y del tráfico.
Para cada edificio se busca la pared que da a la calle, se pregunta al Catastro qué parcela hay detrás y se descarga su foto. Luego se endereza por puntos de fuga y se pinta con la paleta del juego.
Fuente
Dirección General del Catastro, citada en el juego
Ritmo
unas 2 peticiones por segundo, con caché
IGN · PNOA
Tejados y suelo, desde el cielo
La ortofoto del Plan Nacional de Ortofotografía Aérea se recorta por trozos y se pone sobre el suelo y los tejados: es lo que se ve en la parte curvada del horizonte.
Los lugares con identificador de Wikidata se ordenan por cuántas Wikipedias hablan de ellos. Así salen los carteles de los sitios conocidos y la lista para su arte propio.
Licencia
CC0
Uso
carteles y monumentos destacados
RetroDiffusion
Arte pixel generado por IA
Fachadas tipo y monumentos (el Metrópolis, por ejemplo) generados como pixel art con la paleta común, para los edificios que no tienen foto o los que merecen una imagen propia.
Coste
unos 0,18 $ por imagen
Términos
los de RetroDiffusion
Google · Map Tiles API
Madrid en 3D fotorrealista
En la versión de prueba, los edificios, árboles y calles en 3D con textura real de Google Maps, pedidos en directo con los Photorealistic 3D Tiles y colocados sobre las mismas coordenadas que el resto del juego.
Términos
los de Google Maps Platform, sin guardar nada
Coste
por sesión: 1.000 gratis al mes
Ayuntamiento de Madrid
Ideas para lo siguiente
El modelo 3D LoD2 de edificios del geoportal, la intensidad de tráfico en tiempo real y los semáforos averiados están apuntados para tejados reales, tráfico y semáforos.
Estado
sin integrar todavía
Licencia
datos abiertos del Ayuntamiento
05 · Las piezas especiales
Lo que no es lo de siempre
Debajo hay TypeScript, Vite y Vercel, como en cualquier web. Estas son las piezas que hacen que esto sea un juego de Madrid.
Three.js3D en el navegador; la curva es un shader que dobla cada vértice
Pixel Path (MIT)paleta de 34 colores, cliente de RetroDiffusion y limpieza del arte
OpenCVdetector de líneas LSD, puntos de fuga y homografía para enderezar fotos
NumPy + Pillowpixelado con la paleta y atlas de fachadas por trozo
sharpcoser las teselas de la ortofoto en una imagen por trozo
Web Audio · AudioWorkletel motor, muestra a muestra: explosiones, escape y silenciador
Web Speech APIla voz del jefe, con voz española del sistema
3DTilesRendererJScarga los 3D Tiles de Google en Three.js, con su autenticación y atribución
Overpass APIconsultas a OpenStreetMap por zonas de 1 km²
A* con montículorutas del GPS y de la policía sobre 40.505 cruces
Claude Code Game Studiosagentes de diseño, arte, UX y QA que revisaron el juego
Por qué el horizonte se curva
Para un repartidor, la duda es siempre la misma: ver la esquina que viene o ver adónde va. Curvar el mundo hacia arriba da las dos cosas a la vez, sin cambiar de vista: la calle cercana en perspectiva y el destino, a un kilómetro, en el cielo.
06 · Lo que está y lo que falta
Dicho claro
Funciona
Todo el interior de la M-30, cargado por trozos, con foto aérea.
Pedidos, app, extras, historial, policía, tráfico, voz y sonido.
Arte propio de IA para los 50 monumentos más conocidos de Madrid.
En un ordenador normal va a unos 13 ms por fotograma.
Todavía no
Las fachadas reales siguen entrando; algunas salen con árboles delante o torcidas.
Semáforos y radares reales.
La versión con Google 3D es una prueba: pide tu propia clave y aún no tiene pedidos ni tráfico.
Al entrar en un trozo nuevo todavía puede notarse un pequeño tirón en móviles modestos.