Questo documento descrive vari modelli e idee di progettazione per iniziare il tuo viaggio con la vista aerea. Il modo in cui presenti Aerial View ai tuoi clienti deve essere considerato attentamente per garantire un buon livello di coinvolgimento con il prodotto e che i clienti ne vedano il valore.
La vista aerea aggiunge un componente visivamente accattivante al tuo sito web, mostrando una vista dall'alto di una proprietà e dei dintorni.
Quando gli utenti visualizzano una proprietà in 3D, possono farsi un'idea migliore della sua posizione e delle dimensioni. Inoltre, è utile per mettere in evidenza le caratteristiche della proprietà, come una piscina, gli annessi o un grande cortile, oltre che elementi nelle vicinanze come strade, specchi d'acqua, montagne o parchi.
Aumento del coinvolgimento
La vista aerea non farà che sorprendere i clienti e, per vederne appieno i vantaggi, i contenuti devono essere il più semplici possibile da scoprire. In questa sezione, parleremo di alcuni modelli di progettazione dell'implementazione che consentono ad Aerial View di raggiungere questo obiettivo.
Orientamento video
È importante considerare l'orientamento dello schermo del dispositivo su cui viene caricato il video Aerial View. Mostrare un video orizzontale su un dispositivo mobile potrebbe essere un'esperienza negativa, soprattutto a schermo intero. Se mostri un video con proporzioni non corrette per il dispositivo, sprecherai una notevole quantità di spazio sullo schermo.
I video di visualizzazione aerea sono forniti con orientamento orizzontale e verticale.
Di seguito, puoi vedere un esempio della differenza nell'esecuzione di Aerial View su un dispositivo mobile, con l'orientamento consigliato e con quello sconsigliato:
Scheda popup incorporata
Quando mostri più proprietà in una vista di ricerca di proprietà, è utile aggiungere schede popup incorporate per mostrare il video Aerial View, con informazioni aggiuntive sulla struttura, come l'indirizzo e il prezzo sovrapposti. In questo modo, gli utenti possono farsi un'idea in modo facile e veloce della proprietà, senza dover fare clic sulla relativa pagina dei dettagli.
L'esempio seguente mostra un indicatore che rappresenta il complesso Googleplex a Mountain View. Quando passi il mouse sopra questo indicatore, viene visualizzata la scheda popup che mostra il video Vista aerea della proprietà.
È possibile aggiungere un evento onClick sia all'indicatore sia alla scheda popup incorporata per indirizzare l'utente alla pagina dei dettagli della proprietà. In questo modo per gli utenti è più facile scoprire di più sulla proprietà e decidere se è adatta alle loro esigenze.
Crea un'esperienza simile alla storia per la tua proprietà
Se vuoi creare un'esperienza davvero immersiva per i potenziali acquirenti, puoi mostrare la tua proprietà con un'esperienza simile a una storia che combini foto e un video di Aerial View.Questo può essere creato in modo simile a un carosello di immagini, utilizzando una combinazione di HTML, CSS e JavaScript.
Nell'esempio precedente abbiamo incluso il video di Vista aerea su una delle slide, con un link in basso per visualizzare ulteriori dettagli sulla proprietà. Questo pulsante dovrebbe indirizzare l'utente alla pagina dei dettagli della proprietà.
Ecco come funziona:
- Scegli le foto. Seleziona una serie di foto che mettano in evidenza le migliori caratteristiche della tua proprietà.
- Crea il tuo video Aerial View.
- Combina le tue foto e i tuoi video in una storia.
- Condividi la tua storia. Condividi la tua storia con potenziali acquirenti sul tuo sito web o con le tue campagne di email marketing.
Creando un'esperienza simile a una storia per la tua proprietà vetrina, potrai attirare l'attenzione dei potenziali acquirenti.
Avvio della visualizzazione aerea al caricamento della pagina
Dagli studi sull'esperienza utente di Google, è emerso che per impostazione predefinita il massimo coinvolgimento degli utenti si verifica quando viene caricata la visualizzazione 3D. Poiché si tratta di un fattore di forma nuovo ed entusiasmante, vogliamo caricarlo non appena un cliente vuole visualizzare i dettagli della proprietà. Per quanto riguarda i costi, se recuperi un video Aerial View dall'API, ti viene addebitato un costo. Dopo aver richiesto il video, valuta la possibilità di utilizzarlo in riproduzione automatica per assicurarti che gli utenti ne vedano il vantaggio.
Pattern anti-pattern: nascondere la vista aerea dietro un pulsante è considerato un anti-pattern perché costringe gli utenti a fare un ulteriore passo per visualizzare la vista 3D. Questo può essere frustrante e può anche portare gli utenti a perdere i vantaggi delle visualizzazioni 3D o a scambiare le immagini aeree come contenuti statici.
Ti consigliamo di caricare la vista aerea per impostazione predefinita quando un cliente vuole visualizzare i dettagli della proprietà. Questo fornirà un'ottima esperienza utente e li aiuterà a prendere una decisione consapevole sulla proprietà. Durante la progettazione dell'esperienza di riproduzione automatica, tieni presente che le dimensioni del video Aerial View superano i 30 MB e che il caricamento potrebbe essere lento per alcuni utenti.
Se la tua pagina include un carosello di immagini, il video Aerial View può essere incluso come elemento lead, in modo da integrare facilmente l'esperienza 3D nel design esistente del tuo sito web.
Il posizionamento dei pulsanti per caricare le viste 3D è facile da implementare, ma può ridurre il coinvolgimento. Google Maps carica le visualizzazioni 3D per impostazione predefinita. Ad esempio, quando cerchi l'Empire State Building, la visualizzazione 3D viene caricata automaticamente e puoi vedere una vista parziale delle immagini mentre sei ancora nella visualizzazione 3D. Questo è un ottimo modo per offrire agli utenti un'esperienza più immersiva e coinvolgente.
Design del pulsante
Se scegli di utilizzare un pulsante per accedere alla vista aerea, è importante considerare quanto segue:
- Posizione: il pulsante deve essere raggruppato con altri pulsanti correlati alla mappatura, in modo che gli utenti sappiano che è correlato alla posizione della proprietà.
- Transizione: la transizione al video dovrebbe essere fluida e senza interruzioni. Se sulla pagina è già presente una sezione che mostra immagini, mappe e Street View, il video Aerial View deve essere visualizzato in quella sezione.
- Evidenziazione: poiché si tratta di una nuova aggiunta alla pagina, è utile evidenziare il pulsante con un tag "nuova funzionalità" o una miniatura di un'immagine statica del video.
- Enfasi: il pulsante deve essere progettato con un'enfasi media o elevata, dato che premendo il pulsante verrà eseguita un'azione in evidenza. Google Material Design offre alcune indicazioni su come progettare pulsanti con diversi livelli di enfasi.
Ecco alcuni suggerimenti aggiuntivi per progettare un pulsante Vista aerea efficace:
- Utilizza un linguaggio chiaro e conciso. Il pulsante deve essere etichettato in modo chiaro in modo che gli utenti sappiano cosa fa.
- Utilizza un carattere grande e leggibile. Il pulsante deve essere abbastanza grande da essere visto e selezionato facilmente dagli utenti.
- Usa un colore a contrasto. Il pulsante deve avere un colore diverso da quello del testo e dello sfondo che lo circondano, in modo da risaltare.
- Usa un invito all'azione. Il pulsante deve includere un chiaro invito all'azione, come "Guarda Aerial View" o "Guarda il video".
Considerazioni sulla Rete Display
Caricamento del video in corso...
Ti consigliamo di prendere in considerazione le connessioni più lente, visualizzando un'anteprima dell'immagine statica del video e caricando l'esperienza completa su un'interazione utente, ad esempio Istio. Insieme al video Aerial View, avrai anche accesso a una miniatura che può essere utilizzata per ottenere questo risultato.
Potrai anche accedere al video a diverse risoluzioni, che possono essere utilizzate in modo strategico per ridurre al minimo il tempo che l'utente deve dedicare ad attendere il caricamento dell'esperienza, a diverse velocità di connessione.
Attribuzioni dei loghi
Quando implementi Vista aerea, devi assicurarti di seguire tutti i termini, inclusa l'attribuzione del logo. Consulta questa pagina per i dettagli.
Conclusione
Ci auguriamo che questo articolo ti abbia ispirato a pensare a come implementare Aerial View sul tuo sito web, con un elevato coinvolgimento degli utenti.
È importante pensare a come l'utente troverà i contenuti e in quale formato sarebbe più appropriato per visualizzarli. È bene inoltre considerare il tipo di dispositivo su cui verrà riprodotto il video, in particolare l'orientamento dello schermo e la velocità di connessione dell'utente.
Passaggi successivi
Ulteriore lettura suggerita:
- Migliorare la precisione dell'inserimento dell'indirizzo nella vista aerea
- Documentazione del prodotto Aerial View
Collaboratori
Google gestisce questo articolo. I seguenti collaboratori lo hanno scritto in origine.
Autore principale:
Henrik Valve | Solutions Engineer di Google Maps Platform