
The Programming of Patrick's Parabox - Patrick Traynor (ThinkyCon 2025)
Eh, me gustaría compartir con ustedes algunas cosas interesantes de programación del desarrollo de Patrick's Parabox.
9 capitulos
- Introducción y concepto del juegoDescripción generalPatrick Traynor presenta una charla relámpago en ThinkyCon 2025 sobre aspectos interesantes de programación detrás del desarrollo de Patrick's Parabox.Concepto central• Parabox es un juego tipo Sokoban donde las cajas pueden contener otras cajas. • Las cajas se pueden empujar dentro y fuera una de otra, anidándolas en cualquier configuración. • Algunas cajas pueden contenerse a sí mismas directamente, permitiendo entrar y salir repetidamente manteniendo la misma lógica de Sokoban.Estructura de datos• En lugar de un array bidimensional, hay un array 2D para cada caja del juego. • Esto forma un array 2D de punteros a arrays 2D. • Los espacios en los bordes se conectan entre sí, y los niveles recursivos usan la misma estructura, con una caja refiriéndose a sí misma.ObjetivoLa charla plantea la pregunta de cómo renderizar realmente una escena construida sobre esta estructura de datos anidada.
- Renderizado con coordenadas de pantallaIdea principalTodo se renderiza en coordenadas de pantalla, anclado a un único rectángulo de referencia que representa la vista actual.Función dibujar bloque• Una función llamada dibujar bloque dibuja un bloque específico y todos sus hijos dentro de un rectángulo dado. • Cuando un hijo contiene otros bloques, dibujar bloque se llama de nuevo recursivamente en un rectángulo más pequeño. • La recursión se detiene una vez que los bloques alcanzan un tamaño de uno o dos píxeles.Renderizar objetos externos• Para renderizar objetos más grandes fuera de la vista actual, el cuadrado se mueve conceptualmente al nivel padre, luego al padre del padre, saliendo tres niveles en total. • Esto produce un rectángulo mucho más grande que la pantalla; la mayor parte no aparece en pantalla, pero recurre correctamente al cuadrado inicial.Principio claveMientras cada bloque esté posicionado en relación con su padre, con una única coordenada absoluta (el cuadrado de anclaje), el renderizado funciona correctamente.
- Animación de encogimiento recursivoEfecto visualEmpujar un bloque que se contiene a sí mismo dentro de otra caja produce una animación de encogimiento, y los bordes de la pantalla muestran un efecto de aplastamiento coincidente en el mundo exterior.Cómo funciona• Se utiliza el mismo algoritmo de dibujar bloque, manteniendo todo relativo al punto de anclaje. • En lugar de dibujar el bloque azul en su posición real, se desplaza hacia abajo y se escala (se encoge o crece) antes de llamar a dibujar bloque nuevamente. • Los mismos desplazamientos y compensaciones de crecimiento se aplican al salir a los tres niveles padre.Detalle técnicoSe requiere ordenamiento por profundidad para asegurar que el bloque que se encoge siempre se dibuje encima de otros bloques como los rojos.CitaUna cita del colega desarrollador de Sokoban Marcos Donatini: "coordenadas relativas equals dicha absoluta."
- Detalles de técnica de renderizado y preguntas del chatTécnica gráficaLos objetos grandes y nítidos fuera de la pantalla no son gráficos vectoriales sino PNGs grandes dimensionados lo suficientemente grandes para evitar borrosidad visible.Pregunta de la audienciaUna pregunta de chat de Don preguntaba por qué el algoritmo sale tres niveles padre en lugar de uno.Respuesta• Salir solo un nivel padre perdería ciertos elementos, como un token de jugador dos capas hacia afuera. • Salir dos capas cubriría ese caso. • Tres no es un número mágico; simplemente son suficientes niveles para cubrir la mayoría de situaciones comunes en el juego.ReferenciaSe mostró pseudocódigo del algoritmo de renderizado explicado para que los espectadores lo revisaran.
- Casos especiales: bloques autocontenidos y limitaciónAutocontención múltipleAlgunos niveles tienen una caja que contiene múltiples copias de sí misma; el algoritmo de dibujar bloque existente lo maneja sin problema.Problema de animaciónInicialmente, un objeto de jugador aparecía instantáneamente en todas las copias antes de encogerse, lo que se veía mal.Corrección con recorte• Se utilizó un modo de tijera (común en APIs gráficas) para limitar los hijos dentro del cuadrado. • Se añadió un caso especial para evitar escalar el rectángulo grande hacia abajo al centro; en su lugar se utilizó un enfoque solo posicional que sigue siendo limitado.ResultadoLa corrección produjo un efecto de aspecto natural mientras se preservaba la respuesta visual recursiva a la entrada del jugador, después de muchos errores durante el desarrollo.
- Caso especial: autocontención volteada horizontalmenteEl mecanismoAlgunos bloques se contienen a sí mismos volteados horizontalmente: salir por la izquierda resulta en aparecer por la derecha, y viceversa.Lógica de SokobanEsto es fácil de implementar intercambiando las posiciones de salida lógicas.Desafío de renderizado• La función dibujar bloque obtiene un parámetro verdadero/falso sobre si dibujar un bloque y sus hijos volteados. • Implementar esto correctamente requirió fragmentos de código en todo el código base multiplicando por -1 e invirtiendo banderas.Nota del desarrolladorEsto fue inesperadamente difícil de programar; una característica de rotación de 90° planeada fue descartada porque el volteo horizontal por sí solo fue lo suficientemente difícil.
- Mecanismo de bloques que contienen al jugadorEl mecanismoOtro mecanismo permite que el jugador mismo contenga otros bloques.ImplementaciónEl jugador fue refactorizado para ser el mismo objeto que un bloque, distinguido solo por una bandera booleana sobre si es el jugador.ComparaciónTanto la lógica de Sokoban como la lógica de renderizado funcionaron con este enfoque con relativa facilidad, en contraste con la dificultad de la característica de volteo horizontal.TiempoEste mecanismo fue implementado muy temprano en el desarrollo.
- Demostración de herramientas del editor de nivelesDescripción generalPatrick demuestra las herramientas del editor de niveles que construyó, señalando que no son estrictamente programación pero están relacionadas.Características de edición• Crear bloques nuevos y editar sus hijos. • Colocar bloques dentro de otros bloques y sacarlos. • Un bloque referencial se representa simplemente por la letra R, actuando como un puntero.Atajos de flujo• Un atajo recarga el juego y reproduce el nivel para una iteración rápida. • Las teclas de volteo horizontal y vertical voltean un objeto y todos sus hijos. • Un atajo salta para ver el nivel en el hub, y los niveles pueden reordenarse rápidamente.Herramientas adicionalesUn atajo aumenta o disminuye el tamaño de los bloques, ayudando en la iteración rápida sobre la dificultad y el diseño del rompecabezas.
- Observaciones finales y preguntasConclusiónPatrick agradece a la audiencia por seguir la charla y comparte su información de contacto.Pregunta de la audienciaUna pregunta de chat de Scrupulous preguntaba si alguien más ayudó con el código.Respuesta del puerto Switch• El estudio de portado Plastic Fern manejó los puertos de consola del juego, incluida la versión de Switch. • Hubo algunas optimizaciones de rendimiento para el puerto, pero sin cambios importantes; Patrick señala que no es un experto en optimización.Autoría del juego basePatrick confirma que el código del juego base fue completamente su propio trabajo.



