Portfolio
Icemania
Applicazione web completa per la gelateria artigianale Icemania. Il progetto offre un menu prodotti completo, sistema di ordinazione, pannello account utente e supporto per 3 lingue (PL, EN, DE) con animazioni professionali basate sullo scorrimento.
Vedi Demo LiveCaratteristiche Principali
Sistema Multilingue
Sistema i18n personalizzato che supporta 3 lingue (Polacco, Inglese, Tedesco) con ~300 chiavi di traduzione e persistenza in localStorage
Animazioni Avanzate
GSAP 3.14 con ScrollTrigger per animazioni basate sullo scorrimento, effetti parallax e animazioni di carte sfalsate
Menu & Ordini
Menu prodotti completo con filtraggio, dettagli prodotto, carrello e sistema di ordinazione
Pannello Utente
Autenticazione con AuthContext, pannello ordini (attivo/archivio), profilo utente e cronologia acquisti
Design Responsivo
Approccio mobile-first con MobileBottomNav dedicato, layout adattivi e sistema di design personalizzato
Ottimizzazione Prestazioni
Next.js 16 con Turbopack, React Compiler, ottimizzazione automatica immagini e code splitting
Stack Tecnologico
Sul Progetto
Icemania è un'applicazione web moderna creata per una gelateria artigianale che offre gelato naturale. L'obiettivo principale era creare una piattaforma intuitiva per sfogliare il menu, effettuare ordini online e gestire gli account utente.
L'applicazione è stata costruita utilizzando le tecnologie più recenti: Next.js 16 con App Router, React 19 e TypeScript. Utilizza un sistema multilingue personalizzato che supporta 3 lingue con piena persistenza della scelta dell'utente. Il sistema di design si basa su una palette di colori personalizzata (#5C1A1B, #B4CFB0, #F9F5E7) e Tailwind CSS.
Un elemento chiave dell'UX sono le animazioni GSAP avanzate con ScrollTrigger, che creano transizioni fluide e professionali ed effetti parallax. L'applicazione offre funzionalità e-commerce complete: navigazione menu, filtraggio prodotti, aggiunta al carrello, gestione ordini e pannello utente con cronologia acquisti.
Il progetto si distingue per l'architettura basata su React Context API (LanguageContext, AuthContext), custom hooks per logica riutilizzabile e pattern Server/Client Components. Il deployment su Vercel con ottimizzazione automatica delle immagini e code splitting garantisce caricamento fulmineo ed eccellenti prestazioni.