¿Por qué navegación por grafo?

Por debajo de cada función de PanelWave hay una decisión que se tomó antes de escribir la primera línea de código: un capítulo no es una secuencia de páginas, es un grafo dirigido. Las viñetas son nodos. Las aristas dicen qué viñeta puede seguir a cuál, con qué condición y con qué transición. Todo lo que después ven lectores y creadores, desde un simple botón «Siguiente» hasta un misterio ramificado, es consecuencia de esa elección. Aquí explicamos por qué la tomamos, qué habrían costado las alternativas y por qué un cómic lineal normal no paga nada por ella. La mecánica está en la documentación, en Navegación por grafo; aquí va el porqué.

Tres formas de decir qué viene después

Los cómics digitales heredan uno de dos modelos. El primero es el modelo impreso: un cómic es una lista ordenada de páginas, y leer significa pasarlas. Conserva el arte y la composición, pero en un móvil obliga a pellizcar y hacer zoom, y no sabe expresar una decisión; la única elección del lector es avanzar o retroceder. El segundo es el modelo de vídeo, el motion comic: las viñetas se convierten en planos de una línea de tiempo, con sonido y movimiento, y el archivo se reproduce. Gana movimiento y atmósfera y pierde por completo al lector. Otro maneja el reloj, el arte compite con la animación y no hay ninguna puerta que abrir.

El tercer modelo es el grafo. Cada viñeta es un nodo con aristas hacia las viñetas que pueden seguirla. Una historia lineal es una cadena de aristas incondicionales, y una decisión es un nodo con dos o más aristas de salida cuyas condiciones difieren. Nada en el modelo favorece una forma sobre la otra, y de eso se trata: el formato no tiene un modo normal y un modo interactivo especial. Tiene una sola primitiva que describe ambos.

Lo que el grafo aporta a los lectores

La experiencia de lectura sale del modelo más directamente de lo que cabría esperar.

• Ritmo. Un nodo es una parada. El lector avanza cuando quiere, o deja que lo haga la reproducción automática con la duración que fije la viñeta o el propio lector. El arte se queda quieto mientras lo mira, a diferencia de un plano en una línea de tiempo.
• Recorrido. Un desvío es una arista que sale de la línea principal y otra que vuelve a ella. Las escenas opcionales, los callejones laterales y las habitaciones secretas no necesitan ninguna maquinaria especial, y el lector siempre tiene un camino de vuelta al arco principal.
• Vuelta atrás. Como cada paso es una arista, retroceder es recorrer la misma arista a la inversa, con su transición incluida. El historial y la navegación hacia atrás funcionan igual en historias lineales y ramificadas.
• Decisión. Una zona interactiva en una puerta guarda en una variable lo que hizo el lector; las aristas de salida del siguiente nodo preguntan por esa variable. La decisión es del lector, y el formato la recuerda.
• Vista. El mismo grafo se muestra viñeta a viñeta en un móvil o como página compuesta en una pantalla grande. La vista de página muestra la disposición que diseñó el creador; la vista de viñeta recorre los nodos. El lector cambia de vista cuando quiere, y la documentación de la interfaz de lectura describe qué hace cada vista con «siguiente» y «anterior».

Lo que un grafo da a los creadores

Para quien crea la obra, el grafo sustituye los casos especiales por datos. Una ramificación no es un script: es una arista con una condición escrita en JSON Logic, una pequeña regla que se lee como una frase. Las decisiones son zonas interactivas que asignan variables con tipo y un ámbito declarado, y el mismo lenguaje de condiciones que dirige las aristas puede cambiar el contenido de una viñeta mediante una variante u ocultar un solo bocadillo. Un solo lenguaje, que se aprende una vez.

Las páginas no desaparecen. Un capítulo puede seguir definiendo maquetaciones de página con posiciones y un orden de lectura, así que la composición impresa se conserva y la exportación para imprenta sigue funcionando. La diferencia es que la página describe cómo se disponen las viñetas y el grafo, cómo avanza la historia. Ambos se mantienen separados a propósito, y la referencia del formato explica cómo conviven en vista de página frente a vista de viñeta. Reordenar las viñetas de una página cambia su orden de lectura; nunca cambia el grafo.

Y como el grafo son datos en un manifiesto JSON y no lógica dentro de un programa, se puede validar. Las viñetas inalcanzables, los callejones sin salida, los puntos de entrada que faltan y los ciclos son preguntas estructurales que una herramienta puede responder antes de que un lector se tope con ellas. El Graph Editor del CMS dibuja el grafo como un mapa, señala esos problemas y te permite simular cualquier camino, y la validación Preflight repite la comprobación de alcanzabilidad antes de publicar.

¿Por qué no un orden de páginas con saltos?

La alternativa obvia y más barata es conservar las páginas y añadir una instrucción de salto: ve a la página 14 si el lector recogió la llave. Las herramientas de ficción interactiva llevan décadas funcionando así, y para texto funcionan bien. En el cómic falla en dos puntos. Primero, un salto es una excepción al orden en lugar de parte del modelo, así que a cada herramienta que entiende de páginas hay que enseñarle los saltos por separado, y la navegación hacia atrás necesita su propia contabilidad. Segundo, los saltos suelen ser código, lo que pone la ramificación detrás de una barrera que la mayoría de los artistas no quiere cruzar. En un grafo, la arista es el orden. No hay nada que añadir, y un editor visual puede dibujarla sin que nadie escriba un script.

¿Por qué no una línea de tiempo?

La línea de tiempo es tentadora porque trae sonido y movimiento gratis, y PanelWave sí usa líneas de tiempo, dentro de una viñeta, para la animación y el audio. El error es convertir la línea de tiempo en la columna vertebral de la historia. Una línea de tiempo tiene una dirección y una velocidad, así que la capacidad de decisión hay que añadirla a la fuerza con pausas y menús, y el arte nunca llega a quedarse quieto. Un grafo pone la línea de tiempo donde le corresponde: un nodo puede tener movimiento, sonido e incluso vídeo, y seguir siendo un lugar en el que el lector se detiene, explora y del que se marcha cuando está listo. El movimiento sirve a la viñeta en lugar de sustituirla.

Lo que pagan las historias lineales

Nada. Esa era la prueba que tenía que superar el diseño. Un cómic convencional en PanelWave es una cadena de aristas sin condiciones, que el CMS crea automáticamente a medida que añades viñetas. El reproductor la recorre exactamente igual que una ramificada: reúne las aristas de salida, evalúa sus condiciones, toma la ganadora. Con una arista incondicional por viñeta, la evaluación es trivial, y el lector ve un cómic que se lee de principio a fin. Solo pagas por la complejidad allí donde la usas, y puedes añadir una primera ramificación al capítulo tres sin reestructurar los capítulos uno y dos.

Un grafo, tres capas

El grafo es también lo que permite que un ecosistema abierto comparta una única definición de una historia. El formato define el grafo como datos, el reproductor lo evalúa al leer y el CMS lo dibuja y lo valida. Ninguno necesita ponerse de acuerdo en nada más allá del manifiesto, y cualquier lector de terceros que implemente las mismas reglas obtiene la misma historia. Esa es la propiedad a la que nos referimos cuando decimos que el formato es el contrato, descrita en Arquitectura. El propio manifiesto es lo bastante pequeño para leerlo; el ejemplo comentado muestra una obra completa en una página.

El modelo es también la razón por la que miramos con calma lo que aún queda por delante. Variantes de viñeta que cambian el contenido según el estado, zonas interactivas que actúan, límites de muro de pago en posiciones exactas de la historia y una vista de lectura en la que se hace visible el espacio entre viñetas: todo eso se puede añadir a un grafo sin cambiar lo que es un grafo. Un orden de páginas o una línea de tiempo habrían necesitado un modelo nuevo para cada cosa.

Para seguir leyendo

• Navegación por grafo: la anatomía de un grafo, condiciones, transiciones y mutaciones.
• Grafo: todas las propiedades de los objetos grafo, arista y mutación.
• Capítulos y páginas: cómo conviven las maquetaciones de página y el grafo.
• Variables: el estado que leen las condiciones de las aristas.
• Graph Editor: dibujar, validar y simular el grafo en el CMS.