Dokumen ini menjelaskan berbagai pola dan ide desain untuk membantu Anda memulai perjalanan Tampilan Udara. Cara menyajikan Tampilan Udara kepada pelanggan harus dipertimbangkan dengan cermat untuk memastikan Anda melihat tingkat engagement yang baik dengan produk, dan pelanggan melihat nilainya.
Tampilan Udara menambahkan komponen yang menarik secara visual ke situs Anda, dengan menunjukkan tampilan mata burung untuk properti dan lingkungan sekitarnya.
Saat pengguna melihat properti dalam 3D, mereka bisa mendapatkan gambaran yang lebih baik tentang lokasi dan ukurannya. Hal ini juga membantu menyoroti fitur properti, seperti kolam renang, bangunan luar, atau halaman yang luas, selain fitur di sekitarnya seperti jalan, perairan , gunung, atau taman.
Meningkatkan Interaksi
Tampilan Udara akan menjadi faktor yang menakjubkan bagi pelanggan Anda, dan untuk melihat manfaat lengkap, konten harus semudah mungkin ditemukan. Di bagian ini, kita akan membahas beberapa pola desain implementasi untuk Tampilan Udara guna mencapai hal ini.
Orientasi video
Penting untuk mempertimbangkan orientasi layar perangkat tempat video Tampilan Udara dimuat. Menampilkan video berorientasi lanskap di perangkat seluler bisa menjadi pengalaman yang buruk, terutama dalam layar penuh. Dengan menampilkan video menggunakan rasio aspek yang salah untuk perangkat, Anda akan menyia-nyiakan banyak ruang layar.
Video Tampilan Udara disediakan dalam orientasi lanskap dan potret.
Di bawah ini, contoh perbedaannya dapat dilihat saat menjalankan Aerial View di perangkat seluler, pada orientasi yang direkomendasikan, dan orientasi yang tidak direkomendasikan:
Kartu informasi tersemat
Saat menampilkan beberapa properti pada tampilan penelusuran properti, sebaiknya tambahkan kartu informasi tersemat untuk menampilkan video Tampilan Udara, dengan informasi tambahan tentang properti tersebut, seperti alamat dan harga yang ditempatkan di atasnya. Dengan demikian, pengguna dapat memahami properti dengan cepat dan mudah, tanpa harus mengklik halaman detail properti.
Contoh di bawah menunjukkan penanda yang mewakili kompleks Googleplex di Mountain View. Saat Anda mengarahkan kursor ke penanda ini, kartu informasi akan muncul, yang menampilkan video Tampilan Udara properti tersebut.
Peristiwa onClick dapat ditambahkan ke penanda dan kartu informasi tersemat untuk mengarahkan pengguna ke halaman detail properti. Hal ini memudahkan pengguna untuk mempelajari properti tersebut lebih lanjut dan memutuskan apakah properti tersebut tepat untuk mereka.
Menciptakan Pengalaman Seperti Cerita untuk Properti Anda
Jika ingin menciptakan pengalaman yang benar-benar imersif bagi calon pembeli, Anda dapat menampilkan properti Anda dengan pengalaman seperti cerita yang menggabungkan foto dan video Tampilan Udara.Hal ini dapat dibuat dengan cara yang mirip dengan carousel gambar, menggunakan campuran HTML, CSS, dan JavaScript.
Pada contoh di atas, kami menyertakan video Tampilan Udara di salah satu slide, dengan link di bagian bawah untuk melihat detail selengkapnya tentang properti. Tombol ini akan mengarahkan pengguna ke halaman detail properti.
Berikut caranya:
- Pilih foto Anda. Pilih berbagai foto yang menyoroti fitur terbaik properti Anda.
- Buat video Tampilan Udara.
- Gabungkan foto dan video Anda menjadi cerita.
- Bagikan cerita Anda. Bagikan kisah Anda dengan calon pembeli di situs atau kampanye pemasaran melalui email.
Dengan membuat pengalaman seperti cerita untuk properti etalase, Anda akan dapat menarik perhatian calon pembeli.
Memulai Tampilan Udara saat halaman dimuat
Dalam studi UX Google, kami melihat bahwa engagement pengguna tertinggi terjadi saat tampilan 3D dimuat secara default. Karena ini adalah faktor bentuk yang baru dan menarik, kami ingin memuatnya segera setelah pelanggan ingin melihat detail properti. Saat memikirkan biaya, jika mengambil video Tampilan Udara dari API, Anda akan dikenai biaya. Setelah video diminta, pertimbangkan untuk diputar otomatis agar pengguna melihat manfaatnya.
Pola anti: Menyembunyikan Tampilan Udara di belakang tombol dianggap sebagai anti-pola karena memaksa pengguna mengambil langkah tambahan untuk melihat tampilan 3D. Hal ini dapat membuat frustrasi, dan juga dapat menyebabkan mereka kehilangan manfaat tampilan 3D atau salah menganggap Tampilan Udara sebagai konten statis.
Sebaiknya Anda memuat Tampilan Udara secara default saat pelanggan ingin melihat detail properti. Hal ini akan memberikan pengalaman pengguna yang baik, dan membantu mereka membuat keputusan yang tepat terkait properti tersebut. Saat mendesain pengalaman putar otomatis, perlu diingat bahwa ukuran video Tampilan Udara berukuran lebih dari 30 MB, dan dapat lambat dimuat untuk beberapa pengguna.
Jika Anda memiliki carousel gambar sebagai bagian dari halaman, video Tampilan Udara dapat disertakan sebagai item prospek, sehingga Anda dapat dengan mudah mengintegrasikan pengalaman 3D ke dalam desain situs yang ada.
Menempatkan tombol untuk memuat tampilan 3D mudah diterapkan, tetapi dapat mengurangi interaksi. Google Maps memuat tampilan 3D secara default. Misalnya, saat Anda menelusuri Empire State Building, tampilan 3D dimuat secara otomatis, dan Anda dapat melihat sebagian tampilan gambar saat masih berada dalam tampilan 3D. Ini adalah cara yang bagus untuk memberikan pengalaman yang lebih imersif dan menarik kepada pengguna.
Desain tombol
Jika memilih untuk menggunakan tombol guna mengakses Tampilan Udara, penting untuk mempertimbangkan hal berikut:
- Lokasi: Tombol harus dikelompokkan dengan tombol lain yang terkait dengan pemetaan sehingga pengguna tahu bahwa tombol tersebut terkait dengan lokasi properti.
- Transisi: Transisi ke video akan berjalan lancar dan lancar. Jika sudah ada bagian di halaman yang menampilkan gambar, peta, dan Street View, maka video Tampilan Udara harus ditampilkan di bagian yang sama.
- Penandaan: Karena fitur ini akan menjadi tambahan baru pada halaman, sebaiknya tandai tombol dengan tag "fitur baru" atau thumbnail gambar diam video.
- Penekanan: Tombol harus didesain dengan penekanan sedang atau tinggi, karena menekannya akan melakukan tindakan yang jelas. Desain Material Google memiliki beberapa panduan cara mendesain tombol dengan berbagai tingkat penekanan.
Berikut adalah beberapa tips tambahan untuk mendesain tombol Tampilan Udara yang efektif:
- Gunakan bahasa yang jelas dan ringkas. Tombol tersebut harus diberi label yang jelas sehingga pengguna tahu fungsinya.
- Gunakan font yang besar dan dapat dibaca. Tombol harus cukup besar agar mudah dilihat dan diklik oleh pengguna.
- Gunakan warna yang kontras. Warna tombol harus berbeda dari teks dan latar belakang di sekitarnya agar terlihat menonjol.
- Gunakan pesan ajakan (CTA). Tombol harus menyertakan pesan ajakan (CTA) yang jelas, seperti "Tampilan Udara Tonton" atau "Tonton Video".
Pertimbangan Display
Memuat Video
Anda mungkin perlu mempertimbangkan koneksi yang lebih lambat, dengan menampilkan pratinjau gambar video, dan memuat pengalaman penuh pada interaksi pengguna, seperti onClick. Selain video Tampilan Udara, Anda juga akan memiliki akses ke thumbnail yang dapat digunakan untuk melakukan hal ini.
Anda juga akan memiliki akses ke video dengan resolusi yang berbeda-beda, sehingga resolusi ini dapat digunakan secara strategis untuk meminimalkan waktu yang dihabiskan pengguna untuk menunggu pengalaman dimuat, pada kecepatan koneksi yang berbeda.
Atribusi logo
Saat menerapkan Tampilan Udara, Anda harus memastikan bahwa Anda mengikuti semua persyaratan, termasuk atribusi logo. Lihat halaman ini untuk mengetahui detailnya.
Kesimpulan
Kami harap artikel ini dapat memberi inspirasi untuk memikirkan cara menerapkan Tampilan Udara di situs Anda, dengan engagement pengguna yang tinggi.
Penting untuk memikirkan cara pengguna menemukan konten, dan dalam format yang paling sesuai untuk menampilkannya. Sebaiknya pertimbangkan jenis perangkat tempat video akan diputar, terutama orientasi layar, dan kecepatan koneksi pengguna.
Langkah Berikutnya
Disarankan bacaan lebih lanjut:
Kontributor
Google mengelola artikel ini. Awalnya, kontributor berikut ini ditulis.
Penulis utama:
Henrik Valve | Engineer Solusi Google Maps Platform