Trabajo / Front-end / Kacho Cano
Un portfolio que abre con el vídeo
Proyecto 13 de 28 del archivo 04 de 08 en Desarrollo front-end Ver la disciplina completa ↗
El encargo
Un portfolio audiovisual tiene un problema concreto: la portada es un vídeo pesado y la primera impresión depende de que arranque rápido.
Todo lo demás se subordina a eso.
Cómo se resolvió
La web es estática y se publica arrastrando la carpeta. Los proyectos, las fotografías y el CV viven en un único archivo de datos, así que el cliente añade trabajo nuevo sin tocar HTML.
Incluye página de accesibilidad, tokens de diseño en JSON y controles de reproducción visibles, para quien prefiera el vídeo parado.
En vivo
El sitio entero, funcionando aquí debajo: el reel arranca solo, el disco de la sección de fotografía gira con el ratón, con el dedo, con la rueda y con las flechas del teclado, y el selector ES/EN cambia todo el contenido.
Un marco es buen sitio para demostrar que algo existe y mal sitio para usarlo. Para recorrerlo de verdad, ábrelo en una pestaña.
Los vídeos y las fotografías que se ven aquí no son de Kacho Cano. La página está publicada para que se pueda apreciar cómo va a funcionar —el reel, el disco, las fichas y el formulario—, y el material es un ejemplo de cómo quedará una vez montada con sus trabajos reales.
Ábrelo en grande: el reel, el disco, el CV y el formulario
El marco de aquí debajo demuestra que existe; para recorrerlo hace falta pantalla. Se abre en una pestaña nueva.
El sistema de diseño con el que está construido tiene ficha propia: Sistema de diseño Kacho Cano ↗
Un CMS para que el cliente edite su web
Ese archivo de datos no se toca a mano: construí un panel de administración a medida para que Kacho gestione su página sin escribir una línea de código. Desde ahí añade trabajos y fotografías, ordena el reel de portada y actualiza su perfil, su contacto y su currículum, en español y en inglés a la vez.
Cada ficha genera sola su dirección web, marca los campos obligatorios y guarda las dos lenguas en el mismo formulario. El panel es privado —es una herramienta de trabajo entre el cliente y yo—, pero estas tres pantallas enseñan cómo funciona.
De dónde sale
Este sitio es la última pieza de un proyecto de tres. El diagnóstico y el sistema de diseño están en la ficha de auditoría y diseño UX/UI, y la marca que lo firma, en la de identidad.
Siguiente en Desarrollo front-end
Kacho Cano · Sistema de diseño