Accedere alla Funzione Hotspot

Dal menu principale, clicca su “My Art Gallery“ (1)

Clicca su “Hotspot“ (2) nel menu a sinistra.

Seleziona la galleria (3) dove desideri aggiungere un nuovo Hotspot. La vista predefinita mostrerà la prima stanza in 360°. Puoi navigare nella stanza cliccando e muovendo il mouse per scegliere un’area della Galleria in cui vuoi aggiungere l’Hotspot.

Per cambiare stanza, clicca sull’immagine di anteprima nella parte inferiore.

L’icona “List Hotspots” (4) nell’angolo in alto a destra consente di visualizzare tutti gli hotspot creati. Questo è particolarmente utile quando dovremo gestire e selezionare più hotspot.

Clicca sull’icona verde “+” (5) nell’angolo in alto a destra.

Aggiungere un Hotspot

Apparirà una finestra con più opzioni, scegli uno “Style” nel menu a tendina (1) e un “Content” (2).

Come spiegato qui sotto, “Style“ è come appare l’Hotspot nella galleria; “Content“ è l’informazione o il media collegato all’Hotspot.

Comprendere lo “Style” dell’Hotspot

Style rappresenta come un elemento, come un dipinto, apparirà nella galleria d’arte.

Qui sotto sono spiegate tutte le opzioni disponibili:

Icon: un pulsante o simbolo che può essere scelto da una libreria.

Callout Text: Ti permette di aggiungere un testo collegato che appare quando si clicca sull’icona.

Grouped: questa opzione serve per raggruppare più Hotspot in uno solo. Cliccando su di esso, si espanderà e aprirà tutti gli altri sotto di esso. Per usare questa opzione, è necessario creare alcuni hotspot prima.

Selection Area: questa opzione permette di creare un’area cliccabile nella galleria, come un’area trasparente sopra lo sfondo esistente della stanza che può essere collegata a un contenuto o azione.

Painting (or other image): questa opzione riguarda l’aggiunta di un dipinto, una foto o qualsiasi altra immagine. Questa opzione è sicuramente la più utilizzata.

Embedded Text: permette di inserire un testo all’interno della galleria, può essere una biografia, una storia o un titolo di un’opera su una parete.

Embedded HTML: serve per aggiungere un codice HTML personalizzato, come un iFrame per visualizzare una parte o un intero sito web all’interno della galleria.

Embedded Slideshow: consente di creare una sequenza di immagini che può essere navigata automaticamente o manualmente.

Embedded Video: consente di caricare un file video, collegare un .mp4 o un link di YouTube che può essere riprodotto e controllato in play, pausa, ecc., all’interno della galleria.

Embedded Video (with trasparency): permette di aggiungere un video in .mov e .webm con uno sfondo trasparente.

Embedded Video (with background removal): consente di aggiungere un video .mp4 con uno sfondo cromatico e rimuoverlo.

Embedded Link: ti permette di aggiungere un link incorporato a un sito web o un’applicazione.

Embedded Object 3D: ti permette di aggiungere un file .GLB/.GLTF per mostrare un oggetto 3D all’interno della galleria.

Comprendere il “Content” dell’Hotspot

Contenuto include gli elementi che possono essere collegati a Stile e che saranno mostrati quando un visitatore cliccherà sull’Hotspot.

Qui sotto sono spiegate tutte le opzioni disponibili:

Image (Single): per mostrare un’immagine, ad esempio una versione ingrandita della foto o del dipinto mostrato nella galleria.

Image (Gallery): ti permette di inserire una raccolta di immagini, come una galleria.

Video: ti permette di aggiungere un video .mp4, .webm o un video di YouTube.

Video 360: ti permette di aggiungere un video a 360° in .mp4 e un video in .mp4 o .webm.

Lottie: ti permette di aggiungere animazioni in formato JSON o in un link.

Audio: ti permette di aggiungere un link o un file audio .mp3, come un suono, una canzone o un audio registrato.

Link (embed): ti permette di incorporare un link interno dal sito my.art3xpo.com o https://www.art3xpo.com.

Link (external): ti permette di aggiungere qualsiasi link esterno.

Text: ti permette di inserire un testo personalizzato.

HTML: ti permette di aggiungere codice HTML, quindi, ad esempio, possiamo creare una piccola pagina che includa testo e immagine.

Download: ti permette di caricare un file che gli utenti possono scaricare.

PDF: per aggiungere un file PDF, in questo caso, una volta aggiunto il PDF, verrà aperto da un visualizzatore incorporato che mostrerà un’animazione tra le pagine, quando disponibile.

Form: ti permette di aggiungere un modulo, come un modulo di contatto, una richiesta di preventivo, un modulo di aiuto/info, ecc.

Map: ti permette di inserire una mappa da Google o Open Street Map caricando un link o il codice di incorporamento della mappa.

Object 360: ti permette di aggiungere un oggetto o immagine a 360° caricandolo dal tuo dispositivo.

Object 3D: ti permette di inserire un oggetto 3D nei formati GLB/GLTF o USDZ che può essere visto in Realtà Aumentata.

Points Clouds: per aggiungere una nuvola di punti 3D con un file zip, formato JS/JSON del file e dati della nuvola di punti.

Product: ti permette di aggiungere prodotti, come dipinti o altri articoli di e-commerce.

Switch Panorama: ti permette di cambiare il panorama visualizzato.

Personalizzare l’Hotspot

Dopo aver compreso cosa sono Stile e Contenuto, iniziamo a creare un hotspot.

Nella finestra precedente, per Style seleziona “Painting (or other image)” e seleziona “None” come Content.

Apparirà una finestra “Move”:

Regola la dimensione dell’area utilizzando i “punti al bordo” (1).

Sposta l’hotspot usando la “freccia direzionale” (2) al centro.

L’opzione “Z Order” (3) consente di impostare l’hotspot in avanti o indietro rispetto agli altri. Lascia il valore predefinito 1. Questo sarà utile nel caso in cui abbiamo più hotspot nella stessa posizione o molto vicini tra loro.

Una volta fatto, clicca su “Save” e si aprirà una finestra.

Nella prima scheda, “Settings” vediamo la nostra selezione, quindi “Painting (or other imafe)” e “Style” con “Content”.

Nella scheda Style, carica il tuo dipinto, cliccando su “Browse”: scegli un’immagine dal tuo computer (come un file .Jpeg/.jpg) e clicca su “Upload Image”. La dimensione per un’immagine nello Stile non è necessario che sia troppo grande, poiché non verrà mostrata a schermo intero.

Una dimensione da 400 pixel a 600 px è generalmente sufficiente e un peso di 100-200 Kbyte consente di mantenere la galleria leggera.

La scheda “Tooltip” consente di visualizzare un testo sopra l’Hotspot e di personalizzarlo, scegliendo la visibilità, modificando il colore e il colore dello sfondo.

Andando sulla scheda “Schedule“, quando questa scheda è disponibile, possiamo impostare date e orari per mostrare o nascondere automaticamente questo Hotspot nella galleria.

Una volta completate tutte le configurazioni, clicca su “Save“.

Azioni degli Hotspot

Se vogliamo spostare o modificare un hotspot, clicchiamo sull’hotspot che vogliamo.

Utilizzando le seguenti opzioni:

“Sposta” (1) l’hotspot.

“Modifica” (2) il suo Stile o Contenuto.

“Duplica” (3) l’hotspot nella stessa o in un’altra stanza.

“Elimina” (4) l’hotspot.

Vedere un’anteprima

Cliccando sull’icona a sinistra con l’occhio possiamo vedere l’anteprima, se clicchiamo sul dipinto non verrà eseguita alcuna azione poiché abbiamo impostato su “None”.

Collegare l’Immagine a un Contenuto

Se vogliamo mostrare un contenuto cliccando su un Hotspot, come una foto dettagliata del dipinto, un video o altre informazioni, possiamo cambiarlo nella scheda Impostazioni.

In questo caso, selezioneremo “Image (Single)” perché quando un utente ci clicca sopra, vogliamo che vedano una versione più grande dell’immagine. Clicca su “Change“.

Nella scheda “Content“, caricheremo l’immagine (in questo caso la stessa) che verrà mostrata quando un visitatore cliccherà su quell’immagine. In questo caso, la dimensione dell’immagine può essere maggiore rispetto a quella nello “Style“. Una dimensione da 600 pixel a 900 px è generalmente sufficiente e un peso di 200-300 Kbyte consente di mostrare un’immagine dettagliata e mantenere la galleria leggera.

Clicca su “Browse”. Seleziona l’immagine che vuoi caricare e poi clicca su “Upload Image”.

Possiamo anche impostare altre opzioni per questi contenuti, come mostrato di seguito:

Possiamo dare un “Title” e una “Description” all’immagine.

Su “View Mode” possiamo scegliere il comportamento dell’immagine, ad esempio, ci sono tre opzioni su “View Mode”, la prima è “Modal” dove l’immagine è visibile senza alcuna condizione, la seconda “Box (click)” ti dà la possibilità di vedere l’immagine solo se clicchi, infine la terza “Box (hover)” ti permette di visualizzare l’immagine in questione solo se ci passi sopra con il cursore del mouse.

Possiamo selezionare “Auto Open” per un’apertura automatica, possiamo anche impostare “Auto Close” per una chiusura automatica.

Possiamo selezionare diverse posizioni per la box dal menu “Box Position”, possiamo impostare anche la “Box Width” e, oltre a ciò, possiamo massimizzare la box usando il “Box Maximize Button”.

Note:

Il numero di Hotspot disponibili dipende dal piano di abbonamento.

Gli Hotspot possono essere una combinazione di qualsiasi Stile e Contenuto scelto, offrendo possibilità di personalizzazione quasi infinite.

Seguendo questa guida, possiamo configurare e gestire con successo gli Hotspot nella nostra galleria, creando un’esperienza ricca e interattiva per i nostri visitatori.

Congratulazioni, hai creato il tuo primo hotspot!