Cómo Subcult Joint administró más de 2000 hojas de sprites y más de 10 000 luces 2D en Cookie Cutter

Conoce sus herramientas 2D y la última actualización de la versión Unity que abrió nuevas posibilidades para esta paliza rompemoldes.
El desafío:
Optimización de assets e iluminación de alta resolución para lograr un mejor rendimiento en múltiples plataformas
Personal del proyecto:
15
Plataformas:
PC, PlayStation®5, Xbox Series X|S
Ubicación:
Brighton, U.K.
¿De qué manera un equipo pequeño muestra la animación dibujada a mano con la mejor luz en todas las plataformas? Subcult Joint pasó seis años trabajando en Cookie Cutter, que incluye miles de assets de alta resolución creados con técnicas de animación tradicionales y optimizados en Unity. El estudio necesitaba equilibrar imágenes nítidas con un juego ágil, y utilizó 2D Lights ampliamente para agregar profundidad a sus gráficos y diseño de juegos centrado en la exploración.
Sigue leyendo para conocer la manera en que lograron esta Vision y el cambio sorpresa de último minuto que les permitió administrar los assets con mayor rapidez y los ayudó a llevar su configuración de iluminación al siguiente nivel.

Cookie Cutter de Subcult Joint
El artista, animador, instructor de Unity Learn y fundador de Subcult Joint Stefano Guglielmana comenzó a trabajar en Cookie Cutter en 2018. Se inspiró en un personaje rechazado de un proyecto Unity anterior: Cherry, un Android que habla duro. "Estaba enamorado de su diseño, así que comencé a crear animaciones para ella", dice. Stefano tenía una Vision clara para el exitoso juego Metroidvania de Cookie Cutter, pero necesitaba el apoyo de un desarrollador para hacerlo realidad. Después de obtener financiamiento, contrató al programador Francesco Bizzini y a una lista de artistas y diseñadores para colaborar en el proyecto.
Resultados:
• Vendieron 60 000 copias y generaron USD 1200 000 en el plazo de un mes desde el lanzamiento
• Se administraron fácilmente más de 2000 hojas de sprites y más de 50 Sprite Atlas
• Ilumina el juego con más de 10 000 luces 2D
• Se actualizó correctamente a Unity 2022 LTS a mitad del proyecto

Empaquetado del contenido
Las imágenes dibujadas a mano de Cookie Cutter son un punto de venta importante. Stefano sabía que sería complicado crearlos, pero ese esfuerzo adicional valdría la pena. "Los dulces oculares son lo que nos hace enamorarnos de los videojuegos", dice. "En Subcult Joint, admiramos a los maestros de Studio Ghibli y Disney. No estamos en ese nivel, pero con Cookie Cutter, queríamos mejorar nuestras habilidades de animación y hacer un juego realmente genial".
Este proyecto es extremadamente ambicioso para un equipo pequeño. La mayoría de los assets de arte (más de 1000 fondos, sprites, animaciones y efectos de partículas) son visualmente complejos y se crean minuciosamente utilizando técnicas de animación tradicionales. Entre el personaje del jugador (Cherry) y los NPC (27 tipos de enemigos estándar y cinco jefes gigantes), cada personaje de Cookie Cutter tiene entre 20 y 40 animaciones. Cada una de estas animaciones individuales puede tardar entre ocho y 48 horas en completarse. Diferentes artistas utilizaron algunos DCC diferentes, pero Stefano creó la mayoría de los assets en Adobe Photoshop.
Una vez que Stefano terminó una ilustración, utilizó el PSD Importer para convertirla en una textura 8K antes de optimizarla en el Editor para evitar problemas de desbordamiento de la memoria de video. El uso inteligente de la configuración de importación de texturas ayudó a reducir el tamaño de la textura por plataforma y, siguiendo las prácticas recomendadas, como el poder de dos, logró optimizaciones adicionales.

Una mirada dentro del Editor de los diferentes estados de animación de Cherry. Subcult Joint pasó mucho tiempo trabajando en las transiciones de animación para garantizar una jugabilidad fluida.
"Después de terminar mi trabajo en Photoshop, creé manualmente mis hojas de sprites colocando las celdas de animación una por una en un archivo nuevo, siempre en un múltiplo de 512 x 512, siguiendo el poder de dos reglas en Unity", dice Stefano. "A partir de ahí, Sprite Sheet Editor de Unity facilitó el proceso de cortar la hoja o realizar otros trucos moviendo el pivote o el píxel de la hoja por frame". Estos flujos de trabajo garantizaron que las imágenes de Cookie Cutter se optimizaran en todas las plataformas con problemas mínimos de rendimiento.
Al final del proyecto, Subcult Joint había reunido más de 2000 hojas de sprites en más de 50 Sprite Atlas, organizándolas por personaje. «Sprite Atlas facilitó enormemente la exportación del juego a las diferentes consolas de destino, manteniendo una tasa de frames sólida», dice Stefano. "Estamos enfocados en aplastar los 60 FPS para mantener la jugabilidad y el rendimiento general sin problemas. Esto realmente optimizó el uso de la memoria de una manera increíble y aceleró aún más los tiempos de carga».

Cookie Cutter de Subcult Joint
Personalización del juego
Stefano quería evitar las trampas comunes en las que han caído otros juegos centrados en la animación. "Los juegos con muchas animaciones pueden ser toscos. A veces, el animador quiere flexionar y termina castigando la jugabilidad", explica. "Con Cookie Cutter, estuvimos igualmente atentos al juego, por lo que el juego se siente tan fluido como las animaciones cuando tienes el control en tus manos".
Con esto en mente, necesitaba trabajar en el Editor y modificar la jugabilidad rápidamente, sin riesgo de romper el proyecto. Esto llevó a lo que Francesco llama uno de los mayores obstáculos técnicos en el lado de la programación: Construir un sistema flexible en Unity que funcione con una intervención deficiente del código.
"Mi objetivo era darles a los diseñadores una forma de personalizar cualquier aspecto del juego directamente desde el Editor", dice. Con la extensibilidad incorporada de Unity, Francesco pudo agregar sus propias personalizaciones para cerrar la brecha de conocimiento entre él y los artistas menos técnicos del equipo.

Cookie Cutter de Subcult Joint
A fin de permitir un juego interesante y combinaciones de acción brutales, Francesco implementó la herramienta visual externa ActionGraph para diseñar y estructurar modularmente máquinas de estados finitos en Unity. Cuando se cargan los sprites de una animación, ActionGraph permite agregar lógica de juego a cada frame. Eso permite que los artistas modifiquen ajustes tales como colliders o números de daño sobre la marcha. Por ejemplo, Stefano puede usar ActionGraph para agregar una caja de éxitos a un ataque y configurarla para que esté activa en frames específicos, activar y desactivar los contadores de saltos, activar la generación y el gasto de recursos de combate, etc., sin la intervención de un programador.
Francesco también programó varias de sus propias personalizaciones del Editor para permitir que más miembros del equipo centrado en el artista de Subcult Joint contribuyeran al proyecto. Con el sistema de visualización xNode, UpWire permite que los artistas administren fácilmente las entradas de humanos y de AI, editen los compiladores, agreguen efectos visuales a nodos de animación específicos y mucho más.

Cookie Cutter's Graph Combo System: desde aquí, Subcult Joint puede personalizar los hitboxes y los parámetros para crear ataques que se encadenan, agregar efectos visuales como sacudidas de cámara y ajustar la forma en que los enemigos responden a los ataques.
"Lo construí para que fuese un verdadero editor de combate", explica. "Maneja todas las variables del juego, por lo que solo se pueden ejecutar movimientos específicos si el jugador ha desbloqueado esa habilidad, arma o actualización, y está en la posición correcta: ataques aéreos frente a ataques a tierra, por ejemplo". UpWire también maneja ajustes tales como la fuerza física, la traslación de posición y la rotación del cuerpo, para que los artistas puedan experimentar con la mecánica de combate con mayor facilidad.

El combo de Graph para una pelea de jefes. Aquí, Subcult Joint puede ajustar factores tales como la fuerza, la dirección y los valores de repulsión de las cajas de impacto de ataque, o personalizar la forma en que el jefe responde a los ataques de los diferentes tipos de armas de Cherry.
Timeline EZ Events, otra de las herramientas personalizadas de Francesco, permite que los diseñadores envíen mensajes y llamen a las funciones directamente en el Editor casi sin límites de parámetros, incluidos los objetos de escena, y agreguen múltiples funcionalidades a un GameObject. Por ejemplo, el equipo puede crear una palanca que abra una puerta al tirar de ella mientras oculta simultáneamente un marcador de "puerta bloqueada" en el mapa y el minimapa.

Subcult Joint utilizó Timeline EZ Events para crear las cinemáticas de Cookie Cutter. Esta herramienta les permite crear momentos cinemáticos mediante la secuencia de animaciones de personajes, movimiento de la cámara, audio y efectos visuales.
Para ayudar a los diseñadores a trabajar en el minimapa de Cookie Cutter, algo crucial para cualquier juego centrado en la exploración, Francesco creó EzMiniMapPro. "Se utiliza para crear mapas para las áreas de juego y tiene algunas personalizaciones y optimizaciones útiles para la generación de imágenes", dice Francesco. "En el tiempo de ejecución, es compatible con marcadores de superposición animados y máscaras de exploración automáticas basadas en lo que ve la cámara. La máscara se puede escribir y restaurar a través de SaveGame".
Crear e implementar estas personalizaciones requirió mucho trabajo, pero desató la libertad creativa en todo el equipo, dado que todos en Subcult Joint se sentaron a la mesa sobre el diseño, la mecánica y el equilibrio del juego de Cookie Cutter.

Con EzMiniMapPro, Subcult Joint podía capturar todo el mapa que había creado en el Editor y exportar la imagen a Photoshop. A partir de ahí, Stefano podía pintar sobre el mapa generado para que coincidiera con el estilo visual del juego antes de importarlo de nuevo en Unity.
Diseñar el mundo
El enorme mundo de Cookie Cutter, Megastructure, presenta nueve áreas para explorar. Una vez finalizado el arte conceptual de un área, el diseñador de niveles de Subcult Joint, Gabriel Raymond Roy, colocaría un recuadro gris en cada área para crear un laberinto que los jugadores pudieran descubrir.
«Un buen diseñador de niveles sabe crear rutas primarias y secundarias que son entretenidas de explorar y también de regresar», dice Stefano. "Cada callejón sin salida debe tener algún tipo de recompensa para el jugador. Además, todas las áreas abiertas deben tener encuentros enemigos para que los jugadores puedan cultivar materiales".
Una vez que el área se encajó en grises, Stefano y los diseñadores vistieron la escena con detalles ambientales, disponiendo los sprites dibujados a mano en capas en cuatro puntos del eje Z. Cookie Cutter utiliza una vista de cámara en perspectiva sin paralaje codificado, por lo que, cuando el jugador se mueve, puede ver elementos "extraviados" en perspectiva. Cherry se encuentra en el punto "predeterminado" junto a GameObjects interactuables como enemigos, objetos y plataformas, mientras que los elementos no interactivos de primer plano, fondo y "lejanos" agregan profundidad simulada a la vista de escena.

Iluminación de la megaestructura
"Intentamos darle a cada área una personalidad única, aunque con la ambientación cyberpunk y nuestro amor por las perchas y las fábricas de metal, no estoy seguro de lo exitosos que fuimos", bromea Stefano.
Para darle a cada zona su propio sabor visual, Subcult Joint hizo un gran uso de Spot and Freeform 2D Lights en URP. Más de 10 000 personas iluminan el mundo de Cookie Cutter. "Cada luz del juego ilumina nuestros Sprites en tiempo real, lo que crea una sensación de densidad y cohesión entre los personajes, las animaciones y los entornos", dice Stefano. "En lugares oscuros, los personajes reciben sombra y se bañan de luz cuando se exponen a los tragaluces saturados y contaminados de las áreas exteriores. ¡Me encantan tanto estos detalles!".

Cookie Cutter de Subcult Joint
Subcult Joint utilizó 2D Lights de Unity listo para usar, sin administración especial, y los aplicó en las mismas capas del eje Z que los sprites ambientales. "Las luces 2D predeterminadas son increíbles para iluminar tu área de juego, y es genial poder decidir qué capas pueden afectar", explica Stefano. "Queríamos que la capa predeterminada siempre fuera clara para el jugador, a fin de que supiera hacia dónde puede caminar y hacia dónde no. Luego, agregamos luces a las capas de fondo, de primer plano y lejanas".
La llamativa iluminación 2D de Cookie Cutter juega un papel importante en el diseño general del juego. Como Metroidvania, es un título centrado en la exploración. La iluminación se utiliza para proporcionar indicadores ambientales al jugador. "La iluminación cuenta una historia: le muestra al jugador a dónde ir, lo lleva al camino principal u oculta caminos opcionales secundarios", explica Stefano.
Se utilizan luces parpadeantes para dibujar el ojo del jugador. Stefano comparte cómo creó este efecto: "Lo hermoso de las luces 2D es que puedes animarlas", dice. "Crear luces parpadeantes es supersimple: Seleccionarás la luz, irás a la ventana Animation, crearás otra animación y jugarás con la intensidad (0, 9, 0, 9) y copiarás esa animación en otras luces si quieres crear el mismo efecto en otro lugar".

Aprovecha los beneficios adicionales con una actualización de la versión de último minuto
Cerca del final del desarrollo de Cookie Cutter, los problemas de desbordamiento de memoria de video se convirtieron en un obstáculo para la versión PlayStation 5. Subcult Joint se dio cuenta de que tenían que actualizar su versión Unity para solucionar el problema.
Hacer esto tan cerca del lanzamiento no era ideal, pero no llegar al público masivo de PlayStation no era una opción. Por eso, se arremangaron y se pusieron manos a la obra para trasladar el proyecto a Unity 2022 LTS, la versión más reciente en ese momento. Esto les dio acceso a nuevas herramientas de generación de perfiles y depuración, como el Memory Profiler actualizado.
"La nueva función de comparación de instantáneas en Memory Profiler nos ayudó a identificar y resolver los problemas persistentes de desbordamiento de la memoria de video", dice Francesco. «2022 LTS también es más rápido para importar texturas y, al final, la actualización hizo que nuestro juego fuese mucho más estable».

Cookie Cutter de Subcult Joint
Al pasar a la última versión Unity, pudieron agregar una capa final de pulido visual a Cookie Cutter, lo que no habría sido posible de otra manera, ya que ahora tenían acceso al sistema 2D Lights listo para producción. Esto significó revisar y arreglar de forma individual los miles de luces 2D previamente experimentales del juego en función de los nuevos parámetros, un proceso que, afortunadamente, se hizo más rápido con nuevas características.
Con la actualización de Sprite Atlas 2022 LTS, Subcult Joint podría enviar cientos de animaciones dibujadas a mano a diferentes plataformas de destino de manera más fácil y eficiente. Y la versión completa de 2D Lights del URP ayudó a agregar aún mayor profundidad y ambiente a los entornos.
"Usamos el nuevo 2D Light Explorer para seleccionar cada luz y hacer los ajustes manualmente", explica Stefano. «Prácticamente habíamos estado usando luces spot y Freeform, y 2022 LTS realmente tenía una función de disminución actualizada para las luces Freeform que se veía mucho mejor que la anterior. Fue mucho trabajo, pero pudimos corregir problemas periféricos y mejorar aún más el juego".
El juego debut de Subcult Joint, Cookie Cutter, es un ejemplo de la magia que sucede cuando los artistas y programadores pueden trabajar en conjunto. Este pequeño equipo creó un juego de Metroidvania visualmente ambicioso y exitoso que vendió más de 60 000 copias en su primer mes. Pudieron mantener su Vision original sin comprometer los gráficos ni la jugabilidad.
La actualización a la versión más reciente Unity no sólo ayudó a Subcult Joint a resolver los desafíos técnicos que aún persistían antes del lanzamiento, sino que también les permitió maximizar el alcance de la plataforma de Cookie Cutter y potenciar todo el potencial del juego.

Cookie Cutter de Subcult Joint
Ampliaron las posibilidades con Unity 6
Unity 6 se trata de poner la creación de juegos fácil y rápida directamente en tus manos, independientemente de dónde se encuentren tus jugadores. Descarga la versión más reciente Unity en Unity Hub.