Halaman “jejak pesanan saya”, tempat pelanggan memasukkan nombor telefon dan melihat status pesanan tanpa mencipta akaun, ialah halaman kecil tetapi banyak dikunjungi di kebanyakan laman e-dagang Bangladesh, di mana checkout sebagai tetamu ialah kebiasaan. Di kedai ini, paparan hasil jelas dibina dan diuji hanya untuk telefon: sempit, teks sahaja, tiada gambar produk dan sebahagian besarnya kosong pada skrin desktop.
Apa yang kurang pada susun atur asal
Halaman itu berfungsi (pelanggan memang boleh melihat status pesanan), tetapi persembahannya kurang memuaskan. Tanpa gambar kecil produk, pelanggan yang meneliti pesanan berbilang item perlu membaca nama item dengan teliti untuk mengesahkan apa yang diterima; butiran bil dan penghantaran bercampur sebagai teks biasa tanpa pemisahan visual; dan pada monitor desktop, lajur selebar telefon di tengah halaman lebar kelihatan belum siap.
Reka bentuk semula
Pembetulan sengaja dihadkan, bukan pembinaan semula penuh:
- Gambar kecil produk pada setiap item, ditambah melalui penapis
woocommerce_order_item_namedan dihadkan kepada halaman ini sahaja supaya tidak menjejaskan paparan item di tempat lain dalam WooCommerce. - Bil dan penghantaran digayakan semula sebagai kad yang kemas, dengan pemisahan visual yang jelas daripada jadual item pesanan, bukan bercampur sebagai satu blok teks.
- Bekas yang lebih lebar di desktop, supaya halaman benar-benar menggunakan ruang yang ada, bukan lajur selebar telefon yang terapung di tengah ruang kosong.
- Susun atur disusun semula di telefon, dengan alamat pelanggan di atas jadual pesanan, supaya perkara pertama yang disahkan ialah “adakah ini dihantar ke tempat yang betul”, sebelum menatal untuk melihat isi pesanan.
Pengajaran utama
- Halaman yang dibina dan hanya diuji pada satu saiz skrin akan merosot secara senyap pada saiz lain; berbaloi menyemak kedua-dua hujung dengan sengaja.
- Menghadkan penapis templat dengan ketat (kepada satu halaman, satu konteks) mengelakkan kesan sampingan pada paparan lain platform.
- Susunan susun atur di telefon patut mengikut apa yang pembaca perlu sahkan dahulu, bukan sekadar versi kecil susunan desktop.
Bacaan berkaitan: keterlihatan lajur mudah alih tersuai, kerja reka bentuk UI dan UX kami.
Menghadapi had yang serupa dalam panel WooCommerce atau WordPress anda sendiri? Mari berbincang: ArtinTech Solution membina alat kedai tersuai seperti ini.