Florecer espiritual es el primer evento de Riot que se celebra en múltiples juegos, lo que permite a los jugadores explorar Florecer espiritual tanto en League of Legends como en Legends of Runeterra. Pero antes de profundizar en cómo ocurrió, echemos un vistazo a qué es Florecer espiritual.

Florecer espiritual es un evento que forma parte de la historia (de la IP de League of Legends) y señala la época en la que florece la verdadera (verdaderamente ficticia) flor espiritual en Jonia. Los jonios utilizan las propiedades espirituales intrínsecas de la flor para comunicarse con sus seres queridos fallecidos y celebrar su pacífica partida hacia el más allá o llorar por su incapacidad para descansar.

Spirit Blossom

No obstante, League of Legends y LoR son dos juegos muy diferentes: uno es un MOBA y el otro un juego de cartas coleccionables. Su estética y jugadores son distintos, por tanto ¿cómo podemos asegurarnos de que los jugadores experimenten algo coherente en ambos juegos?

El diseño visual ha entrado en el chat

El diseño visual de Riot se divide en dos áreas principales: los diseñadores que trabajan en los productos y crean elementos individuales como iconos, tableros e interfaces de usuario para nuestros juegos; y los diseñadores que trabajan con las marcas y la publicidad y se aseguran de que los jugadores entienden exactamente lo que van a conseguir antes de empezar a jugar.

Vamos a echar un vistazo a cómo trabajan conjuntamente los diseñadores de ambas áreas para asegurarse de que el lenguaje visual y el estilo sean consistentes entre los diferentes juegos.

Empecemos por el principio: el descubrimiento del aspecto visual de Florecer espiritual.

La creación de la identidad visual de Florecer espiritual

Con Craig "Riot MrParkinson" Parkinson, diseñador visual de League of Legends

Key art

Empecé preguntando al equipo de desarrollo de temáticas, es decir, a los artistas, escritores y productores encargados de crear el multiverso de League of Legends qué era exactamente Florecer espiritual. Cuando me hablaron sobre la temática, repitieron una serie de palabras clave: excéntrico, espiritual, elegante, pacífico, abstracto y encantador. Escribí dichas palabras en un documento y... me puse a ello.

Florecer espiritual se centra en el más allá y en los espíritus que residen ahí. Están interconectados inherentemente en el reino espiritual y viven en una paz relativa. Utilicé esta idea como punto de referencia y comencé a recopilar referencias visuales y a crear tablones conceptuales que evocasen los sentimientos que he mencionado antes.

Después, ordené las referencias según las áreas principales que tenía que explorar y me centré en el idioma de las formas, los colores y las texturas. Esto me ayudó a decidir la dirección en la que quería llevar a la marca de Florecer espiritual. Sin embargo, tuve que preguntarme cómo unir los diferentes elementos (especialmente las ideas provenientes del anime, la mitología del este asiático y LoL) para que tuviesen un sentido completo.

El idioma de las formas

Quería capturar la elegancia del evento con un lenguaje de formas único. Tenía que ser algo abstracto y delicado, además de fresco y extraño. Utilizando esto como guía, empecé a explorar los tipos de formas que necesitaba.

La geometría se me vino a la cabeza casi instantáneamente. Podía utilizar las formas elegantes de las que estábamos hablando para crear una especie de simbolismo que hiciese referencia a los diferentes elementos del festival del Florecer espiritual. Encajaba verdaderamente bien con la temática en general, porque el propósito de la geometría depende de lo que cada uno quiera entender al verla. Puede significar múltiples cosas y ninguna al mismo tiempo.

exploration

Utilicé imágenes del arte del este asiático como referencia: formas florales, remolinos y nubes. Cuando empecé a probar estos elementos y a pensar en cómo encajarían con la interfaz de usuario, me di cuenta de que faltaba algo: una mayor conexión con el trabajo del equipo de desarrollo de temáticas. ¿Y si utilizaba el arte conceptual de los aspectos en el diseño?

 

Yasuo concept

Quería que todo tuviese relación con los elementos que los jugadores podrían ver y con los que podrían interactuar en partida, así que añadí dichos componentes para completar la experiencia. La geometría en la que me había centrado se convirtió en los patrones folclóricos de la camisa de Yasuo. Utilizándolos como punto de referencia, pensé en cómo podrían servir de apoyo estos característicos patrones y formas del folclore a los elementos de la marca. Así es cómo llegué a la siguiente fase: color y textura.

Color y textura

El equipo de desarrollo de temáticas creó una paleta de colores preciosa para el evento. Dicha paleta estaba compuesta mayormente por colores de acuarela. Todo estaba diseñado para que pareciese excéntrico y onírico. Mientras buscaba pinturas de acuarela para tomar como referencia, me di cuenta de que en ellas había múltiples texturas (incluso en la forma en la que la tinta caía sobre el papel).

colors

Quería mantener el diseño visual de los aspectos, para que todo encajase bien junto. Sin embargo, necesitaba texturas únicas para que no todo estuviese compuesto por colores planos. Utilicé elementos como la corteza de los árboles, pinceladas o las venas de una hoja como inspiración y conseguí crear una pequeña parte del diseño visual del evento.

Después de estos descubrimientos iniciales, y de que el equipo diese su visto bueno, me volví loco. Diseñé alrededor de 90 logotipos. Fue una locura. Cada vez que se los enseñaba al equipo y me comentaban su opinión, reducía la lista hasta el punto en el que nos encontramos actualmente.

final logo

Una vez que todo estuvo decidido y listo, creé una guía y se la di al resto de equipos trabajando en el evento. Y eso es lo que utilizó el equipo de Legends of Runeterra para empezar.

Trasladando Florecer espiritual a LoR

Con Tom "Riot Tomukus" Sayer, diseñador visual sénior de Legends of Runeterra

LoR Key Art

Trabajo en el diseño y la implementación de elementos en Legends of Runeterra. Esto significa que trabajo con diseñadores de la experiencia de usuario, ingenieros, artistas conceptuales y escritores (básicamente con todo el equipo de LoR) para asegurarnos de que los jugadores tengan algo que ver y con lo que interactuar en nuestro juego.

Mi trabajo comienza cuando los diseñadores de la experiencia de usuario nos dan una representación esquemática. Dicha representación es, básicamente, un conjunto de cajas grises, blancas y negras que nos dan una idea del lugar que ocupará cada uno de los elementos que creemos. Después, me toca a mí reordenar dichos elementos y decidir su jerarquía individualmente, es decir, escoger qué irá en la parte trasera o en la delantera. Esto se hace en función de la información que resulte más importante para los jugadores.

Al diseñar el espacio del cliente para Florecer espiritual, decidimos crear un registro para que los jugadores pudiesen ver su progreso conforme consiguiesen recompensas. Funciona de una forma similar a las recompensas regionales, que permiten a los jugadores escoger una región y conseguir recompensas. El diseño visual tenía que recopilar toda esta información para asegurarse de que el registro de Florecer espiritual fuese visualmente coherente respecto al estilo creado en LoL y de que fuese distinto al de las recompensas regionales.

Para ello, estudié los elementos y las guías del diseño visual que había preparado Riot MrParkinson y los traduje a un formato que encajase en LoR. Aunque LoL y LoR pertenecen a la misma IP (y son de la misma empresa) sus ilustraciones y diseños visuales tienen estilos únicos. El cliente de LoL es una interfaz de usuario moderna y plana. Tiene algunas florituras en ciertas zonas, pero es diferente al de LoR, en el que adoptamos un enfoque más esqueumórfico.

Es diseño esqueumórfico es más realista. Si echáis la vista atrás y recordáis cómo eran los primeros teléfonos, os daréis cuenta de que el diseño de sus aplicaciones era bastante realista. Las notas tenían la textura del papel y la fuente que aparecía al escribir parecía escrita a mano con lápiz o bolígrafo. Esto se debía a que la gente no estaba acostumbrada a tomar notas desde una pantalla táctil. Adoptamos el mismo enfoque en LoR, para que los jugadores se metiesen de lleno en el mundo de Runaterra. Todos los objetos con los que podéis interactuar parecen objetos físicos. Por tanto, cuando llegó la hora de aplicar el diseño visual de Florecer espiritual, tuvimos que adaptarlo un poco al LoR. Esto se puede observar por todas partes en la interfaz de usuario, pero el ejemplo más evidente es la nube.

logo transformation

Cuando Riot MrParkinson nos dio las guías visuales, vi que habían incluido nubes entre los elementos en los que podíamos inspirarnos. Tienen un estilo similar al del este asiático, lo que encaja bien en LoR porque ambos elementos son muy estilizados. Tienen muchos remolinos y, por lo general, parecen esponjosas. Sin embargo, para conseguir que encajasen con nuestro cliente, tenía que añadir textura a las nubes y hacer que fuesen más metálicas, porque ese es el estilo general que utilizamos.

Al empezar a trabajar con las nubes, busqué referencias, lo que significa que abrí Adobe Illustrator, pegué las referencias visuales de Riot MrParkinson en el tablón de referencias artísticas y me puse a dibujar. Quería que fuesen metálicas y más voluminosas, por lo que, en lugar de dibujar sobre las referencias, las dibujé yo directamente.

Personalmente, prefiero empezar dibujando en Illustrator porque puedo crear un vector limpio. Después, puedo retocar las líneas para que sean más anchas o estrechas. Tras eso, lo importo a Photoshop como una forma.

Cuando ya tengo el vector en Photoshop, utilizo estilos de capa como el biselado y el relieve, añado gradientes y pinceladas, y creo sombras y luces tanto interiores como exteriores. Cuando doy con lo que estaba buscando, aplico el estilo de las capas al vector de la nube.

clouds

Terminé de crear el estilo de la capa añadiéndole una sombra, ya que quería enviar las nubes a la parte trasera y que pareciese que flotan sobre el fondo.

Y, después, me puse a pintar.

Añadí algunos toques de luz y varias zonas sombreadas. Y, para que no pareciese una pieza metálica plana pegada sobre el cliente, añadí unas líneas oscuras que dan la sensación de que se doblan hacia el jugador.

Cuando estuve contento con el resultado, se lo enseñé al equipo. Y, después, hice lo mismo con todos los otros elementos del evento. Había alrededor de 40 en total. Es importante que todos los elementos parezcan hechos a mano, ¡porque lo están!

Client

Solo espero que los jugadores que jueguen a LoL y a LoR vean lo que hemos creado y se den cuenta al momento de que se trata del mismo evento. Eso significará que hemos hecho bien nuestro trabajo y que hemos dado a los jugadores de ambos juegos una experiencia coherente.