Proyecto App web / Fullstack

Todos los proyectos

Caso de estudio

La Porrita

La porra del Mundial que jugábamos en un Excel, convertida en una app web: cada grupo monta su liga, pronostica los 104 partidos y ve cómo la clasificación se mueve sola.

Ver en vivo (se abre en otra pestaña) Código en GitHub (se abre en otra pestaña)
Año
2026
Rol
Idea, diseño y desarrollo
Stack
Next.js · React · TypeScript · Supabase · Tailwind CSS
Plazo
37 días hasta el partido inaugural

01 Punto de partida

La porra vivía en un Excel que alguien tenía que mantener.

Cada Mundial jugábamos la misma porra, entre amigos o en la oficina: una hoja de cálculo, un grupo de WhatsApp y una persona apuntando a mano los pronósticos de todos, comprobando resultados y rehaciendo la clasificación después de cada partido.

Con 104 partidos eso no aguanta. Los pronósticos llegan tarde, alguien toca la celda que no era y nadie se fía del todo de la suma. Quise que la porra se llevara sola: que cada uno metiera sus marcadores desde el móvil y que las reglas las aplicara el sistema, no la persona de turno.

02 Qué decidí

Decisiones

  1. Las reglas viven en la base de datos

    El cierre de pronósticos y el reparto de puntos no dependen de la interfaz. Una tarea programada en Postgres bloquea cada ronda en el minuto en que arranca su primer partido, y un disparador reparte los puntos en cuanto entra el resultado: 5 por el marcador exacto y 2 por acertar el signo, con un multiplicador por fase. Nadie puede cambiar un pronóstico a destiempo, tampoco llamando a la API por su cuenta.

    Historial de pronósticos en una liga: cada partido con su resultado, lo que aposté, la media de la liga y los puntos que sumó, marcado como pleno, tendencia o fallo.
  2. Una liga se monta con un enlace

    Quien organiza crea la liga y comparte un enlace de invitación. El resto entra con su cuenta de Google y ya está dentro, sin contraseñas nuevas ni formularios; la espera, mientras se completa el acceso, es el gol de Maradona a Inglaterra en el 86. Cada liga lleva su propia clasificación y sus propios pronósticos, así que la misma persona puede jugar en la de los amigos y en la de la oficina.

    Pantalla «Mis ligas» en un teléfono: crear una liga, unirse con un código y dos ligas con su botón de compartir. Los códigos de invitación están tapados.
    Pantalla de acceso de La Porrita en un teléfono, con el botón «Continuar con Google».
    Pantalla de carga de La Porrita tras iniciar sesión: el gol de Maradona a Inglaterra en 1986 y una cita suya, «Yo me equivoqué y pagué, pero la pelota no se mancha».
  3. Pensada para el móvil y para el directo

    Una porra se rellena desde el sofá y se consulta en el descanso, así que la app se diseñó primero para el teléfono: navegación inferior, marcadores que se editan con el pulgar y una clasificación que se comparte como imagen en el grupo. Los pronósticos de los demás se destapan cuando la ronda se cierra, no antes. Los resultados llegan de API-Football a mi base de datos y los navegadores solo leen de ahí cada 30 segundos: el gasto de la API no crece con la gente que esté mirando.

    Clasificación de una liga en un teléfono, con las pestañas General, Por día y Evolución y los puntos de cada jugador.
    Pronósticos de todos los jugadores para un partido ya cerrado, en un teléfono: el marcador que puso cada uno y los puntos que sumó.
    Área personal en un teléfono: la posición en cada liga y las cifras del torneo, con puntos, plenos, tendencias y precisión.
  4. El torneo acaba con un resumen para cada uno

    Además de la tabla de su liga, cada jugador tiene su área: puntos, plenos y precisión, y la lista de sus pronósticos con lo que sumó cada uno. Al terminar el Mundial recibe «Tu Mundial», un resumen para compartir: su mejor acierto, su peor pronóstico y cómo fue moviéndose en la clasificación de una ronda a otra.

    Área personal de La Porrita en escritorio: aviso de que el resumen del Mundial está listo, puesto en el ranking global, posición en dos ligas y las cifras del torneo.
    Resumen «Tu Mundial» en un teléfono: 928 puntos en todo el torneo, con plenos, tendencias, precisión y mejor racha.
    «Tu Mundial» en un teléfono: el mejor acierto, un 1-1 exacto que valió 32 puntos, y el peor pronóstico, con siete goles de error.
    «Tu Mundial» en un teléfono: el puesto final en cada liga y la tabla de aciertos fase a fase.

03 Resultado

En cifras

  • 104

    partidos, de la fase de grupos a la final

  • 37

    días de la primera línea de código al partido inaugural

  • 58

    migraciones de base de datos, 18 de ellas con el torneo en marcha

  • 1.138

    pronósticos en la liga más grande, de 11 jugadores

La Porrita estuvo en uso de principio a fin del Mundial. Las eliminatorias, los botones para compartir la clasificación y la vista de pronósticos por partido salieron con el torneo ya empezado, sin parar el juego.

En octavos, una liga pasó de los mil pronósticos y dejó a la vista un límite de la API de datos, que cortaba las respuestas en mil filas. Lo resolví paginando las consultas. Lo que antes era una hoja que alguien mantenía ahora es un enlace que se comparte.