Creo sitios conceptuales para mostrar alcance en sectores donde aún no tengo un proyecto de cliente. ORIVA es uno de ellos: la tienda online de un taller acústico ficticio que vende auriculares, altavoces, amplificadores, vinilos y accesorios. La marca, los productos, los precios y las boutiques son inventados, y el sitio está en ruso.

La tienda tenía que funcionar de principio a fin, no solo parecer de gama alta. Quien compra debe poder acotar el catálogo, elegir un color en la ficha, aplicar un código promocional, completar un pago que valida cada campo y ver la confirmación del pedido. Quien aún no quiere comprar debe poder encontrar una boutique y reservar una sesión de escucha.

18 páginas: portada, catálogo, producto, carrito, pago, confirmación del pedido, cuenta, favoritos, revista, boutiques, taller, envíos, soporte, contacto, privacidad, condiciones, cookies y una 404. El catálogo reúne 13 productos y los filtra por categoría, precio, color y etiquetas, con orden y chips que muestran los filtros activos. La ficha de producto tiene galería con lightbox, color y cantidad, acordeones, reseñas y productos relacionados.

El carrito acepta 2 códigos promocionales de demostración y muestra una barra de progreso hasta el envío gratuito desde 30 000 rublos, un umbral de demostración. El pago tiene tres pasos con validación: contacto, envío y pago. Las boutiques de 6 ciudades aparecen en un mapa interactivo con reserva de una sesión de escucha, y la sala de escucha es un reproductor dibujado como un disco que gira bajo su brazo: 5 pistas, barra de avance, volumen y paso automático.

La portada se abre con un vídeo a pantalla completa y sigue como un relato al hacer scroll, con contadores; la animación usa GSAP con ScrollTrigger y el desplazamiento suave de Lenis. El sitio está hecho con HTML, CSS y JavaScript sin paso de compilación: la cabecera, el pie y las capas superpuestas salen de un único script compartido, y las cuentas, los carritos y las reservas se guardan en el localStorage del navegador; no se envía nada a ninguna parte.

Hoy existe un concepto que funciona: 18 páginas, 13 productos, boutiques en 6 ciudades y una sala de escucha con 5 pistas, utilizable del catálogo a la confirmación del pedido sin servidor. Las comprobaciones del 22 de septiembre de 2026 en 17 páginas encontraron un H1 en cada una, texto alternativo en el 100 % de las imágenes y 0 enlaces internos rotos.

Lighthouse dio a la portada SEO 100 y accesibilidad 99 tanto en móvil como en escritorio, y un rendimiento de 97 en escritorio frente a 66 en móvil. Lo que frena la nota móvil es el peso: la página envía 12,8 MB al teléfono, con un vídeo de portada en Full HD e imágenes, y el LCP llega a 7,3 s.