Bagaimana Pengembangan Kustom Shopify Tingkat Lanjut Menciptakan Pengalaman Pengguna yang Lebih Baik
Diterbitkan: 2020-11-14Bagi Paravel, penjual koper, tas, dan aksesori perjalanan lainnya yang berkualitas tinggi, inovatif, dan diproduksi secara bertanggung jawab, fungsionalitas khusus adalah suatu keharusan. Produk yang mereka hasilkan dan jual adalah satu-satunya, jadi bagi mereka, menawarkan pengalaman berbelanja yang unik kepada pelanggan mereka diperlukan.
Paravel membutuhkan banyak fungsi eCommerce dasar untuk memungkinkan menjalankan operasi praktis melalui toko online-nya. Awalnya, mereka dibangun di atas platform sumber terbuka yang disebut Spree, yang memiliki banyak pengikut dan pendukung karena fakta bahwa itu adalah platform sumber terbuka.
Spree, seperti platform open-source lainnya seperti Magento, sangat dapat disesuaikan. Itu juga dapat diintegrasikan dengan sejumlah besar plugin dan aplikasi pihak ketiga, sangat skalabel, dan menunjukkan tingkat intuisi UI yang membuat pengembangan antarmuka ramah seluler menjadi lebih mudah.
Meskipun ini hanyalah gambaran singkat dari berbagai fitur fungsional Spree, beberapa di antaranya memiliki biaya tinggi yang sama dengan platform open-source lainnya. Mereka mungkin hampir tidak terbatas fungsinya, tetapi mereka membutuhkan banyak waktu pengembangan dan bahkan lebih banyak pengalaman untuk diselesaikan. Tanpa pengalaman pengkodean yang luas atau latar belakang dalam pengembangan, platform seperti Spree dapat dengan cepat menghabiskan sumber daya.
Paravel membutuhkan pengalaman berbelanja yang unik, tetapi mereka juga membutuhkan solusi out-of-the-box yang menawarkan banyak hal kepada pedagang eCommerce mereka. Masalah bagi mereka adalah bagaimana mereka bisa mendapatkan toko eCommerce mereka yang sudah dirancang dan dikembangkan dengan cermat dari Spree ke platform yang lebih mumpuni?
Proses Migrasi yang Menyeluruh
Setelah berkomunikasi dengan tim penjualan kami, Paravel memutuskan bahwa pindah ke Shopify Plus adalah jawabannya – dengan beberapa ketentuan. Antara lain, Paravel tidak ingin mengalami efek negatif dari migrasi dan mereka ingin toko baru mereka menawarkan semua fungsi toko Spree mereka dan kemudian beberapa. Untuk melakukannya, Paravel membutuhkan lebih dari sekadar mitra Shopify Plus – mereka membutuhkan ahli Shopify Plus.
Sementara Spree menawarkan opsi penyesuaian yang hampir tak terbatas, Shopify Plus, sebagai platform SaaS eCommerce yang dihosting, dapat menawarkan lebih banyak lagi. Dengan bantuan tim pengembangan seperti 1Digital , Shopify Plus dapat menawarkan kepada mereka semua penyesuaian yang ditawarkan Spree dan banyak lagi. Shopify Plus juga menawarkan fitur keamanan yang ditingkatkan, waktu aktif yang terjamin, kecepatan situs yang cepat, kompatibilitas serupa dengan aplikasi dan plugin pihak ketiga, penerimaan sejumlah opsi pembayaran, skalabilitas yang luar biasa, dan banyak lagi. Paravel, pada titik ini, ditugaskan untuk memindahkan toko Spree mereka yang ada, beserta desain dan fungsinya, ke Shopify Plus.
Bagi sebagian orang, proses migrasi situs web mengerikan, tetapi kami tahu sebaliknya. Dengan ratusan migrasi yang berhasil di kaca spion dan tim pengembang untuk mendukung upaya kami, kami tahu itu dapat dilakukan tanpa masalah apa pun. Itu hanya akan membutuhkan proses yang menyeluruh.
Prosesnya intensif, tetapi tidak ada 1Digital Agency yang tidak dapat dijalankan dengan warna-warna cerah. Proyek ini memerlukan migrasi 32 bidang produk (termasuk nama, deskripsi, gambar, harga, dan lainnya) serta masing-masing lebih dari 4.000 akun pelanggan dan pesanan. Untuk melakukan ini, kami menyiapkan server Linux sementara dan menulis skrip khusus untuk menggambar dan mengkategorikan informasi ini dari inventaris Spree di situs aslinya.
Untuk memindahkannya, kami membuat skrip khusus lain untuk terhubung ke Shopify API sebelum mengimpor semua bidang yang relevan dengan benar. Selama proses dan sesudahnya, data diperiksa untuk memastikan bahwa itu mendarat dengan benar di toko baru, sehingga tidak hanya tidak ada yang hilang, tetapi semua akan terisi di tempat yang seharusnya.
Proses menyeluruh kami mencegah hilangnya data, tetapi bagaimana dengan hilangnya lalu lintas? Jika ada satu hal yang mematikan klien eCommerce dari prospek replatforming (bahkan jika itu akan datang dengan manfaat besar), itu adalah ketakutan kehilangan lalu lintas atau otoritas domain.
Untungnya, proses migrasi kami mencegah kerusakan pada SEO secermat ini mencegah kehilangan data. Dengan Paravel, seperti yang telah kami lakukan dengan setiap proyek migrasi, kami mengumpulkan semua URL yang terkait dengan situs web mereka dan kemudian menyiapkan 301 pengalihan ke URL terkait di situs Shopify baru. Tidak mengherankan, Paravel tidak mengalami kerugian lalu lintas atau fluktuasi peringkat setelah migrasi selesai.
Dukungan – Berjaga-jaga
Migrasi ke Shopify berjalan tanpa hambatan, dan Paravel sedang dalam perjalanan ke toko Shopify Plus baru dengan fungsionalitas yang ditingkatkan dan pengalaman pengguna yang lebih baik, tetapi untuk amannya, kami menyertakan periode dukungan 30 hari gratis dengan proyek migrasi . Agen migrasi Shopify mana pun dengan proses yang terbukti harus melakukannya; itu hanya bagian tak terpisahkan dari strategi migrasi yang sukses.
Panjang periode dukungan gratis bervariasi sesuai dengan ruang lingkup proyek, tetapi dalam kasus migrasi Paravel, kami mengalokasikan 30 hari. Ini memberi mereka waktu sebulan penuh untuk menyelidiki situs web baru mereka dan mengatasi bug migrasi yang mungkin muncul – yang akan kami perbaiki, gratis.
Bahkan setelah itu, kami mengizinkan mereka untuk tetap menjadi punggawa, tanpa meminta setoran dari mereka; cukup menagih untuk setiap perubahan yang akan mereka log setelah periode dukungan situs web gratis berakhir. Hal-hal kecil seperti ini sangat membantu dalam memastikan layanan pelanggan yang baik, dan kami bertujuan untuk memastikan bahwa migrasi berjalan dengan lancar, bahkan ketika semuanya diperiksa, diperiksa ulang, dan diperiksa lagi.
Situs Web yang Baru Dikembangkan
Tapi itu belum berakhir dengan migrasi. Paravel memiliki kriteria untuk perpindahan yang terkait dengan pengalaman pelanggan yang akan ditawarkan situs baru, dan untuk memastikannya, kami harus mengembangkan situs web Shopify Plus baru untuk mereka.
Sebagai bagian dari proyek mereka, pengembang 1Digital Agency membuat beranda baru untuk mereka yang lebih terintegrasi dengan merek dan membantu memposisikan produk mereka di tempat yang lebih diinginkan. Ini menampilkan produk terbaru dan citra latar belakang yang lebih selaras dengan minat dan persepsi pasar sasaran mereka. Pertimbangkan kesan ramping dan canggih dari beranda baru, di bawah, dengan tetap dari beranda lama di bawahnya.
Bagi pengunjung beranda mereka, tata letak baru langsung mencolok tidak hanya karena estetika gambarnya yang superior, tetapi juga untuk upaya yang paling terpadu yang dilakukan untuk menempatkan nilai produk Paravel di depan dan di tengah. Anda juga akan melihat bahwa ada menu di bagian atas tata letak beranda baru yang kurang dari desain sebelumnya; cara mengakses produk mereka sebelumnya adalah dengan menggulir halaman ke bawah hingga ada tombol berlabel “shop the collection”. Halaman baru menampilkan fitur navigasi situs yang jauh lebih baik, seperti yang Anda lihat di atas.
Menggulir ke bawah beranda, pengunjung dapat melihat ulasan melalui spanduk geser, mempelajari lebih lanjut tentang kategori produk populer, dan bahkan melihat bagaimana pelanggan menggunakan produk melalui media sosial, seperti yang Anda lihat di beberapa tangkapan layar di bawah ini.
Selain beranda, 1Digital membuat templat halaman kategori baru bersama dengan halaman "Kisah Kami" untuk Paravel, di atas beberapa halaman sistem lainnya. Di antara halaman yang dikembangkan adalah halaman keranjang dan checkout, halaman login, halaman sertifikat hadiah, dan halaman “Terima Kasih”. Terakhir, kami menyesuaikan sejumlah halaman konten termasuk halaman "FAQ" dan "Persyaratan".
Pentingnya desain situs web responsif berkualitas tinggi sangat penting untuk eCommerce saat ini, dan pengembang 1Digital berhati-hati untuk menyiapkan situs web responsif yang diperbarui untuk Paravel sebagai bagian dari proyek. Untuk kepentingan pengalaman pengguna Paravel, desain responsif baru oleh 1Digital secara otomatis menyesuaikan dengan layar yang lebih kecil, mengubah ukuran dan memformat ulang teks yang sesuai.
Pengembangan Lanjutan – Fungsionalitas Halaman Kategori
Ketika pengembang 1Digital mentransfer semua informasi yang terkait dengan kategori produk Paravel, kami juga menambahkan beberapa fungsi baru untuk mereka sampaikan kepada pelanggan mereka sehingga meningkatkan pengalaman pelanggan.
Kami memasang Editor Metafield ke dalam templat halaman kategori mereka sehingga Paravel dapat membuat perubahan cepat pada beberapa lencana yang muncul di tampilan halaman kategori mereka. Ini memungkinkan mereka untuk mengedit bidang khusus sehingga promosi yang terkait dengan produk “baru”, “terlaris”, atau “unggulan” dapat ditampilkan dengan lebih jelas.
Fitur yang tampaknya sederhana ini memberikan banyak kekuatan kembali ke admin Paravel untuk membuat perubahan cepat dan mudah pada tampilan situs web mereka tanpa bekerja dengan pengembang. Seorang pria dapat diberi ikan atau diajari seni, dan kami memberikan instruksi terperinci kepada Paravel tentang cara menggunakan dan mengelola aplikasi sehingga mereka dapat dengan mudah membuat perubahan bahkan setelah proyek ditutup.
Demikian pula, pengembang 1Digital membuat Swatch Produk dan fungsionalitas Tampilan Cepat di halaman koleksi Paravel. Kami membuat skrip khusus untuk halaman koleksi Shopify Plus mereka yang dapat mengambil dan menampilkan informasi yang diinginkan.
Skrip untuk swatch ini juga memastikan bahwa ketika pelanggan mengklik swatch yang terkait dengan warna yang diinginkan, gambar produk akan ditampilkan dalam warna tersebut. Selain itu, ini akan menampilkan harga yang berlaku terkait dengan perubahan serta opsi apa pun untuk "personalisasi", atau, jika perlu, pesan "stok habis".
Pengembangan Lanjutan – Fungsi Halaman Produk
Paravel sangat menekankan pada pengalaman pelanggan, dan karena itu, mereka membutuhkan banyak fungsi tambahan dari template halaman produk mereka, termasuk kemampuan tambahan untuk membantu mempersonalisasi pengalaman berbelanja.
Oleh karena itu, sebagai bagian dari aspek pengembangan lanjutan proyek, 1Digital membantu menciptakan serangkaian fitur baru dan lebih baik untuk mempersonalisasi pengalaman berbelanja di situs web mereka, khususnya di halaman produk mereka.
Kami mengonfigurasi templat halaman produk mereka sehingga ditampilkan mirip dengan toko Spree lama mereka. Kami kemudian membuat batang “tambahkan ke troli” yang akan tetap berada di bagian bawah tampilan halaman produk. Itu bagian yang mudah.
Kami juga mengembangkan alat untuk templat halaman produk mereka yang memungkinkan pembeli mempersonalisasi pengalaman pembelanja mereka dan membuatnya lebih realistis. Selain menawarkan pelanggan mereka kemampuan untuk melihat seperti apa tas (atau produk lain) yang diberikan akan terlihat seperti menggunakan fungsi carikan yang dijelaskan di atas, Paravel juga memberi pelanggan kemampuan untuk mempersonalisasi produk mereka.
Paravel tertarik pada fitur peningkat konversi dari alat realistis yang memungkinkan pelanggannya untuk benar-benar melihat seperti apa produk mereka setelah dipersonalisasi, jadi kami membuat alat yang memungkinkan mereka melakukannya.
Alat yang kami buat untuk Paravel menampilkan sembulan dengan kata-kata "Personalisasi" ketika pelanggan mengunjungi halaman produk Kami kemudian membuat alat yang memungkinkan pelanggan untuk mempersonalisasi produk sesuai dengan gaya dan warna huruf yang akan muncul sebagai monogram dengan inisialnya.
Alat ini ditampilkan sebagai widget pada halaman produk setelah pelanggan mengklik "Personalisasi" dan sangat mudah untuk memanipulasi dan menyesuaikan sesuai dengan preferensi mereka. Untuk memastikan bahwa produk akan menampilkan personalisasi dengan benar, kami harus membuat skrip khusus yang akan secara akurat menampilkan huruf-huruf yang dimasukkan pelanggan, dengan gaya yang mereka pilih, di area yang tepat dari produk, seperti yang dapat dilihat pada gambar di bawah. Sebagai tingkat fungsionalitas terakhir, kami membuat "Templat Nylon" yang memungkinkan pelanggan Paravel menyesuaikan produk mereka dengan huruf bordir alih-alih huruf yang dilukis dengan tangan atau Applique.
Ada beberapa penyesuaian lagi yang kami buat untuk halaman produk Paravel, termasuk penerapan empat tab dari halaman produk di toko Spree lama mereka melalui pengkodean HTML. Kami juga menciptakan kembali fungsionalitas "Pilih Petualangan Anda Sendiri" dari toko Paravel's Spree, yang memungkinkan pelanggan untuk lebih mempersonalisasi produk Paravel dengan Applique dan desain yang dilukis dengan tangan, di atas beberapa penyesuaian lain untuk menjaga integritas fungsi asli yang muncul di toko Spree mereka.
Integrasi dengan Aplikasi Kritis
Untuk mengamankan fungsionalitas toko Shopify Plus baru mereka dan memastikan pengalaman pengguna yang lancar dan menyenangkan, 1Digital Agency harus mengintegrasikan toko baru Paravel dengan aplikasi penting bisnisnya.
Antara lain, pelanggan Paravel mengandalkan ulasan dan testimonial yang Paravel dapat gambar dan tampilkan melalui YotPo, yang kami pastikan terintegrasi dengan mulus untuk mereka. Paravel juga sangat bergantung pada penggunaan Zaius untuk keterlibatan pelanggan dan CRM, jadi kami melakukan integrasi itu seperti yang disebutkan di atas.
Selain itu, Paravel memanfaatkan fungsionalitas yang diberikan tidak hanya oleh RJ Metrics tetapi juga oleh Talkable. Aplikasi ini memberikan data berharga kepada admin Paravel dan memungkinkan program pemasaran rujukan yang aman.
1Digital Agency mengintegrasikan semua aplikasi ini dengan toko baru Paravel selain coding dan mengembangkan situs web Shopify Plus baru mereka. Kami menyelesaikan proyek ini, dalam cakupan yang komprehensif, yang memerlukan migrasi dan pengembangan kustom lanjutan, tanpa hang-up. Artinya, klien tidak mengalami gangguan yang tidak semestinya dalam bisnis, tidak ada kehilangan lalu lintas, dan pindah ke toko yang baru dikembangkan dengan fungsionalitas kustom tingkat lanjut tanpa hambatan. Untuk melakukan itu diperlukan pengalaman dan proses menyeluruh, yang keduanya terintegrasi dengan 1Digital ke dalam alur kerja kami.
Solusi Lengkap
Beberapa penyedia menyetel layanan mereka ke satu atau dua layanan yang sangat terspesialisasi, tetapi kami tahu bahwa masalah yang dihadapi pedagang eCommerce beragam. Jika kami hanya dapat menawarkan layanan pengembangan, kami tidak akan dapat memigrasikan Paravel dari Spree ke Shopify Plus, yang merupakan salah satu platform eCommerce terkemuka untuk pedagang online. Demikian pula, jika kami membatasi diri untuk melakukan migrasi, kami tidak akan dapat menyesuaikan toko baru mereka seperti yang mereka inginkan.
Layanan desain dan pengembangan Shopify Plus, bahkan ketika dipasangkan dengan layanan migrasi kami, hanyalah gambaran kecil dari apa yang ditawarkan 1Digital Agency. Selain layanan desain khusus Shopify kami, kami juga menawarkan kampanye pemasaran digital komprehensif termasuk kampanye SEO dan PPC yang sangat kompetitif, diteliti secara menyeluruh, dan bertarget.
Kisah sukses ini bergantung pada fakta bahwa kami dapat memigrasikan Paravel dari Spree ke toko Shopify Plus yang baru dikembangkan dengan fungsionalitas tingkat lanjut. Banyak studi kasus eCommerce kami yang lain berfokus pada platform eCommerce lain seperti desain dan pengembangan BigCommerce, layanan Magento serupa, dan kampanye pemasaran digital. Lihatlah repertoar kami, dan jika Anda ingin melihat bagaimana kami dapat memecahkan masalah yang dihadapi bisnis online Anda, hubungi kami di 888-982-8269.
Unduh PDF