stoa: un sitio conceptual para un estudio de arquitectura de Moscú y Dubái

stoa es un estudio de arquitectura ficticio con sedes en Moscú y Dubái que proyecta edificios, espacio público e interiores. VITON¹³ creó su web como concepto para mostrar cómo planteamos un porfolio editorial para un estudio de diseño: un sitio en el que los proyectos llevan la página y el texto se queda en segundo plano.

El nombre va en minúsculas a propósito. Una stoa era una columnata cubierta en una ciudad de la antigua Grecia, una sala pública sin paredes, y la web mantiene esa contención: blanco y negro, tipografía en inglés en minúsculas y botones entre corchetes. El movimiento tenía que sentirse lento y con peso, sin impedir llegar a cualquier proyecto, artículo u oferta de empleo.

Diez páginas: portada, proyectos, página de proyecto, estudio, revista (journal), artículo, empleo, contacto, privacidad y 404. El contenido es ficticio pero completo: 10 proyectos, 5 artículos en la revista, 6 ofertas de empleo y 2 sedes en un mapa oscuro.

La portada arranca con un cargador que cuenta y un vídeo a pantalla completa; siguen los valores «we», que se iluminan al hacer scroll, los servicios, la historia del estudio con contadores, proyectos destacados con una imagen flotante, los premios en acordeones [ + ] y un carrusel de la revista que se arrastra. La página de proyectos filtra por disciplina y alterna entre una cuadrícula escalonada y una lista con vista previa junto al cursor. Cada proyecto tiene ficha técnica, entradilla, imagen con parallax, galería arrastrable y enlace al siguiente. La revista filtra por categoría, el empleo se presenta en acordeones con formulario de candidatura, y el contacto incluye un mapa oscuro, las dos direcciones y un formulario de consulta.

Un recorrido típico va de la lista de proyectos a un proyecto y de ahí a un artículo de la revista. El texto se divide en líneas medidas que aparecen una a una; las imágenes se descubren desde abajo y se asientan tras un ligero zoom; el vídeo de portada se reduce y se oscurece al dejarlo atrás. Cada enlace interno cierra la página con un panel claro que cuenta hasta 100, el menú a pantalla completa se despliega desde arriba con una foto por opción, y un cursor propio muestra las etiquetas [ view project ] y [ read ].

Está hecha con HTML, CSS y JavaScript, sin paso de compilación. La cabecera, el pie y las capas superpuestas salen de un único script compartido, así que se ven idénticos en todas las páginas. El movimiento usa GSAP con ScrollTrigger y el desplazamiento suave de Lenis; el mapa es Leaflet. Los formularios funcionan en modo demo: el estado se guarda en el localStorage del navegador y no se envía nada. Las fotos de Unsplash y los vídeos de Pexels son material de stock con licencia, cargado mediante enlaces directos a su CDN.

El concepto existe como 10 páginas terminadas en inglés. El 22 de septiembre de 2026, VITON¹³ revisó 9 de ellas renderizadas en Chrome, sin contar la 404: las 9 tienen títulos únicos e idioma declarado, el diseño se mantiene a 390 px sin desplazamiento lateral, el 100 % de las imágenes tiene texto alternativo y no hay enlaces internos rotos.

Lighthouse en la portada. En móvil: rendimiento 88, accesibilidad 95, buenas prácticas 77 y SEO 100, con LCP de 2,9 s, CLS de 0,008 y TBT de 0 ms. En escritorio: rendimiento 99, LCP de 0,9 s y CLS de 0,003. En móvil la portada pesa 13,4 MB en 21 peticiones, por el vídeo Full HD de la cabecera.

stoa es un concepto, no un encargo. El estudio, su equipo, los proyectos, los premios y las direcciones son ficticios; las fotos y los vídeos son de stock con licencia, de Unsplash y Pexels. La web no tiene dominio, visitantes, tráfico de búsqueda ni consultas, así que este caso no dice nada sobre posiciones, contactos ni sobre cómo la usarían los clientes de un estudio de arquitectura.

El 100 de SEO en Lighthouse solo cubre lo básico. Aún faltan URL canónicas, Open Graph, JSON-LD, sitemap.xml y robots.txt; 8 de los 9 títulos quedan fuera de los 30–65 caracteres, y las cifras de Lighthouse son mediciones de laboratorio de una página en un solo día, no datos de visitantes reales.