Panduan Desain Semuanya untuk Toko Shopify

Diterbitkan: 2021-08-25

Font, warna, aksi! Untuk yang cenderung artistik, mendesain toko Shopify Anda bisa menjadi tantangan yang mengasyikkan. Tetapi bagi pemasar dan pengusaha yang merasa sedikit kaku ketika ditugaskan untuk memilih antara font serif dan non-serif, proses ini bisa terasa sangat menakutkan.

Meskipun Shopify memiliki banyak sumber daya yang memudahkan untuk memulai — kita berbicara tentang template tema yang sudah dibuat sebelumnya, desainer ahli untuk disewa, dan pasar yang penuh dengan aplikasi dan widget — kelumpuhan keputusan adalah penderitaan yang sangat nyata. Contoh kasus: Semua orang menginginkan toko Shopify yang menarik secara visual, menarik perhatian, dan dioptimalkan untuk konversi — tetapi mencapainya lebih mudah diucapkan daripada dilakukan.

Dengan langit yang hampir menjadi batas dalam hal opsi desain untuk toko Shopify Anda, dari mana Anda memulai? Letakkan contoh warna — inilah panduan desain utama untuk Shopify yang selalu Anda butuhkan tetapi tidak tahu keberadaannya, dengan semua tip dan trik yang Anda butuhkan untuk menyesuaikan, meluncurkan, dan mulai menjual.

Dalam artikel ini:
Tema Shopify
Foto Produk
Kustomisasi Tema
Struktur Menu
Tajuk Beranda
3 Tips Bawa Pulang
Butuh bantuan?

Tema Shopify

Langkah pertama untuk membangun toko Shopify Anda melibatkan pemilihan tema yang sesuai. Anggap saja sebagai tulang punggung situs Anda yang menentukan pengalaman pengguna, estetika visual, dan fungsionalitas toko Anda.

Toko Tema Shopify menawarkan ratusan tema siap pakai yang telah diperiksa oleh perusahaan.

Toko Tema Shopify, yang menawarkan ratusan opsi, memudahkan Anda menemukan pasangan yang sempurna. Plus, kebanyakan dari mereka menyediakan beberapa variasi gaya, yang berarti Anda dapat menyesuaikannya agar sesuai dengan tampilan dan nuansa merek Anda dalam hal warna, font, dan aplikasi.

Merasa kewalahan? Gunakan filter Shopify untuk mempersempit pilihan Anda dengan:

  • Ukuran katalog produk Anda. Jika Anda memiliki banyak produk, Anda mungkin memerlukan fitur seperti pengguliran tak terbatas atau tata letak kotak.
  • Industrimu. Perusahaan mode mungkin memerlukan tema yang memungkinkan pembeli memilih dari berbagai ukuran dan warna, sementara merek seni dan fotografi mungkin memerlukan slot gambar produk yang lebih besar.
  • Harga. Meskipun Shopify menawarkan berbagai tema gratis, yang lebih kompleks dapat berharga hingga $ 180.

Meskipun Anda dapat menyesuaikan tipografi dan skema warna nanti, proses penyesuaian lebih mudah jika Anda memilih tema yang sesuai dengan visi Anda untuk situs dalam hal estetika dan tata letak secara keseluruhan.

Foto Produk

Meskipun kami adalah penggemar berat pasar tema Shopify yang kuat, ada satu risiko: memiliki toko yang terlihat seperti milik orang lain, bahkan ketika Anda mempertimbangkan penyesuaian. Satu solusi cepat? Foto produk yang unik.

Untuk membedakan merek Anda dari pesaing Anda, penting untuk mengambil foto produk yang merangkum identitas dan sikap perusahaan Anda. Fotografi memainkan peran besar dalam mengatur gaya dan nada merek Anda.

Jangan takut untuk bersenang-senang dan sedikit lebih berani dengan foto produk Anda:

  • Padukan foto produk Anda dengan beberapa foto gaya hidup , di mana produk Anda diambil di lokasi dengan alat peraga dan model pendukung.
  • Percobaan dengan tata letak yang berbeda . Misalnya, daripada selalu memotret pakaian dengan menempatkannya pada latar belakang putih, pertimbangkan untuk melakukan model flat-lay atau menyewa model.
  • Pangkas dan foto dari sudut yang menarik daripada langsung. Ini adalah cara yang bagus untuk menambahkan gaya dan bakat pada bidikan Anda.

Untuk tips lebih lanjut tentang mengambil gambar produk dan gaya hidup yang luar biasa, lihat panduan DIY ini.

Kustomisasi Tema

Sekarang setelah Anda memilih tema dan memiliki seluruh rol kamera foto produk untuk dipilih, inilah bagian yang menyenangkan: mengubah situs menjadi sesuatu yang unik bagi Anda.

Berkat kenyamanan yang ditawarkan Shopify, kustomisasi tidak memerlukan pengkodean apa pun dari Anda. Sebagai gantinya, cukup klik Pengaturan Tema, dan Anda akan menemukan sejumlah cara untuk menyesuaikan gaya visual toko Anda.

warna

Di menu Warna, Anda dapat beralih warna untuk banyak elemen di toko Anda, termasuk teks, tombol, dan bidang formulir.

Kiat pro: Untuk membuat ajakan bertindak (CTA) Anda menonjol, pertimbangkan untuk membuatnya menjadi warna yang lebih berani dan cerah yang kontras dengan bagian halaman Anda lainnya.

Tipografi

Bagian ini mengontrol tampilan visual semua teks di seluruh toko Anda. Anda dapat menyesuaikan jenis font, bobot, dan skala untuk judul versus teks isi.

favicon

Favicons adalah ikon kecil — biasanya logo atau gambar sederhana yang terkait dengan perusahaan — yang muncul di tab browser Anda.

  • Memiliki gambar yang sesuai? Setelah diunggah, Shopify akan secara otomatis mengubah ukurannya menjadi 32 x 32 piksel.
  • Tidak punya? Shopify memiliki banyak gambar gratis yang dapat Anda gunakan.

Elemen pembayaran

Proses checkout Anda adalah bagian terpenting dari situs e-niaga Anda. Tanpa pengalaman checkout yang fantastis, Anda berisiko pembeli meninggalkan gerobak mereka di tengah pembelian.

Untuk membuat checkout Anda semulus mungkin, Anda dapat menyesuaikan:

  • Warna untuk aksen, tombol, dan kesalahan
  • Tipografi khusus pembayaran
  • Pola latar belakang, warna, atau gambar untuk halaman ringkasan checkout dan pesanan

Struktur Menu

Sementara sebagian besar tema pra-dibuat Shopify akan hadir dengan elemen-elemen kunci ini, Anda harus mengingat tip-tip ini sebelum meluncurkan toko Anda:

Bilah Navigasi

Bilah navigasi berada di bagian atas setiap halaman, memungkinkan pembeli berpindah antar halaman dengan cepat.

Bilah navigasi Harry menggunakan menu tarik-turun untuk menampilkan subkategori, serta menyoroti produk unggulan.

Kiat pro: Permudah pembeli menemukan apa yang mereka butuhkan tanpa membebani mereka. Untuk menjaga bilah navigasi utama relatif bersih dan sederhana, Anda dapat menambahkan kategori dan subkategori sebagai opsi tarik-turun yang disembunyikan kecuali diarahkan ke atas.

bilah pengumuman

Penjualan waktu terbatas? Keterlambatan pengiriman? Jam buka toko baru? Saat Anda perlu mempromosikan informasi penting yang perlu diketahui semua pembeli, bilah pengumuman (juga dikenal sebagai tajuk global) adalah jawaban Anda.

Atau, dalam kasus Glossier, bilah pengumuman dapat digunakan untuk mempromosikan email pemasaran Anda.

Sebagian besar tema Shopify dilengkapi dengan bilah pengumuman — Anda hanya perlu menyesuaikannya dan mengaktifkannya melalui editor tema Shopify.

Kiat pro: Pastikan bilah pengumuman Anda bergaya dengan cara yang sama seperti situs Anda (pikirkan warna merek, font, dan CTA).

catatan kaki

Footer adalah salah satu area yang paling diremehkan di situs Anda. Meskipun benar bahwa hanya sedikit pembeli yang akan menggulir sepanjang beranda Anda dan mencapai footer, ini adalah salah satu tempat pertama yang akan mereka lihat ketika mereka membutuhkan akses cepat ke informasi.

Untuk mengedit footer Anda, Anda harus pergi ke halaman Navigasi di bawah Toko Online.

Kiat profesional:

  • Footer Anda seharusnya tidak hanya menjadi pengulangan dari informasi yang sama di bilah navigasi Anda. Sebagai gantinya, tambahkan tautan penting ke halaman tentang pengiriman, pengembalian dan penukaran, privasi situs, peluang kerja, dan banyak lagi.
  • Gunakan ikon media sosial sebagai tombol — itu akan mengurangi kata-kata di footer Anda.
  • Izinkan pembeli mendaftar untuk pembaruan email atau SMS.
  • Berikan tautan cepat layanan pelanggan, seperti hotline, "mulai obrolan langsung", atau bantuan email.

Tajuk Beranda

Header beranda Anda adalah hal pertama yang dilihat pembeli saat mereka membuka situs web Anda. Buat kesan pertama yang luar biasa, dan mereka akan mencari lebih banyak lagi. Gagal menarik mereka, dan mereka akan menutup tab. Dengan itu, tajuk beranda Anda harus:

  • Berikan gambaran singkat tentang apa merek Anda atau produk apa yang Anda jual
  • Promosikan acara penjualan
  • Tunjukkan sikap dan identitas merek Anda
  • Pamerkan produk unggulan Anda

Purple Mattress (saat ini) menampilkan obral musim panas waktu terbatas di header berandanya.

Baik header beranda Anda berupa video, carousel, atau gambar statis, Anda harus mengubahnya secara teratur — Anda tidak ingin situs web Anda terasa basi atau ketinggalan zaman bagi pelanggan setia.

3 Tips Bawa Pulang

Mendesain toko Shopify Anda bisa sangat menyenangkan, tetapi juga bisa menjadi tidak terkendali setelah Anda mulai bereksperimen dengan font, warna, dan widget pada kanvas kosong. Untuk menjaga agar proses desain Shopify dapat dikelola dan sebebas mungkin, berikut adalah beberapa tip yang perlu diingat:

1. Fungsi di atas bentuk, selalu

Anda dapat memiliki situs yang indah, tetapi jika tidak mengalir secara intuitif dan menawarkan perjalanan pelanggan yang fantastis, Anda akan melihat penjualan stagnan. Kami merekomendasikan:

  • Berfokus pada apa yang ingin Anda capai dengan situs Anda sebelum Anda memulai proses desain. Ini akan membantu mempersempit alat atau widget yang Anda butuhkan dan mencegah kelumpuhan pilihan yang kemungkinan akan terjadi saat pertama kali Anda mengunjungi Shopify App Store.
  • Menerapkan fitur yang berguna, seperti rekomendasi dan filter yang kuat untuk memungkinkan pembeli mempersempit pencarian produk mereka dengan cepat.
  • Memprioritaskan kecepatan situs. Meskipun tergoda untuk menambahkan banyak animasi keren, aplikasi keren, dan gambar beresolusi tinggi, semakin banyak elemen yang Anda sertakan, semakin lama waktu pemuatan situs Anda. Studi telah menemukan bahwa setiap detik ekstra yang dibutuhkan halaman Anda untuk memuat dapat mengurangi konversi sebanyak 7% dan tampilan halaman sebesar 11%. Di sisi lain, situs yang lebih cepat mendapat imbalan dengan peringkat yang lebih tinggi di Google.
  • Mengompresi gambar. Alat gratis seperti compressor.io dapat membantu Anda menjaga gambar produk berkualitas tinggi tetap tajam sambil mengurangi ukuran file.
  • Memilih tema di Toko Tema Shopify daripada tema dari situs web pihak ketiga. Karena tema pihak ketiga tidak melalui proses penilaian Shopify, beberapa dapat memiliki tambahan tak terduga di back-end yang dapat menyeret waktu pemuatan Anda ke atas.

Ingat: Meluncurkan toko Shopify Anda bukanlah proses yang selesai. Setelah Anda meluncurkan situs Anda dan mulai melihat penjualan mengalir, Anda ingin terus mengoptimalkan setiap halaman, mulai dari mengubah gambar header, menulis ulang salinan SEO, atau memperbarui gambar. Percayai kami: Meskipun membosankan, ini akan membantu meningkatkan konversi, menarik pembeli baru, dan meningkatkan pengalaman pelanggan.

Kiat pro: Tidak yakin bagaimana kinerja situs Anda dalam hal kecepatan situs? Lihat alat Google PageSpeed ​​Insights — cukup masukkan URL Anda, dan itu akan memberi Anda wawasan dan rekomendasi tentang peningkatan kecepatan situs.

2. Buat situs Anda tetap sederhana

Sangat menggoda untuk menampilkan semua produk, gambar, dan salinan di gudang senjata Anda, tetapi sebagian besar waktu, itu hanya akan menyumbat pengalaman pelanggan. Anda tidak ingin membebani situs Anda dengan terlalu banyak informasi — tidak ada yang ingin menyaring produk dalam versi digital dari toko barang bekas yang berantakan. Sebaliknya, tetap sederhana, fokus pada buku terlaris Anda, dan potong lemak sedapat mungkin (apakah itu gambar, salinan, widget, halaman, atau bahkan produk itu sendiri).

3. Uji semuanya

Bagaimana jika kami memberi tahu Anda bahwa Anda dapat meningkatkan konversi hanya dengan mengubah satu tombol itu dari biru menjadi merah? Meskipun Anda telah meluncurkan situs Anda dengan warna, gambar, dan grafik tertentu, tidak ada cara untuk mengetahui bahwa mereka berfungsi dengan baik. (Kami ingin memberi Anda formula kemenangan, tetapi kenyataannya adalah: Praktik terbaik bergantung pada pelanggan, produk, dan ceruk merek yang unik.)

Di sinilah pengujian A/B masuk — sebuah proses yang sangat penting untuk menentukan apa yang berkinerja terbaik. (Untuk pemasar baru, berikut adalah panduan untuk semua hal pengujian A/B.) Daripada beroperasi dari naluri murni saja, Anda sebaiknya menguji A/B elemen desain toko ini:

  • Warna tombol yang berbeda
  • Lokasi CTA, widget, dan gambar
  • Bilah navigasi
  • Desain ikon media sosial
  • Gaya gambar — misalnya, gambar produk vs. gaya hidup
  • Gambar atau tekstur latar belakang

Butuh bantuan?

Sementara antarmuka Shopify memudahkan pemasar dan pengusaha untuk membuat desain toko mereka sendiri, itu bisa menjadi proses yang memakan waktu jika Anda seorang perfeksionis dengan gagasan yang jelas tentang bagaimana Anda ingin toko Anda terlihat.

Hal yang baik tidak apa-apa untuk meminta bantuan! Shopify menawarkan banyak sumber daya dan ratusan pakar yang dapat Anda percayai untuk mengurus toko Anda. Terkadang, lebih baik memanfaatkan keahlian seorang desainer pro daripada mengarungi gulma sendirian.

Bagi kami, AdRoll mendukung Anda dalam hal menyediakan pemasaran terbaik untuk toko Shopify Anda. Jika Anda siap untuk meningkatkan penjualan Anda, lihat integrasi AdRoll untuk Shopify.