Hippocrates Wellness

Progettare un’esperienza wellness più immersiva. Dove si incontrano storytelling, AI generativa e codice custom.

Hippocrates Wellness, fondato nel 1956 a West Palm Beach, Florida, accoglie ospiti da tutto il mondo in un campus di 55 acri. Abbiamo riprogettato e ampliato la sua esperienza digitale, e costruito la landing del suo programma principale come una sequenza cinematografica che si muove con lo scroll.

Settore
Wellness, salute e hospitality
Luogo
West Palm Beach, Florida, USA
Anno
2026
Servizi
DesignSviluppoDirezione creativaUX/UI DesignEsperienza web immersivaProduzione video AI (Google Veo)Interazione scroll-basedWordPress & ElementorArchitettura CMS
1sequenza video guidata dallo scroll, generata con Google Veo e sincronizzata con codice custom
8journey pubblicate da un unico template dinamico condiviso
3mesi dal brief al lancio approvato, da giugno ad agosto 2026
La sfida

Rendere la complessità naturale.

Hippocrates propone programmi residenziali, journey specialistiche, esperienze sul campus, formazione e iniziative per la community, rivolti a pubblici molto diversi. La prima sfida era rendere questo ecosistema più facile da capire e da navigare.

La seconda era il Life Transformation Program, il programma principale del centro. Una pagina informativa tradizionale non bastava a raccontare cosa si vive nel programma. Volevamo una pagina che coinvolgesse dal primo istante, usando movimento, immagini e interazione come strumenti narrativi, senza perdere chiarezza.

Approccio

Tre obiettivi, un’unica esperienza.

Informazioni chiare, racconto emozionale e complessità tecnica dovevano convivere nelle stesse pagine.

  1. 01Semplificare le informazioniUna struttura che permette a ogni utente di trovare il programma, il soggiorno o il confronto che cerca.
  2. 02Creare una narrazione immersivaMovimento e immagini che raccontano il programma prima del testo.
  3. 03Costruire un sistema flessibileTemplate e contenuti strutturati che il team può continuare ad ampliare.
Esperienza in evidenza

Un’esperienza che si svela con lo scroll. The Life Transformation Program.

Per il programma principale del centro abbiamo progettato una landing costruita intorno a una sequenza cinematografica controllata dallo scroll. L’acqua è la metafora: cambiamento, profondità, trasformazione.

La sequenza parte dalla superficie e porta progressivamente lo spettatore sott’acqua. Immagini generate con l’AI, video e JavaScript custom trasformano un normale scroll nel modo in cui la storia viene raccontata.

hippocrateswellness.org/the-life-transformation-program
Registrazione dello schermo della landing pubblicataImmagini generate con Google Veo. Direzione, design e codice di .beeasy
Concept creativo · Drop into Water

Una metafora visiva della trasformazione.

Una scena calma, una goccia che incontra l’acqua, onde concentriche che si allargano, poi un cambio di prospettiva sotto la superficie. Il video non è uno sfondo: il suo movimento fa parte del modo in cui la pagina parla.

  1. 01Superficie immobileUno specchio d’acqua scuro tra le foglie. Cade una goccia.
  2. 02ImpattoLa goccia incontra l’acqua: il primo movimento della storia.
  3. 03Le onde si allarganoOnde concentriche aprono lo spazio al titolo.
  4. 04Il titolo affioraIl nome del programma emerge con le onde.
  5. 05La promessa“One foundation. Many ways to begin again.”
  6. 06Sotto la superficieIl punto di vista scende sott’acqua, e il programma comincia.
Produzione video AI · Google Veo

Immagini generate dall’AI. Narrazione diretta da persone.

Abbiamo usato Google Veo per generare le immagini, dentro una direzione creativa definita per il progetto. L’obiettivo non era solo un video bello, ma una sequenza il cui movimento potesse essere guidato dallo scroll.

  1. 01Direzione creativa.beeasyLa metafora, la sequenza narrativa e il tipo di movimento che serviva.
  2. 02Creazione video assistita dall’AIGoogle VeoVideo generato con Google Veo, seguendo quella direzione.
  3. 03Adattamento interattivo.beeasyIl materiale preparato per vivere dentro un’esperienza web controllata dallo scroll.
  4. L’AI ha contribuito alle immagini. Direzione creativa, progettazione dell’esperienza e implementazione sono di .beeasy.
Sviluppo custom

Quando lo scroll diventa parte della storia. L’avanzamento della pagina guida quello del video.

Abbiamo sviluppato una soluzione custom che lega il video allo scroll. La sequenza non si riproduce con una sua timeline: avanza mentre l’utente scorre la pagina, e lo scroll detta il ritmo della storia.

01Posizione dello scroll02Avanzamento dell’interazione03Timeline del video04Stato visivo
Demo scroll · 0%
Demo costruita con frame reali della landing: scorri questa sezione o tocca un punto. Le percentuali spiegano il principio, non sono i valori del progetto.
  1. 01Input dello scrollIl movimento dell’utente è l’input.
  2. 02Progressione dello scrollL’avanzamento della pagina determina lo stato dell’esperienza.
  3. 03Sincronizzazione del videoLa posizione del video segue quello stato.
  4. 04Continuità visivaL’immagine resta continua durante l’esplorazione.
  5. 05Transizione ai contenutiLa sequenza lascia spazio ai contenuti della landing.
La landing completa

Un’esperienza completa, non solo un effetto visivo.

Dopo l’apertura, la landing spiega il programma residenziale di 21 giorni, le journey, i principi Hippocrates, le sistemazioni, i protocolli e gli esperti, e accompagna verso una consulenza.

  1. 01The FoundationIl programma residenziale di 21 giorni.
  2. 02Choose Your JourneyIl programma principale e le journey costruite su di esso.
  3. 03Five FoundationsRight Food, Right Mind, Right Practice, Right People, Right Place.
  4. 04Guided JourneyPoche domande per capire esigenze e come procedere.
  5. 05AccommodationsGarden, Sanctuary ed Eden.
  6. 06ProtocolsProtocolli per costruire il proprio programma.
  7. 07ExpertsIl team che guida il programma.
  8. 08Storie degli ospitiLa vita dopo il soggiorno, con le parole degli ospiti.
  9. 09Primo passo“Your journey begins with a single step.”
Cosa abbiamo fatto

Un progetto, passo dopo passo

Design

Il resto del sito

Un ecosistema digitale. Tanti modi per esplorarlo.

1.1HomepageIl campus di notte, una promessa chiara e due ingressi: soggiornare o guardare il film. La consulenza gratuita è sempre a un tap.
1.2L’approccio, in parole sempliciChi è Hippocrates, dove si trova e come funziona il programma, in tre principi brevi: release burden, restore flow, renew resilience.
1.3Eventi e tourTalk, movimento e serate di community nel campus, quasi tutte aperte ai visitatori, con il tour del campus a un clic.
1.4Alumni, sempre benvenutiUno spazio per chi è già stato ospite: un nuovo soggiorno, un evento, un tour con qualcuno, formazione continua.
1.5Rendere naturale il passo successivoScoprire, esplorare, scegliere, connettersi. Non tutti sanno quale programma fa per loro, quindi il sito offre sempre un confronto: la barra della consulenza, “Talk to our team” e un form guidato, Plan Your Journey, che chiede esigenze, tempistiche, numero di ospiti e contatti.
Sviluppo

Sviluppo

Dal design a un’esperienza pronta per la produzione.

2.1Componenti assistiti dall’AI, modificabili dal teamL’AI ha supportato anche la produzione di componenti per WordPress ed Elementor, dentro un processo controllato da noi. L’obiettivo: lavorazioni custom che il team interno può continuare a modificare ogni giorno.
2.2Responsive e controlli pre-lancioAdattamento responsive di ogni template, CSS e JavaScript custom dove serviva, e una revisione completa dello staging prima della pubblicazione.
Funzionalità chiaveArchitettura CMSSistema di template

Una base flessibile dietro l’esperienza. Contenuti dinamici con WordPress, Elementor e ACF.

Ogni journey aveva i suoi contenuti, ma la stessa logica. Abbiamo impostato le Journey come Custom Post Type con Advanced Custom Fields, collegate a template dinamici Elementor.

Le sezioni compaiono solo quando c’è un contenuto, quindi un nuovo programma non richiede una pagina costruita a mano. La landing cinematografica è su misura; il resto del sito funziona con componenti che il team modifica.

  1. 01WordPressModello dei contenutiLe journey vivono in un tipo di contenuto dedicato.Custom Post Type
  2. 02ACFCampi customCampi dedicati contengono ciò che serve a ogni journey.FormatoDurataEsperti
  3. 03ElementorTemplate condivisoUn layout dinamico legge i campi.Tag dinamiciComponenti
  4. 04hippocrateswellness.orgLa paginaLe sezioni compaiono solo se hanno contenuto.Sezioni condizionaliResponsive
AUna base, otto journey
Prima il programma principale, poi le journey costruite su di esso. Ogni card legge la stessa struttura.
BGli stessi campi, per ogni programma
Formato, incluso in, durata: una struttura che ogni programma compila con i propri dati.
Timeline

Tre mesi, dal brief al lancio

  1. Giu 2026Brief, architettura e direzione creativaRedesign e ampliamento del sito WordPress esistente: homepage, programmi, journey, @Home, corporate, alumni, ambassador, eventi.
  2. Lug 2026Design e sviluppoTemplate, componenti custom e lavoro responsive con il team del cliente, e il concept Drop into Water.
  3. Ago 2026CMS e template dinamiciJourney con Custom Post Type e ACF con sezioni condizionali. Template di archivio blog e articolo aggiunti su richiesta.
  4. 25 ago 2026Approvato per il lancioStaging approvato, poi il passaggio pianificato in produzione con backup completo: pagine, template Elementor, menu, Journey e configurazioni ACF.
Risultati

Oltre il web design. Verso le esperienze digitali.

  1. 01Una landing immersiva per il Life Transformation Program, con immagini generate con Google Veo e guidate dallo scroll.
  2. 02Un’esperienza web riprogettata, dalla homepage alle pagine della community.
  3. 03Otto journey gestite con un unico template dinamico, con sezioni condizionali.
  4. 04Componenti Elementor riutilizzabili che il team interno può modificare.
Guardalo dal vivohippocrateswellness.orgvisita il sito
Prossimo progettoProject Wellness EquipmentUn catalogo di attrezzature professionali, e un percorso preventivi costruito sul loro modo di vendere.leggi il case study
Inizia un progetto

Raccontaci dove vuoi arrivare.

Ti aiutiamo a trovare l'approccio giusto. Si parte da una domanda.

Di cosa hai bisogno? Scegline quante vuoi, o nessuna.
{{ p.name }}{{ p.name }}

{{ p.hA }} {{ p.hB }}

{{ p.lede }}

{{ U.industry }}
{{ p.industry }}
{{ U.location }}
{{ p.location }}
{{ U.year }}
{{ p.year }}
{{ U.client }}
{{ p.url }}
{{ U.services }}
{{ t.name }}{{ x.s }}
[IMAGE] {{ hero.cap }}
[IMAGE] {{ hero.cap }}[IMAGE] Mobile
{{ f.n }}{{ f.l }}
{{ U.chalEb }}

{{ p.chalH }}

{{ c.t }}
{{ U.apprEb }}

{{ appr.h }}

{{ appr.p }}

  1. {{ pr.n }}{{ pr.t }}{{ pr.p }}
{{ U.cinEb }}

{{ cin.h }} {{ cin.sub }}

{{ cp.t }}

{{ cin.url }}
{{ cin.recCap }}{{ cin.recNote }}
{{ cin.sbEb }}

{{ cin.sbH }}

{{ cin.sbP }}

  1. {{ fr.n }}{{ fr.t }}{{ fr.p }}
{{ cin.veoEb }}

{{ cin.veoH }}

{{ cin.veoP }}

  1. {{ vs.n }}{{ vs.t }}{{ vs.who }}{{ vs.p }}
  2. {{ cin.veoNote }}
{{ cin.syEb }}

{{ cin.syH }} {{ cin.sySub }}

{{ cin.syP }}

{{ ch.n }}{{ ch.t }}
{{ U.scrubLive }} · {{ cin.pctTxt }}
{{ cin.syNote }}
  1. {{ cc.n }}{{ cc.t }}{{ cc.p }}
{{ cin.lnEb }}

{{ cin.lnH }}

{{ cin.lnP }}

  1. {{ ls.n }}{{ ls.t }}{{ ls.p }}
{{ U.baEb }}

{{ ba.h }}

{{ ba.p }}

{{ U.before }}{{ ba.beforeWhen }}
{{ bi.cap }}
{{ U.after }}{{ ba.afterWhen }}
{{ ai.cap }}
{{ U.didEb }}

{{ U.didH }}

{{ c.terrName }}

{{ c.title }}

{{ c.intro }}

{{ st.num }}{{ st.t }}{{ st.p }}
[IMAGE] {{ st.a.cap }}[IMAGE] {{ st.a.cap }}[IMAGE] {{ st.b.cap }}[IMAGE] {{ st.a.cap }}[IMAGE] {{ st.b.cap }}[IMAGE] {{ st.c.cap }}[IMAGE] {{ st.a.cap }}[IMAGE] {{ st.b.cap }}{{ c.n }}{{ c.h }}Aa{{ p.typeName }}ABCDEFGHIJKLM abcdefghijklm 0123456789
{{ U.featEb }}{{ tg.t }}

{{ ft.h }} {{ ft.sub }}

{{ fp.t }}

  1. {{ fl.n }}{{ fl.site }}{{ fl.t }}{{ fl.p }}{{ fd.f }}
{{ sh.k }}{{ sh.label }}
{{ sh.note }}
{{ U.tlEb }}

{{ tlH }}

  1. {{ ph.when }}{{ ph.t }}{{ ph.p }}
    2.
{{ U.resEb }}

{{ resH }}

  1. {{ r.num }}{{ r.r }}
    2.
{{ U.quoteEb }}
{{ quote.text }}
[C]{{ quote.who }}{{ quote.role }}
{{ U.liveEb }}{{ p.url }}{{ U.visit }}
{{ U.ongEb }}

{{ ong.h }}

{{ ong.p }}

{{ og.terr }}{{ og.status }}{{ og.t }}{{ og.p }}
{{ U.nextEb }}{{ next.name }}{{ next.hA }} {{ next.hB }}{{ U.readCase }} [IMAGE] {{ next.cap }}
{{ U.moreEb }}{{ U.allWork }}
{{ tx.eb_start }}

{{ tx.start_h }}

{{ tx.start_lede }}

{{ tx.need_q }} {{ tx.need_hint }}
{{ cta }} {{ tx.or_write }} hello@beeasydesign.com