Progetto 03 / 06 · sito web
CURATA
Un prototipo di boutique di articoli Amazon UK, scelti dal personaggio Cura. È un prototipo, non un negozio attivo.
Panoramica
Screenshot
Livello di prova: Prova esistente
Vedi la prova
Affermazione
CURATA: un prototipo di boutique di articoli Amazon UK, scelti dal personaggio Cura. È un prototipo, non un negozio attivo.
Dichiarato da Danilo
Prove
- Screenshot del prototipo CURATA (desktop e mobile) · manual · verificato il 29 settembre 2026Presi il 29/09/2026 dal progetto in esecuzione in locale, perché non è online.
- Registrazione dello schermo del prototipo CURATA in esecuzione (13 s, senza audio) · manual · verificato il 29 settembre 2026Registrata il 29/09/2026 con Playwright dal progetto in esecuzione in locale: la home page, poi le schede delle stanze che riproducono i loro video al passaggio del puntatore.
- Sorgente di CURATA: le sei stanze (src/app/page.tsx, righe 76–84) · manual · verificato il 29 settembre 2026Copiato testualmente dal file sorgente reale il 29/09/2026 (fine riga normalizzati).
- Sorgente di CURATA: una scheda stanza che riproduce il suo video al passaggio del puntatore (src/app/page.tsx, righe 522–545) · manual · verificato il 29 settembre 2026Copiato testualmente dal file sorgente reale il 29/09/2026 (fine riga normalizzati).
Risultato
Screenshot reali della pagina, presi dal progetto in esecuzione il 29/09/2026. Che l’abbia costruito Danilo è una sua dichiarazione.
In questa pagina
- 02 In azione: una registrazione dello schermo del prototipo in esecuzione
- 03 Codice: estratti del sorgente della home page
Non in questa pagina
- Una vista 3D: il sorgente attuale del prototipo non renderizza alcuna scena 3D, quindi non c’è nulla di reale da registrare.
- Misurato: questo prototipo gira solo su un server di sviluppo locale, e i punteggi presi lì non sarebbero rappresentativi.
In azione
La home page, poi le sei “stanze”: ogni scheda riproduce il suo breve video mentre il puntatore ci passa sopra.
Registrazione dello schermo
Livello di prova: Prova esistente
Codice
Le sei stanze sono dati; la pagina trasforma ognuna in una scheda il cui video parte mentre il puntatore è sopra, e torna all’inizio quando esce.
/* ─── Data ────────────────────────────────────────────────────── */
const CATEGORIES: Category[] = [
{ id:'tech', title:'Tech Room', subtitle:"Boring tech that quietly works.", href:'/tech-room', poster:'/images/rooms/tech.jpg', video:'/videos/rooms/tech.mp4', count:'6 finds', status:'open' },
{ id:'beauty', title:'Beauty Edit', subtitle:"Skincare without the alchemy marketing.", href:'/beauty-room', poster:'/images/rooms/beauty.jpg', video:'/videos/rooms/beauty.mp4', count:'6 finds', status:'open' },
{ id:'kitchen', title:'Kitchen Lab', subtitle:"Tools that actually cook, not collect dust.", href:'/kitchen-room', poster:'/images/rooms/kitchen.jpg', video:'/videos/rooms/kitchen.mp4', count:'6 finds', status:'open' },
{ id:'home', title:'Home Upgrade', subtitle:"Small flat. Big quietly-clever fixes.", href:'/home-room', poster:'/images/rooms/home.jpg', video:'/videos/rooms/home.mp4', count:'6 finds', status:'open' },
{ id:'wellness', title:'Wellness Room', subtitle:"Sleep, recover, breathe. No miracle cures.", href:'/wellness-room', poster:'/images/rooms/wellness.jpg', video:'/videos/rooms/wellness.mp4', count:'6 finds', status:'open' },
{ id:'pet', title:'Pet Room', subtitle:"For the small ones who run the house.", href:'/pet-room', poster:'/images/rooms/pet.jpg', video:'/videos/rooms/pet.mp4', count:'6 finds', status:'open' },
]
Livello di prova: Prova esistente
const isOpen = cat.status === 'open'
const inner = (
<motion.div variants={reduce?undefined:FV.fadeUp} className="st-cat-card"
onMouseEnter={(e) => {
const v = e.currentTarget.querySelector('video') as HTMLVideoElement | null
v?.play().catch(() => {})
}}
onMouseLeave={(e) => {
const v = e.currentTarget.querySelector('video') as HTMLVideoElement | null
if (v) { v.pause(); v.currentTime = 0 }
}}
style={{position:'relative',padding:0,background:P.bg,border:`1px solid ${P.border}`,borderRadius:'14px',display:'flex',flexDirection:'column',cursor:isOpen?'pointer':'default',opacity:isOpen?1:0.7,overflow:'hidden'}}>
{/* Cinematic visual — poster image + hover video */}
<div style={{position:'relative',aspectRatio:'16/9',width:'100%',background:P.surf2,overflow:'hidden'}}>
{/* eslint-disable-next-line @next/next/no-img-element */}
<img src={cat.poster} alt="" loading="lazy" style={{position:'absolute',inset:0,width:'100%',height:'100%',objectFit:'cover',zIndex:1}}/>
<video
src={cat.video}
muted
loop
playsInline
preload="none"
aria-hidden
style={{position:'absolute',inset:0,width:'100%',height:'100%',objectFit:'cover',zIndex:2}}
Livello di prova: Prova esistente