Cargando
Demos en vivo

Qué es una web inmersiva y cuándo merece la pena

Una web inmersiva es una web que se recorre en vez de leerse. En lugar de un documento con fotos, la página es una escena —casi siempre 3D en tiempo real, dibujado por el propio navegador de quien la visita— que cambia al hacer scroll, con movimiento y a veces con sonido. No hay una definición oficial: es el nombre que les dan estudios y diseñadores, y el Nielsen Norman Group señala que el deseo de que una web se sienta «inmersiva» está detrás de muchos efectos como el parallax.

Aquí verás de qué están hechas estas webs, cuándo ayudan a un negocio y cuándo le estorban, y qué hace que una funcione. Lo que cuesta cada camino está en cuánto cuesta una web 3D.

Qué hace inmersiva a una web

El 3D en tiempo real. La escena la dibuja el aparato de quien visita la web con WebGL, la interfaz del navegador para gráficos 2D y 3D, en vez de reproducirse como un vídeo, así que puede responder al scroll y al puntero y verse desde el ángulo que la página permita.

Un scroll que cuenta una historia. La barra de desplazamiento se convierte en una línea de tiempo: las secciones se quedan quietas mientras la escena recorre un momento, y los textos entran cuando hay algo que decir. Cómo se hace una web 3D explica cómo se construye todo eso, del modelo a la página legal.

No es realidad virtual. La palabra también nombra otra cosa. WebXR, el conjunto de estándares del navegador para la realidad virtual y la aumentada, dibuja escenas 3D en unas gafas o sobre lo que ve la cámara de un móvil. Una web inmersiva, en el sentido de esta página, funciona en una pantalla normal, sin gafas.

Cuándo merece la pena

Cuando lo que vendes se vive más que se enumera: un lugar al que la gente viaja, un producto cuya forma y materiales importan, una app que se entiende mejor enseñándola que describiéndola, un portfolio donde el trabajo es el argumento.

Cuando lo importante es la primera impresión. La gente llega desde un enlace, un anuncio, un código QR o un perfil en redes, y la página tiene unos instantes para que se quede; una página que se siente como lo que vendes está hecha para ese momento.

Cuando una página lo cuenta todo, con una sola cosa que hacer al final —reservar, comprar, descargar la app, escribir—, y cuando puedes dejar los textos en HTML y controlar lo que pesa, para que no te cueste nada ni en el buscador ni en velocidad. Velocidad, SEO y 3D cuenta lo que eso exige.

Cuándo no

Cuando la gente viene a encontrar algo rápido: el horario, la carta, un precio, un teléfono. El movimiento entre ellos y la respuesta estorba; la investigación de NN/g vio que las animaciones de texto ligadas al scroll, mal usadas, ralentizan la lectura.

Cuando necesitas aparecer en muchas búsquedas distintas. Google clasifica páginas, y una sola página inmersiva no puede ser la respuesta a diez preguntas diferentes; una página o varias lo explica.

Cuando el movimiento se adueña del propio scroll. En las pruebas de usabilidad de NN/g sobre el scrolljacking —páginas que cambian el ritmo o la dirección del desplazamiento—, la mayoría de los participantes acabaron al menos algo desorientados, y en el móvil fue peor. Su consejo: dejar secciones con scroll normal, no meter los textos importantes en el efecto y evitarlo en el móvil.

Cuando el movimiento marea a quien la visita y no hay forma de reducirlo. La guía de accesibilidad del W3C cita mareos, náuseas y dolores de cabeza entre las reacciones de las personas con trastornos vestibulares; una web puede leer el ajuste de movimiento reducido del sistema, y debería.

Qué hace que funcione

Un protagonista concreto. Los kits de Promti siguen una regla: cada escena enseña algo real —el producto, el lugar, las pantallas de la app, el trabajo—, nunca formas abstractas.

Textos que venden, en HTML. Google dice que no indexa lo que se muestra en un canvas, así que la escena puede poner el ambiente, pero los títulos, la oferta y el botón tienen que ser texto de verdad.

Una versión para el móvil y una salida. La escena encuadrada para una pantalla en vertical, menos resolución de dibujo en el móvil, el movimiento reducido respetado y una página que funcione sin WebGL.

Una acción clara al final, y una prueba en un móvil de gama media antes de publicar.

Los kits de Promti

Los cuatro kits de Promti son webs inmersivas de una página, cada una hecha para un tipo de negocio: Product para un producto, con tu propio modelo 3D o el sustituto del kit; Forest para un lugar, cuyo día se cuenta con seis fotos tuyas; App para una app, en un móvil y un portátil; Studio para el trabajo de un estudio, colgado en una galería. Cada uno tiene su demo en vivo, y el asistente te enseña tu versión antes de pagar.

También fijan secciones —la página se detiene mientras la escena avanza—, y por eso mantienen el scroll propio del navegador en las pantallas táctiles y siempre que el visitante ha pedido reducir el movimiento.

Preguntas

¿Qué diferencia hay entre una web inmersiva y una normal?
Una web normal se lee como un documento: textos, fotos, menús, páginas. Una inmersiva se recorre: la página es una escena, casi siempre en 3D en tiempo real, que el scroll va atravesando. Las dos necesitan la misma base: textos que el buscador pueda leer, una página que cargue rápido, un siguiente paso claro.
¿Una web inmersiva es lo mismo que una web de realidad virtual?
No. La realidad virtual y la aumentada en la web usan WebXR, que dibuja escenas 3D en unas gafas o sobre lo que ve la cámara del móvil. Una web inmersiva es 3D en una pantalla normal, y se recorre con el scroll como cualquier página.
¿Las webs inmersivas funcionan en el móvil?
Pueden, si se hacen pensando en el móvil desde el principio: una escena encuadrada para una pantalla alta, menos píxeles que dibujar y el scroll normal. Importa por partida doble: Google indexa la versión móvil de las páginas, y NN/g vio que los efectos de scroll desorientan más en el móvil.
¿Son accesibles las webs inmersivas?
Pueden serlo, con trabajo: todos los textos importantes en HTML para los lectores de pantalla, respeto al ajuste de movimiento reducido del sistema y una versión que funcione sin WebGL. Sin eso, dejan fuera justo a las personas para las que está escrita la guía del W3C.
¿Cuánto cuesta una web inmersiva?
Hecha desde cero por un estudio especializado, Metabole Studio sitúa una web narrativa inmersiva con escenas 3D entre 25.000 y 60.000 €. Los kits de Promti cuestan 500 € cada uno, de una vez, por una página construida sobre la escena de un kit. Los caminos intermedios están en cuánto cuesta una web 3D.