Le Puzz
Sunny Sunday Circular è un tabloid pieno di misteri.
Le Puzz è un sistema di e-commerce massimalista per boutique, costruito su una base bicolore: un giallo intenso, simile a un nido d'ape, abbinato al nero puro, su uno sfondo grigio perla freddo. Il suo stile è un incrocio tra un giornale vintage e un puzzle: il corpo del testo è in Times con grazie, mentre i titoli sono in un font personalizzato, Times Now, rompendo volutamente con le convenzioni tradizionali dell'e-commerce che si basano sui font senza grazie. L'interfaccia stessa è semplice e basata su una griglia, permettendo che l'impatto visivo sia trasmesso dal packaging dei prodotti (composizioni dense e illustrate piene di giocattoli). I controlli dell'interfaccia sono piuttosto robusti: pulsanti con bordo nero su sfondo giallo, icone a forma di pillola, schede con un raggio di 12px e un'ampia spaziatura tra le lettere per le maiuscole ridotte, che conferisce persino al pulsante "AGGIUNGI RAPIDAMENTE" un tocco editoriale.
Una classica griglia e-commerce con un design editoriale distintivo. L'intestazione è una striscia gialla a nido d'ape con un bordo nero di 1 larghezza, che ospita un logo centrato e una riga aggiuntiva di pulsanti di navigazione. Sotto, sopra una griglia di prodotti a tre colonne su sfondo grigio, si trova un'intestazione di benvenuto centrata nel carattere Times Now. L'elemento principale è un blocco fotografico centrato con angoli arrotondati (40), affiancato da due schede prodotto. Il ritmo delle sezioni è mantenuto: ampio spazio verticale (30), superfici gialle e grigie alternate e una larghezza massima di circa 4,5 cm, centrata sulla pagina. Le schede prodotto hanno le stesse dimensioni e sono disposte in una griglia ordinata a tre colonne con spazi di 5 cm. Il layout è simmetrico e legato alla griglia: nessuna composizione asimmetrica o elementi sovrapposti.
L'elemento visivo è la fotografia di prodotto. Le scatole dei puzzle sono fotografate frontalmente su uno sfondo bianco/neutro, per poi essere posizionate su uno sfondo da studio blu caldo o naturale. L'immagine principale ritrae una persona che tiene in mano diverse scatole di puzzle: un oggetto di lifestyle, catturato con energia spontanea. Il packaging stesso è ricco, illustrativo e massimalista: una moltitudine di giocattoli, prodotti alimentari e personaggi in colori primari brillanti con spessi contorni neri, progettati per assomigliare alle illustrazioni di un libro per bambini sparse su un puzzle da 500 pezzi. Nessuna grafica astratta, nessun rendering 3D, nessuna iconografia a parte una singola lente d'ingrandimento: i puzzle stessi sono il linguaggio visivo.
Tavolozza
Marca
- Honeycomb Yellow
#ffd931— Il colore principale del marchio, la barra del titolo, i pulsanti di azione principali, lo stato attivo della navigazione, il colore della sottolineatura dei link, il riempimento di accento: l'unica nota di colore attorno alla quale ruota tutto il resto.
Neutro
- Carbon Black
#000000— Il testo principale, i bordi spessi, i contorni dei pulsanti, i contorni delle icone e il testo di navigazione costituiscono la base strutturale dell'intero sistema. - Ink Black
#231f20— Testo secondario, testo principale, bordi dei pulsanti, bordi dei campi di input: un colore leggermente più caldo, quasi nero, per un effetto più morbido. - Pearl Gray
#c8cbcd— Tela per pagine, sfondi per schede prodotto, una scena suggestiva dove compaiono i colori giallo e nero. - Fog Gray
#a6a8aa— Superfici dei badge dai colori tenui, sfondi secondari dei chip e riempimenti discreti dell'interfaccia utente. - Smoke Line
#d6d6d6— Divisori sottili, discreti divisori per tavoli/carte.
Tipografia
da 11 a 47px · 6 passaggi
- Times Now — sostituzione: Playfair Display · contorni 100, 400 · Un carattere serif per titoli e sottotitoli, utilizzato per intestazioni principali, nomi di prodotti e titoli di sezione. Il carattere ultraleggero da 100 punti con un passo di 47 pixel crea un effetto editoriale alto e quasi condensato; le forme delle lettere condensate (altezza delle righe da 0,87 a 0,90) consentono di posizionare titoli di grandi dimensioni vicino al testo di accompagnamento, imitando un poster stampato.
- Times — sostituzione: Times New Roman · contorni 400 · Il testo con caratteri serif è una scelta inaspettata per un negozio online, conferendo all'intero sito un'atmosfera letteraria, quasi da catalogo. La piccola interlinea (1,15) rende i paragrafi compatti e leggibili.
- Helvetica Neue — sostituzione: Helvetica · contorni 100, 400 · Il testo di piccole dimensioni nell'interfaccia utente, il testo sui pulsanti e il microtesto sono impostati con un carattere di 11 pixel e un'ampia spaziatura tra le lettere (0,0730em), che crea la sensazione di scrivere in maiuscolo anche a una temperatura corporea confortevole.
Intervalli e forma
| Scopo | Senso |
|---|---|
| Densità | denso |
| Passo base | 15px |
| Raggio del pulsante | 12px |
| Raggio della carta | 12px |
| Ombre | no - bordi invece di ombre |
| Tra le sezioni | 30-40px |
| Larghezza del pannello | 1200px |
L'IA creerà il tuo sito web nello stile Le Puzz e lo riempirà
- Pubblica prodotti e contenuti tramite il link: Instagram, TikTok, Facebook.
- Trasferisci i contenuti dal tuo vecchio sito: basta specificare l'indirizzo.
- Design moderno sul miglior motore: React ( Next.js) con rendering lato server e ottimizzazione SEO integrata.
- Ottimizzazione SEO completamente automatizzata per i risultati di ricerca e raccomandazioni basate su reti neurali.
Stili simili
- Agence Foudre — La copertina della rivista è di un delicato color rosa che ricorda il rossetto.
- INVERSA — Un terminale topografico a mezzanotte. Un pannello di controllo scuro, dove un carattere tipografico enorme e un singolo strato di indicatori verde neon si sovrappongono a immagini satellitari della Terra, ogni etichetta monocromatica, come se stesse leggendo le coordinate di una missione.
- Acne Studios — Uno spazio espositivo minimalista, ricco di fotografie dai colori vivaci: una rivista di moda disposta su marmo.
- GTE — Terminale di negoziazione dietro l'illuminazione della galleria
- Diabla — Un cortile mediterraneo a mezzogiorno: muri rosa sbiaditi dal sole, una tenda da sole di tela rosso acceso e titoli di giornale con caratteri serif che si stagliano nel cielo.
- Subset — Boutique editoriale realizzata in lino grezzo
- Cursor — Un accogliente laboratorio di pergamena, illuminato da braci ardenti.
- MindMarket — Un accogliente libro di fiabe su carta color crema: una tela editoriale conviviale dove grandi titoli Inter e personaggi di carta ritagliati convivono su una superficie morbida come un adesivo, baciata dal sole.
- Lamborghini — Carrozzeria nera nello showroom, sotto i riflettori - un'auto gialla
- Amplemarket — Un luogo di lavoro baciato dal sole e cosparso di coriandoli
- Getharvest — Una scrivania all'ora d'oro: una tela color crema caldo, cartoline bianche appese alla tela e un'unica fiamma arancione brillante.
- Drive Capital — Poster retrò per un viaggio in auto su carta calda