Lumina Creative: concept di sito per uno studio creativo
Uno studio creativo immaginario che lavora su brand identity, web design e sviluppo. Il concept esplora un linguaggio visivo morbido e luminoso, fatto di superfici traslucide e colori freddi, per un tipo di attività in cui il sito deve far percepire gusto e attenzione ai dettagli.
Progetto dimostrativo realizzato dal nostro studio per mostrare metodo e livello di dettaglio: il marchio è inventato e non rappresenta un cliente reale.
L’idea
Lumina è un marchio inventato, ambientato a Milano. Lo abbiamo pensato come uno studio che si rivolge a startup e marchi attenti all’immagine, con un portfolio fatto di identità visive, interfacce e campagne.
Molti siti di studi creativi si somigliano: la stessa griglia di progetti su fondo bianco. Qui il nome, che richiama la luce, ha guidato ogni scelta visiva: sfondo quasi nero, aloni di colore sfocati e pannelli che sembrano vetro smerigliato.
Le scelte di design
Tipografia
Space Grotesk per i titoli, grandi e con lettere ravvicinate; Outfit per i testi, un sans serif dalle forme rotonde che ammorbidisce l’insieme.
Palette
Fondo quasi nero (#06060A), testo bianco freddo (#EEEEF0) e un grigio lavanda (#6B6B80) per le parti secondarie. L’accento è un viola (#7C6AFF) con una variante chiara (#A594FF); il rosa (#FF6BCA) compare nelle sfumature del logo, dei numeri e di uno degli aloni.
Superfici in vetro
Le card di servizi e progetti sono pannelli semitrasparenti con bordi sottili da un pixel. La barra di navigazione, quando si scorre, e i pulsanti secondari aggiungono la sfocatura di ciò che sta dietro. Sullo sfondo tre grandi aloni colorati si muovono lentamente.
Struttura e animazioni
Apertura con il nome dello studio, una fascia di parole chiave che scorre, tre servizi, tre progetti con immagine e categoria, una riga di contatori animati e la chiusura con l’invito al contatto. Le sezioni compaiono durante lo scorrimento e, da desktop, un anello segue il cursore e si allarga sopra link e card.
Le scelte tecniche
La demo è costruita su misura in HTML, CSS e JavaScript, senza framework né template. Sono le stesse regole che seguiamo nei siti per i clienti:
- Animazioni leggere: le comparse durante lo scorrimento e il movimento degli aloni usano solo transform e opacity, che il browser anima senza ricalcolare l’impaginazione.
- Profondità senza file in più: gli aloni sono cerchi sfocati disegnati in CSS e la grana dello sfondo è un piccolo SVG incorporato, non un’immagine da scaricare.
- Effetti solo dove servono: il cursore personalizzato si attiva sopra i 1024 px di larghezza; su smartphone e tablet resta il comportamento standard.
- Responsive: le griglie di servizi e progetti si riducono a una colonna sugli schermi stretti.
Sulle immagini: le fotografie della demo sono immagini di repertorio usate come segnaposto. In un progetto reale si usano foto dell’attività, fornite dal cliente o scattate per l’occasione, salvate in WebP o AVIF e nelle dimensioni adatte a ogni schermo.
Cosa mostra a chi cerca un sito simile
Se hai uno studio di design, un’agenzia creativa o un’attività legata al lifestyle, il concept mostra come ottenere un’atmosfera riconoscibile con pochi elementi ripetuti con coerenza: un colore guida, una superficie (il vetro) e un ritmo di comparsa costante.
Cosa ci interessava esplorare
Il glassmorphism è facile da sbagliare: con troppa trasparenza il testo si legge male. Volevamo capire quanta sfocatura e quanto contrasto servono perché le superfici in vetro restino un supporto alla lettura e non un effetto fine a sé stesso.
Esplora il progetto
Naviga la demo completa direttamente qui, in versione desktop o mobile. Testi, numeri e fotografie sono di fantasia o di repertorio: servono solo a dare forma al concept.
Anteprima non visibile? Apri la demo →
Servizi WebNovis coinvolti nel progetto
Per uno studio reale, un sito come questo unisce progettazione grafica e sviluppo su misura:
- Graphic design Materiali visivi coordinati con l’identità del progetto.
- Sviluppo web su misura Progettazione e sviluppo completo, dal design al codice proprietario senza template.
Domande frequenti su un progetto simile
Lumina Creative è un cliente reale?
No. È un concept dimostrativo del nostro studio: marchio, servizi, progetti e numeri che compaiono nella demo sono inventati, e le fotografie vengono da una libreria di immagini libere. Serve a mostrare un linguaggio visivo e il livello di cura che proponiamo anche ai clienti.
Quanto costa un sito di questo tipo?
Dipende da pagine, contenuti e interazioni richieste. Come riferimento, una landing page WebNovis parte da €500 e un sito vetrina su più pagine da €1.200. Il preventivo è gratuito e fissa costi e tempi prima di iniziare.
Quanto tempo serve per realizzarlo?
Secondo il listino, 1–2 settimane per una landing page e 3–4 settimane per un sito vetrina. Revisioni e consegna dei contenuti possono spostare il calendario: le date confermate arrivano con la proposta.
I prezzi di partenza di tutti i servizi sono nella pagina Prezzi.
Vuoi un sito con questo livello di cura per il tuo studio?
Raccontaci il tuo progetto: il preventivo è gratuito e senza impegno.
Richiedi un preventivo