Apa yang membuat desain halaman produk bagus? Belajarlah dari yang terbaik – Beragampengetahuan

Halaman produk adalah halaman terpenting dari setiap bisnis e-commerce. Baik pelanggan Anda menghabiskan waktu berjam-jam menjelajahi halaman kategori Anda atau baru saja membuka halaman Anda dari Google, sebagian besar pengambilan keputusan terjadi di halaman produk Anda. Desain halaman produk yang bagus membantu mencapai tujuan berikut:

• Memberikan keyakinan kepada pengunjung bahwa mereka telah mendarat di halaman yang mereka cari
• Buat pengunjung bersemangat untuk membeli produk Anda
• Atasi kecemasan terkait pembelian
• Menginspirasi tindakan segera
• Membantu meningkatkan penjualan produk atau layanan terkait

Ada banyak tujuan ini untuk satu halaman, bukan? Hal ini mengharuskan kami untuk mempertimbangkan setiap elemen dan keputusan desain yang kami buat.

Dalam artikel ini, saya akan meninjau beberapa contoh halaman produk yang bagus di situs web e-niaga dan menjelaskan elemen apa yang membuatnya begitu efektif. Lalu saya akan meninjau beberapa praktik terbaik yang dapat kita ambil dari contoh-contoh ini.

Desain Halaman Produk di Zalando: Studi Kasus Pengalaman Pengguna yang Luar Biasa

Zalando adalah salah satu toko e-commerce fesyen paling sukses dan merupakan tolok ukur yang sangat baik untuk dibandingkan dengan toko pakaian mana pun. Mereka melakukan lusinan pengujian A/B setiap tahun dan mengidentifikasi desain yang cocok untuk umum.

Mari kita uraikan.

1. Visi utama yang menonjol — Saat berbelanja online, gambar adalah segalanya. Semakin tinggi kualitasnya, semakin baik. Tujuannya adalah membuat penawaran terasa realistis, bukan meminta uang hanya untuk janji suatu barang

2. Korsel gambar — Gambar lain tidak boleh disembunyikan di balik panah atau CTA lainnya. Permudah pelanggan untuk melihat gambar lain secara sekilas. Ini sangat meningkatkan kemungkinan pengunjung Anda benar-benar melihat gambar lainnya. Semakin banyak gambar yang mereka lihat, semakin mereka menyukai produk tersebut dan semakin tinggi niat mereka untuk membeli.

3. Sinyal kredibilitas — “Ini adalah salah satu item kami yang paling populer dengan pengembalian paling sedikit” memberikan dua sinyal kredibilitas yang kuat dalam satu kalimat. Menjadi produk paling populer membuat pembeli lebih yakin bahwa itu adalah pilihan yang baik. Kalau semua orang beli pasti bagus kan? Karena ini adalah barang dengan pengembalian paling sedikit, kualitasnya mungkin juga tinggi

4. Jawaban atas pertanyaan yang sering diajukan — Dengan mengkomunikasikan tanggal pengiriman secara jelas di halaman produk, Zalando mengurangi kemungkinan pengguna kembali dari halaman produk dan mencari informasi pengiriman di tempat lain. Jika wisatawan harus melakukan hal terakhir, ada kemungkinan mereka tidak akan pernah kembali lagi

5. Mengatasi kecemasan — Membeli sepatu atau pakaian lain secara online bisa membuat Anda stres; Kebijakan pengembalian 100 hari yang dikomunikasikan dengan jelas membantu mengatasi kekhawatiran ini

6. Mudah untuk menggali lebih dalam — Alih-alih memberi Anda detail, Zalando hampir tidak memberi Anda informasi apa pun tentang item tersebut, namun memudahkan Anda melihat detail yang paling penting bagi Anda di bagian terpisah

7. Barang pelengkap — “Tampilan Penuh” berfungsi sebagai mekanisme penjualan yang terintegrasi dengan baik yang membantu mendemonstrasikan tampilan produk di kehidupan nyata

8. Barang serupa — Bagi pelanggan yang hampir menemukan opsi yang tepat, tetapi ada yang salah dengan item tersebut, Zalando menunjukkan item serupa namun berbeda yang mungkin tepat sasaran

Desain Halaman Produk Amazon: Mengoptimalkan Konversi

Untuk perusahaan yang menjual hampir segala sesuatu mulai dari FMCG, pakaian jadi, hingga elektronik, menentukan desain halaman produk bisa menjadi sebuah tantangan.

Amazon harus membuat banyak kompromi untuk merancang halaman produk yang serbaguna dan dikonversi dengan baik. Namun, mereka berhasil menjawab tantangan tersebut dan membangun bisnis e-commerce bernilai miliaran dolar.

1. Visi utama yang menonjol — Baik Anda menjual headphone, sepatu, atau coklat batangan, Anda tidak akan salah dengan visual utama yang terekspos dengan baik

2. Korsel gambar — Pratinjau gambar yang mudah diklik meningkatkan kemungkinan pengunjung mengalami lubang kelinci visual

3. Dapatkan kredibilitas melalui pemeringkatan — Amazon memanfaatkan situs webnya yang memiliki lalu lintas tinggi dengan menampilkan peringkat yang diterima suatu produk. Jika seseorang memiliki rating 81000 dan rating 4,5, pasti produk tersebut populer dan cukup bagus.

4. Cari halaman ini — Produk yang berbeda memiliki detail relevan yang berbeda. Untuk memenuhi keragaman ini dengan satu halaman, Amazon telah memilih “Search CTA” yang memungkinkan pengunjung memindai halaman produk untuk mendapatkan informasi yang relevan, sehingga memudahkan untuk memeriksa apakah produk tersebut tepat untuk Anda.

5. Reputasi melalui pembelian terkini — Menunjukkan bahwa orang lain membeli produk tersebut membantu memastikan pengunjung tidak membeli produk berkualitas rendah

6. Mudah untuk berpindah model — Jika Anda mencari variasi yang berbeda, seperti warna yang berbeda, Anda dapat beralih di antara variasi tersebut dengan satu klik tanpa kembali ke halaman kategori. Di tahun 2024, hal ini wajib dimiliki oleh banyak jenis produk

7. Penghitung tanggal pengiriman — Penghitung jenis apa pun dapat meningkatkan tingkat konversi pada halaman produk, dan penghitung tanggal pengiriman adalah cara yang bagus untuk mendorong orang agar tidak menunda pembelian tanpa menimbulkan terlalu banyak kecemasan

8. Pembelian sekali klik — Kemampuan untuk membuat (dan mematenkan) pembelian barang dengan sekali klik adalah salah satu penemuan e-niaga terbesar dalam beberapa tahun terakhir. Semakin pendek perjalanan penjualan, semakin baik

9. Tabel perbandingan — Kemampuan untuk membandingkan suatu item dengan alternatif serupa sering kali penting bagi pelanggan, jadi buatlah item yang sederhana dan mudah dinavigasi. Yang terpenting, jangan paksa mereka meninggalkan halaman tersebut

10. Tambahkan ke keranjang belanja alternatif — Jika pelanggan lebih memilih untuk membeli alternatif, mereka dapat melakukannya tanpa meninggalkan halaman. Sekali lagi, semakin pendek perjalanan penjualan, semakin baik

Desainer Amazon melakukan pekerjaan luar biasa dalam menciptakan tata letak halaman produk yang sesuai untuk kategori apa pun.

Walmart: Menyeimbangkan aksesibilitas dan fungsionalitas

Walmart adalah situs e-niaga favorit saya untuk pengalaman pengguna umum. Jika Anda adalah pembeli biasa yang hanya perlu menemukan produk terbaik untuk Anda tanpa menganalisis setiap detailnya, maka Walmart adalah pilihan yang tepat untuk Anda.

1. Visi utama yang menonjol —Sekali lagi, kamu tidak mungkin salah

2. Peringkat — Hal yang sama dengan Amazon. Walmart memiliki jumlah pelanggan yang banyak dan peringkat yang banyak. Mereka memastikan untuk menyoroti angka-angka ini untuk meningkatkan keunggulan kompetitif mereka

3. Sekilas pandang — Bagian “Ikhtisar” memberikan informasi yang cukup untuk 80% pembeli. Tidak perlu mengklik tombol apa pun atau mencari detail; semua informasi penting tersedia dalam sekejap

4. Dapatkan kredibilitas melalui lencana — Lencana digital (misalnya berapa banyak orang yang memiliki item ini di keranjang mereka) dan lencana umum (misalnya “Terlaris”) dapat membantu memperkuat kredibilitas produk

5. Upsell yang terlihat tetapi tidak mengganggu — Di satu sisi, pembeli dapat menambahkan layanan atau jaminan tambahan hanya dengan satu klik, namun di sisi lain, Anda tidak mendapatkan model upsell yang mengganggu atau pesan berisik tersebut

6. Pilihan pengiriman berbeda — Tidak ada pertanyaan tentang opsi pengiriman yang tersedia atau kapan pengiriman akan dilakukan. Pembeli dapat melihat sekilas

7.Mode eksplorasi — Bagian unik dari pengalaman Walmart adalah Discovery Mode, yang memungkinkan pengguna mendapatkan lebih banyak detail dengan cara yang menyenangkan dan interaktif. Tidak ada lagi dinding teks yang membosankan dengan spesifikasi detail!

8. Pratinjau 3D — Menjadikan produk lebih nyata dan mudah diperiksa

9. Deskripsi fungsi — Pembeli dapat melihat dengan jelas bagaimana parameter utama suatu produk dibandingkan dengan produk lain dan dengan cepat memahami maknanya. Tidak ada jargon teknis sehingga rata-rata pembeli dapat dengan mudah memahami apa yang mereka dapatkan

10. Ajakan bertindak selalu tersedia — Meskipun mode Jelajahi mengambil alih halaman, pembeli masih dapat menambahkan item ke keranjang mereka hanya dengan satu klik

11. Citra pelanggan — Menyorot gambar yang disediakan oleh pengulas adalah cara yang bagus untuk meningkatkan kepercayaan [that these are not fake reviews] dan membuat produk lebih nyata

12. Ajakan Bertindak yang Melekat — Komponen utama dengan ajakan bertindak untuk membeli akan bergulir ke bawah dan tetap terlihat saat Anda menggulir halaman ke bawah. Sekali lagi, pelanggan hanya berjarak satu klik saja

Walmart membuat pembelian produk kompleks seperti televisi menjadi pengalaman yang mudah dan menyenangkan.

Desain Halaman Produk untuk Keseimbangan Baru: Identitas Merek dan Kegunaan

Halaman produk New Balance ditangani sedikit berbeda dari halaman Zalando.

1. Galeri gambar — NB Alih-alih berfokus pada satu visual utama, keseluruhan galeri dipamerkan. Meskipun item tersebut tidak terlihat terlalu seksi dan mewah, pelanggan dapat dengan cepat memindainya dari berbagai sudut dan menentukan apakah itu yang mereka inginkan.

2. Pemilihan ukuran —Pelanggan dapat mengetahui sekilas apakah ukurannya tersedia, sehingga mudah untuk memahami apakah ada produk yang sesuai dengan mereka.

3. Tip Alat yang Bermanfaat — Beberapa pelanggan mungkin tidak mengetahui arti dari perbedaan ukuran tersebut. Daripada membingungkan mereka, NB memberikan instruksi yang jelas untuk situasi ini tanpa meninggalkan halaman produk

4. Penjualan asli — Meskipun bagian “Tampilan Selesai” tidak menawarkan manfaat melihat produk pada mockup sebenarnya (seperti yang dilakukan Zalando), ini masih merupakan cara yang sangat efektif untuk meningkatkan penjualan produk tambahan tanpa merasa terlalu menjual-y

5. Verifikasi pendapat — Memvalidasi opini sangat membantu meningkatkan kredibilitas mereka

6. Klasifikasi dan pemeringkatan — Terkadang angka tidak sepenuhnya mencerminkan opini seseorang terhadap suatu produk. Dengan mengkategorikan ulasan berdasarkan kualitas, kenyamanan, dan kesesuaian, NB menjadikan ulasan jauh lebih informatif dan selanjutnya membantu membangun kepercayaan terhadap produk (dengan asumsi ulasan tersebut memiliki ulasan yang bagus)

7. Ajakan Bertindak yang Melekat — Seperti halnya Walmart, calon pelanggan dapat menambahkan item ke keranjang mereka hanya dengan satu klik

Desain halaman produk New Balance memprioritaskan menemukan produk yang tepat bagi pembeli daripada mendorong mereka untuk membeli secepat mungkin.

Pembelajaran dan keuntungan

Anda mungkin memperhatikan beberapa prinsip yang diulangi dalam analisis saya. Meskipun terdapat perbedaan yang signifikan dalam UX dan UI antara halaman-halaman yang diulas, keduanya juga agak mirip. Hal ini karena mereka mengikuti serangkaian praktik terbaik yang serupa. Ini adalah:

1. Gunakan gambar berkualitas tinggi yang menonjol — Baik Anda menggunakan galeri atau pendekatan visual utama, gambar adalah hal pertama yang akan dilihat pengunjung Anda, jadi tempatkan gambar dengan baik dan fokuslah pada kualitas
2. Memungkinkan Anda dengan mudah memperoleh informasi yang relevan — Jangan memaksa pembeli untuk menggulir untuk menemukan detail yang penting bagi mereka. Jadikan halaman dapat dipindai menggunakan pintasan, pencarian, atau kategori
3. Menjual lebih banyak produk terkait — Upselling boleh saja jika produknya berkaitan, seperti jasa pemasangan saat membeli TV atau mencocokkan baju dengan sepatu baru. Jika seseorang membeli PS5, jangan menjual keyboardnya secara berlebihan
4. Mengatasi Kecemasan dengan Sinyal Kredibilitas — Banyak orang yang terlalu memikirkan apakah mereka membuat pilihan terbaik. Bantu kurangi stres pembeli dengan menyoroti sinyal kepercayaan seperti ulasan, lencana, dan popularitas
5. Pertahankan pembeli di halaman — Kemampuan untuk beralih dan membandingkan variasi pada halaman. Selain itu, pastikan semua informasi yang relevan tersedia di halaman produk. Jika pembeli pergi, meskipun hanya untuk sementara, ada kemungkinan besar perhatian mereka akan terganggu dan tidak pernah kembali lagi
6. Pertahankan perjalanan penjualan yang singkat — Idealnya, selalu punya ajakan bertindak yang kuat

Hal-hal seperti tata letak, arsitektur informasi, bagian, dan UX/UI yang lebih luas dapat sangat bervariasi antar halaman produk. Namun selama mereka mengikuti prinsip utama desain halaman produk, mereka akan menyelesaikan pekerjaannya.