Android TV: el foco, la sala y Leanback

Todo lo que sabes sobre la interacción en Android descansa sobre una premisa que en el salón desaparece: que el usuario puede señalar cualquier punto de la pantalla directamente. El dedo va donde quiere en un solo gesto y sin coste; el ratón también. Un mando de televisión, no. Con un mando solo existen cinco verbos —arriba, abajo, izquierda, derecha, aceptar— y para llegar a un elemento hay que atravesar todos los que están en medio. Eso convierte una propiedad que en el teléfono es casi invisible, el foco, en el eje sobre el que gira la aplicación entera: qué elemento está enfocado al entrar en una pantalla, adónde se mueve el foco con cada pulsación, qué ocurre cuando choca contra un borde y dónde vuelve al regresar. A esa mecánica se suma la distancia: tres metros de sofá reducen el tamaño angular de todo, obligan a duplicar la tipografía, castigan el contraste bajo y hacen ilegible cualquier interfaz densa. Android TV no es Android en horizontal; es Android sin puntero.

El foco es el cursor que el usuario lleva en la cabeza

En una interfaz táctil el usuario mantiene el modelo espacial en la mano: sabe dónde está su dedo porque lo está mirando. Con un mando, el equivalente del puntero es un elemento resaltado en pantalla, y el usuario construye un mapa mental de la rejilla a partir de cómo se mueve ese resaltado. Si el movimiento es predecible, el mapa se forma en segundos y la navegación se vuelve inconsciente. Si no lo es —si una flecha a la derecha salta dos columnas, si bajar desde el tercer elemento de una fila aterriza en el primero de la siguiente— el usuario deja de anticipar y pasa a tantear, y a partir de ahí cada acción cuesta el triple.

Ese mapa mental tiene además una propiedad que conviene explotar: es espacial y no ordinal. El usuario no recuerda que la película que buscaba era la séptima de la tercera fila; recuerda que estaba a la derecha, un poco más abajo. Todo lo que preserve esa correspondencia entre la posición física en la rejilla y la posición en la memoria del usuario reduce el esfuerzo, y todo lo que la rompa —reordenar el contenido entre sesiones, insertar filas promocionales que desplazan lo demás, cambiar el número de columnas según el ancho— lo multiplica. La estabilidad de la disposición vale, en televisión, más que la frescura del contenido.

De ahí que la primera obligación sea que el resaltado sea inequívoco. Un borde tenue de un punto de grosor que funciona en un monitor a cincuenta centímetros desaparece a tres metros. La convención de la plataforma combina varias señales a la vez: escala, elevación, cambio de color de superficie y, cuando procede, revelación de texto adicional. Redundar aquí no es exceso, es la única forma de que el resaltado sobreviva a un televisor mal calibrado en un salón con la persiana subida.

Conviene añadir una observación sobre el hardware que suele ignorarse hasta que llega la primera oleada de incidencias: no hay un mando, hay muchos. Algunos incorporan un panel táctil que emula direcciones, otros tienen botones adicionales de fabricante, algunos televisores exponen además un puntero por giroscopio y otros permiten conectar un mando de juego. Ninguna de esas variantes debería requerir código específico, pero todas revelan implacablemente cualquier dependencia oculta de la velocidad de repetición de una tecla o del orden exacto de los eventos.

La segunda obligación es que exista siempre un elemento enfocado. Una pantalla que se abre sin foco deja al usuario sin punto de partida y sin forma de generarlo salvo pulsando flechas a ciegas. Y la tercera es la restauración: al volver de un detalle a la rejilla, el foco debe reaparecer exactamente donde estaba, porque el usuario recuerda la posición espacial y no el índice.

Esa tercera obligación tiene una consecuencia técnica que se subestima: la restauración debe apoyarse en una clave estable del elemento y no en su posición. Si el catálogo se ha recargado mientras el usuario veía el detalle, el índice siete ya no señala lo mismo, y devolver el foco al índice siete es peor que no restaurar nada, porque el usuario cree estar donde no está. Es la misma disciplina de claves que aprendimos con las listas perezosas, aplicada ahora a una propiedad que en el teléfono no existía.

@Composable
fun FilaDeCatalogo(titulos: List<Titulo>, alAbrir: (Titulo) -> Unit) {
    val restaurador = rememberFocusRestorer()
    LazyRow(modifier = Modifier.focusRestorer { restaurador.requestFocus() }) {
        items(titulos, key = { it.id }) { titulo ->
            var enfocado by remember { mutableStateOf(false) }
            Card(
                onClick = { alAbrir(titulo) },
                modifier = Modifier
                    .onFocusChanged { enfocado = it.isFocused }
                    .scale(if (enfocado) 1.1f else 1f),
            ) { Portada(titulo) }
        }
    }
}

La máquina de estados del recorrido

Conviene formalizar lo anterior. Una pantalla de televisión es un grafo dirigido cuyos nodos son los elementos enfocables y cuyas aristas son las cuatro direcciones. El sistema calcula ese grafo por geometría —busca el candidato más próximo en la dirección pulsada— y acierta en las disposiciones regulares. Falla en cuanto hay huecos, tamaños desiguales, elementos superpuestos o contenido que aparece durante el recorrido, y entonces hay que declarar las aristas a mano en lugar de confiar en la heurística.

flowchart TD
A[Entrada en la pantalla] --> B[Foco inicial declarado]
B --> C[Pulsacion direccional]
C --> D[Existe candidato en esa direccion]
C --> E[No existe candidato]
D --> F[Mueve el foco y desplaza el contenedor]
E --> G[Borde del contenedor]
G --> H[Salir hacia el panel de navegacion]
G --> I[Absorber la pulsacion sin efecto]
F --> J[Pulsacion de aceptar]
J --> K[Abrir detalle y guardar posicion]
K --> L[Retroceso restaura el foco guardado]
style E fill:#f9e2af,color:#11111b
style L fill:#a6e3a1,color:#11111b

Ese grafo tiene además una propiedad que conviene explotar y que la mayoría de los equipos descubre por accidente: es comprobable automáticamente. Nada impide escribir una prueba instrumentada que parta de un foco conocido, inyecte una secuencia de pulsaciones direccionales y afirme dónde termina el resaltado. Ese tipo de prueba detecta las regresiones de recorrido —que son invisibles en una revisión de código y carísimas de encontrar a mano— y es, con diferencia, la inversión de calidad con mejor retorno en una aplicación de televisión.

Hay tres decisiones de borde que definen el carácter de la aplicación. La primera es qué ocurre al llegar al extremo de una fila horizontal: absorber la pulsación es lo correcto cuando la fila es un catálogo largo, y ceder el foco al panel lateral es lo correcto cuando la fila es corta y el panel está a ese lado. La segunda es el comportamiento del desplazamiento: en televisión el elemento enfocado debe permanecer en una posición estable de la pantalla y ser el contenido el que se mueve bajo él, no al revés, porque un resaltado que viaja libremente por el borde desorienta. La tercera es qué pasa con el foco cuando llega contenido nuevo de forma asíncrona: si la lista crece bajo el foco, la posición debe conservarse por clave y nunca por índice.

Hay un segundo grafo, más grueso y menos evidente, que gobierna la navegación entre secciones: el que conecta el panel lateral con el área de contenido. La convención de la plataforma sitúa la navegación principal a la izquierda, colapsada a iconos y expandida al recibir el foco, de modo que el usuario alcanza las secciones moviéndose a la izquierda hasta salir del contenido. Respetar esa convención cuesta poco y desviarse de ella cuesta muchísimo, porque el usuario llega con el modelo ya aprendido de las otras aplicaciones del televisor y no está dispuesto a aprender el tuyo.

También conviene recordar que un mando de televisión tiene más botones que las flechas, y que ignorarlos degrada la experiencia sin que nadie lo reporte: el botón de retroceso debe subir un nivel y nunca cerrar la aplicación desde dentro de una jerarquía, y las teclas de transporte multimedia deben funcionar durante la reproducción aunque tu interfaz no las dibuje, lo que exige una sesión multimedia bien declarada.

Leanback y el catálogo de Compose

Durante casi una década, escribir para Android TV significaba usar Leanback: una biblioteca de fragmentos que traía resueltos el explorador con panel lateral y filas horizontales, la pantalla de detalle, el reproductor con sus controles y la búsqueda. Su modelo es el clásico de vistas —adaptadores de objetos, presentadores que convierten datos en vistas, fragmentos especializados— y su virtud era ofrecer de golpe una aplicación que se comportaba como esperaba la plataforma, con todo el trabajo de foco ya hecho.

Conviene reconocerle a Leanback un mérito que hoy se da por supuesto: fue la primera admisión explícita, en toda la historia de Android, de que una superficie podía necesitar un catálogo de componentes propio en lugar de una adaptación del catálogo de móvil. Esa decisión —que en su momento pareció una fragmentación incómoda— es exactamente la misma que se repite después en el reloj, en el coche y en el visor, y es la razón por la que este nivel entero tiene sentido. La alternativa, un único catálogo universal que se estirase desde la muñeca hasta la sala, se probó implícitamente durante años y no funcionó en ninguna de las dos direcciones.

Su lugar hoy es doble. Sigue siendo la base de muchísimo código existente y no está roto, de modo que migrarlo por moda es una mala inversión. Pero para lo nuevo, el catálogo de Compose para televisión ofrece los mismos comportamientos con el modelo declarativo que el resto de la aplicación ya usa, y sobre todo permite compartir estado, capa de datos y lógica de presentación con las demás superficies sin puentes. La regla práctica es escribir en Compose lo nuevo, convivir mediante interoperabilidad donde haga falta y reservar la migración completa para cuando haya un rediseño de por medio.

Al margen de la biblioteca elegida, hay un conjunto de declaraciones sin las cuales la aplicación ni siquiera aparece en el televisor: el filtro de intención específico del lanzador de televisión, el banner que la representa en la fila de aplicaciones, y la declaración explícita de que la pantalla táctil no es un requisito. Es el error más frecuente en la primera entrega y el más desconcertante, porque la aplicación se instala correctamente y sencillamente no está en ninguna parte.

Hay una superficie adicional que decide buena parte del tráfico y que muchos equipos descubren tarde: la pantalla de inicio del televisor, donde el sistema muestra filas de contenido recomendado por las aplicaciones instaladas. Publicar en ella un canal propio con contenido pertinente y con la reanudación de lo que el usuario dejó a medias equivale, en la práctica, a estar en la portada del aparato. Es el análogo funcional de la tile del reloj: valor entregado sin que el usuario tenga que entrar en tu aplicación.

Un apunte final sobre rendimiento que conviene tener presente desde el diseño. El hardware de muchos televisores y de la mayoría de los reproductores externos es notablemente más modesto que el de un teléfono de gama media, y sin embargo la superficie a rellenar es de resolución alta y las imágenes son grandes. La combinación castiga sin piedad las listas mal medidas, las portadas sin dimensionar y las recomposiciones innecesarias durante el desplazamiento. Todo lo aprendido sobre claves estables, perfiles de arranque y rendimiento de listas se cobra aquí con intereses.

Diseñar para tres metros

Antes de entrar en las magnitudes conviene fijar la unidad de medida correcta, porque es la fuente de casi todos los errores de tipografía en esta superficie. Lo que determina si un texto se lee no es su tamaño físico ni su tamaño en puntos independientes de densidad, sino su tamaño angular: la fracción del campo visual que ocupa a la distancia real de lectura. Un televisor de gran formato visto desde tres metros y un teléfono visto desde treinta centímetros pueden producir el mismo ángulo con tamaños físicos radicalmente distintos, y es el ángulo el que decide. Esta misma unidad reaparecerá en la lección de realidad extendida, donde la distancia deja de ser siquiera constante.

Las guías de sala se resumen en cuatro magnitudes y conviene tratarlas como restricciones y no como sugerencias. La primera es el área segura: los televisores recortan el borde de la imagen en una proporción variable, de modo que todo el contenido significativo debe quedar dentro de un margen generoso —del orden del cinco por ciento de cada lado— y el fondo puede extenderse hasta el borde real. La segunda es la tipografía: el tamaño mínimo cómodo a distancia de sofá es aproximadamente el doble del de un teléfono, y los textos secundarios que en móvil se leen apretando los ojos aquí sencillamente no se leen. La tercera es el contraste, con la particularidad de que un televisor en un salón iluminado pierde el detalle en las sombras mucho antes que un panel de móvil, lo que descarta las grises sobre gris que tan bien quedan en la maqueta. Y la cuarta es la densidad: menos elementos, más grandes y más separados, porque cada elemento adicional en una fila es una pulsación más de flecha.

Hay además una restricción de disposición que se deduce del grafo de foco y que muchos diseños ignoran: en televisión, las rejillas irregulares se pagan caras. Una cuadrícula de elementos de tamaños distintos, que en un teléfono resulta atractiva y se recorre con el dedo sin coste, convierte el recorrido direccional en una lotería, porque la heurística geométrica no tiene una respuesta obviamente correcta cuando el vecino de arriba de un elemento ancho son tres elementos estrechos. La disposición canónica de filas horizontales homogéneas apiladas verticalmente no es una limitación estética heredada de Leanback: es la geometría que hace que el grafo de foco sea predecible.

Hay dos consideraciones específicas del medio que no aparecen en ninguna otra superficie. La primera es la retención de imagen: un elemento estático muy brillante durante horas puede marcar ciertos paneles, lo que desaconseja las interfaces fijas y permanentes y aconseja atenuar tras un periodo de inactividad. La segunda es que el televisor es un dispositivo compartido, a menudo con varios perfiles y siempre con varios espectadores presentes, lo que cambia por completo el cálculo sobre qué se muestra en la pantalla de inicio y qué se considera información sensible.

Merece un párrafo aparte la reproducción, porque es la razón de ser de la mayoría de las aplicaciones de televisión y porque concentra sus defectos más visibles. Los controles deben aparecer al pulsar cualquier dirección y desaparecer solos tras unos segundos de inactividad, sin exigir un gesto de cierre que en un mando no existe. El desplazamiento por la línea temporal se hace con las flechas laterales y con saltos proporcionales a la duración, no con un arrastre que aquí es imposible. Y toda la información contextual —título, capítulo, calidad, subtítulos— debe estar disponible sin abandonar la reproducción, porque salir para consultarla y volver es una penalización de varios segundos de recorrido direccional.

Conviene cerrar con una observación de método que ordena todo lo anterior. En televisión, la secuencia correcta de trabajo es exactamente la inversa de la habitual en móvil: primero el grafo de foco, después la disposición, y solo al final el aspecto. Un diseño precioso con un recorrido impredecible es inservible, mientras que un diseño sobrio con un recorrido impecable se percibe como una aplicación de calidad. Es la única superficie de este nivel donde la interacción antecede sin discusión a la estética.