Brand identity
& design system
Partiamo dall'identità esistente di Team Aqua (tridente, blu istituzionale, Bebas Neue, pattern a foglie) e la spingiamo verso un linguaggio esportivo premium: fondo "abisso" scuro, tipografia gigante, foto scontornate dei player.
Profondità
Il mare come metafora: sfondi abisso, luce che sale dal basso, livelli che scorrono uno sopra l'altro.
Player first
I giocatori sono gli eroi: foto scontornate, numeri giganti, risultati sempre accanto al nome.
Palmarès
L'oro si usa solo per vittorie e titoli. Se c'è oro, è un trofeo vero.
Serve il logo in vettoriale (SVG/AI) dal Lead Graphic Designer: il marchio bianco qui è estratto dalla favicon PNG.
Mega · Bebas Neue
min(44vw, 64vh)H1 · Bebas Neue
3.4 → 8.5remH2 · Bebas Neue
2.8 → 6remH3 · Bebas Neue
1.8 → 2.6remLead · Inter 400
1.05 → 1.25remDa quattro amici a Livorno a Campioni del Mondo.
Body · Inter 400
1rem / 1.55Testo corrente per articoli, descrizioni giocatori e pagine istituzionali.
Label · JetBrains Mono
.72rem · +14% tracking02 — RisultatiBottoni
Tag & chip
Riga risultato · Card giocatore
- 2026Internaz.NAICVGCFrancesco Pio Pero · New Orleans1stCampione
WordPress + Elementor?
teamaqua.it oggi non è su WordPress: l'HTML ha il generator "Hostinger AI Builder" (Hostinger Website Builder, ex Zyro) e lo shop è un Shopify separato (teamaquastore.myshopify.com). Con quel builder la navigazione a menu fullscreen, la hero che resta ferma mentre il contenuto ci scorre sopra e i loop dinamici di risultati e roster non si possono fare in modo pulito. Proposta: migrare su WordPress + Elementor Pro restando su Hostinger (lo stesso piano hosting supporta WordPress) e tenere Shopify per l'e-commerce.
| Sezione | Come si fa in Elementor | Fattibilità |
|---|---|---|
| Header + icona menu | Theme Builder → Header con Flexbox Container; il bottone "Menu" apre un Popup a tutto schermo | Nativo |
| Menu fullscreen | Popup Elementor (100vw/100vh) con animazione d'ingresso + custom CSS per il clip-path circolare e l'anteprima immagine al passaggio del mouse (~20 righe JS) | Nativo + snippet |
| Hero Spirit | Container 100vh, testo gigante in un widget Heading, PNG scontornati posizionati in assoluto, contorno del testo via CSS; parallasse col mouse dai Motion Effects di Elementor Pro | Nativo + CSS |
| Hero ferma, contenuto che scorre sopra (TSM) | Hero con position: sticky (Motion Effects → Sticky, oppure 2 righe CSS) e container successivo con z-index e bordi arrotondati | CSS |
| Roster / player | Custom Post Type "Giocatori" (ACF o JetEngine) + Loop Grid / Loop Carousel; il pannello laterale con il dettaglio è un Popup dinamico oppure la pagina singola del giocatore | Pro + ACF |
| Risultati / match | CPT "Risultati" con campi (gioco, evento, piazzamento, giocatore, data) + Loop Grid con filtro per tassonomia (Filtro Tassonomia di Elementor Pro o JetSmartFilters) | Pro + ACF |
| News / Magazine | Post di WordPress + Loop Grid; gli articoli attuali vanno migrati | Nativo |
| Watch / Replay | CPT "Video" con URL YouTube + widget Video; per le live, embed Twitch/YouTube | Nativo |
| Shop | Opzione A: tenere Shopify (Buy Button JS o link ai prodotti). Opzione B: WooCommerce + Loop Carousel. Consiglio A, per non perdere ordini e gestione già avviati | Scelta |
| Join the Tide / newsletter | Widget Form di Elementor Pro → integrazione Mailchimp/Brevo (o Omnisend) | Nativo |
| Design system | Global Colors + Global Fonts + Classi CSS (Elementor v3.2x / Editor V4) → mantenibile dallo staff | Nativo |
- Logo vettorialeServeSVG del tridente e del wordmark
- Scontorni HD dei playerParzialeRitagliati in automatico dalle foto roster: vanno bene per il prototipo, per il sito servono PNG puliti dal grafico (senza alone bianco)
- Roster League of LegendsServeNomi, ruoli, foto, risultati: sul sito attuale non c'è nulla
- Video replayServeLink YouTube/Twitch reali per la sezione Watch