UI/UX Portofolio: Revamp Message Feature on Lazada App

iqbal pratama
8 min readJan 26, 2024

Halo, namaku tama, kali ini saya akan memberikan portofolio UI/UX case study untuk memenuhi assignment dari sebuah program boot camp yang saya jalani. Kali ini saya akan menunjukkan proses UI/UX case study saya terkait pembaharuan fitur pesan/chat yang berada di dalam aplikasi lazada. Case study ini saya angkat menarik karena aplikasi lazada masih banyak yang dapat dikembangkan dari sisi UI maupun UX nya.

Latar Belakang

Dalam menanggapi dinamika pasar yang terus berubah dan kebutuhan pelanggan yang semakin kompleks, kami mengidentifikasi bahwa fitur pesan (message) di Lazada memiliki peran yang krusial dalam mendukung komunikasi antara pelanggan dan penjual. Berdasarkan penelitian mendalam dan umpan balik pengguna, kami menyadari bahwa penyempurnaan yang serius diperlukan untuk meningkatkan efektivitas dan kenyamanan pengguna dalam berinteraksi melalui platform lazada

Kendati fitur pesan sudah menjadi bagian integral dari pengalaman berbelanja online, kami memahami bahwa masing-masing interaksi melalui pesan memiliki dampak besar terhadap kepuasan pelanggan. Oleh karena itu, dengan berlandaskan pada prinsip-prinsip desain UI/UX yang terbaik, kami menyusun strategi untuk melakukan perubahan revolusioner pada fitur pesan Lazada dengan tujuan utama untuk meningkatkan navigasi, responsivitas, dan kemudahan penggunaan.

Latar Belakang “revamp fitur message aplikasi lazada”

Tujuan

Dengan Case Study UI/UX ini, saya memiliki tujuan konkret dalam merancang ulang fitur pesan Lazada. Pertama, untuk meningkatkan kejelasan dan keterbacaan dalam setiap pesan, sehingga pengguna dapat dengan mudah memahami isi pesan tanpa kesulitan. Kedua, untuk memastikan navigasi yang intuitif dan efisien, memungkinkan pengguna menemukan dan mengelola pesan mereka dengan cepat dan mudah. Ketiga, untuk meningkatkan responsivitas fitur pesan, sehingga setiap interaksi terasa lancar dan tanpa hambatan.

Inovasi ini dipandu oleh prinsip-prinsip desain yang bersifat inklusif dan mengakomodasi berbagai kebutuhan pengguna. Dengan menyematkan elemen-elemen desain yang bersifat user-friendly, kami berharap dapat memberikan pengalaman berbelanja online yang lebih menyenangkan, efisien, dan bermakna bagi setiap pengguna Lazada.”

Perubahan pada fitur pesan Lazada bukan hanya sekadar peningkatan fungsionalitas, tetapi juga merupakan bentuk komitmen kami untuk terus menghadirkan solusi inovatif yang memenuhi dan bahkan melampaui harapan pelanggan. Kami berharap bahwa revamp fitur pesan ini tidak hanya meningkatkan kualitas layanan Lazada, tetapi juga memberikan dampak positif bagi ekosistem e-commerce secara keseluruhan.

Proses Design

Dalam usaha saya untuk meningkatkan pengalaman pengguna di platform Lazada, perubahan signifikan pada fitur pesan menjadi sebuah tantangan yang saya hadapi dengan pendekatan desain yang inovatif. Proses desain didasarkan pada prinsip-prinsip Design Thinking, yang memastikan bahwa setiap langkah yang diambil sepenuhnya mengakomodasi kebutuhan dan harapan pengguna. Di bawah ini adalah ringkasan dari tahap-tahap desain yang saya lalui dalam merevamp fitur pesan Lazada.

Berikut merupakan tahap — tahap design thinking yang saya lakukan dalam revamp fitur pesan/chat pada aplikasi lazada:

  1. Empati (Empathize): Tahap pertama saya adalah mendalami pengalaman pengguna saat berinteraksi dengan fitur pesan Lazada. saya melakukan wawancara mendalam, observasi, dan analisis data pengguna untuk memahami dengan mendalam kebutuhan, tantangan, dan harapan mereka terhadap fitur pesan.

Dalam menampung respon user saya menggunakan layanan google form yang terdiri dari pertanyaan — pertanyaan mengenai fitur pesan pada aplikasi lazada, seperti berikut:

  1. Apakah kamu mengenal aplikasi lazada ?
  2. Apakah kamu sering berbelanja di aplikasi lazada ?
  3. Bagaimana menurutmu fitur aplikas Pesan/chat dalam aplikasi lazada ?
  4. Apakah fitur tersebut dapat membantumu dalam proses belanja di aplikasi lazada ?
  5. Apa keluhan/ketidaknyamanan kamu menggunakan fitur chat yang ada di aplikasi tersebut ?
  6. Apa yang kamu harapkan dengan fitur pesan/chat pada aplikasi lazada ?

Dari hasil wawancara tersebut dapat disimpulkan beberapa masalah yang dialami oleh beberapa responden. Dalam hal ini saya membuat beberapa notes untuk menyimpulkan pain points yang ada di dalam fitur chat pada aplikasi lazada.

a. Pain Points

Paint points menyimpulkan beberapa hasil responden terkait penggunaan fitur pesan yang ada di aplikasi lazada untuk mencari maslaah/frustasi/dan stress level.

berikut merupakan pain points yang saya telah saya kategorikan.

Pain points

2. Define

Langkah selanjutnya adalah mendefinisikan masalah. Hal ini melibatkan penyusunan pernyataan masalah, penetapan tujuan, dan identifikasi ruang lingkup proyek. Selama fase ini, saya akan melakukan wawancara pengguna, survei, dan uji kegunaan untuk mengumpulkan wawasan dan masukan. Analisis juga data dan perilaku pengguna untuk mengidentifikasi pola dan titik permasalahan.

a. User Persona

Tujuan pembuatan persona pengguna adalah untuk lebih memahami pengguna suatu produk atau layanan. Saya juga menggunakan ini untuk menginformasikan keputusan desain saya, mempertimbangkan bagaimana persona akan menggunakan produk atau layanan, fitur dan fungsionalitas pengguna, dan bagaimana mereka akan berinteraksi dengan antarmuka.

b.Customer Journey Map

Saya menggunkana Customer Journey map untuk mengethaui bagaimana behavior user dalam menggunakan aplikasi lazada.

c. How Might We

Saya menggunakan pertanyaan How Might We (HMW) untuk mengeksplorasi kemungkinan atau solusi potensial terhadap masalah atau tantangan desain dan menemukan solusi terbaik bagi pengguna.

3. Ideate

Pada tahap ini, saya membuat prototipe dengan ketelitian rendah untuk menguji ide dan memvalidasi asumsi. Perbaikan ini juga melibatkan brainstorming, pembuatan sketsa, dan pembuatan prototipe kasar. Sebelum merancang prototipe, saya juga membuat ide solusi, diagram afinitas, ide prioritas, arsitektur informasi, alur pengguna, dan crazy 8's.

a. Ide Solusi

Ide solusi melibatkan pemahaman kebutuhan dan preferensi pengguna target, menciptakan desain yang mengatasi masalah mereka dan memberikan pengalaman pengguna yang lancar. Ini adalah solusi yang saya buat untuk pengguna.

A solution idea involves understanding the needs and preferences of the target users, creating designs that address their pain points and provide a seamless user experience. These are solutions I have made for users.

b. Diagram Afinitas

Diagram afinitas adalah alat yang digunakan dalam pemikiran desain dan UX untuk mengatur dan mengkategorikan ide, informasi, atau data. Hal ini memungkinkan saya untuk melihat gambaran besarnya dan mengidentifikasi peluang atau titik kesulitan apa pun dalam perjalanan pengguna.

UX
Feature
UI

c. Ide Prioritas

Ide Prioritas merupakan aspek penting karena membantu menciptakan antarmuka yang mudah digunakan, intuitif, dan efektif. Untuk memprioritaskan elemen desain pada langkah ini, saya menggunakan matriks prioritas sederhana (Dampak Tinggi/Rendah, Upaya Tinggi/Rendah).

d. User Flow

User Flow mengacu pada jalur yang diambil pengguna untuk mencapai tujuan tertentu atau menyelesaikan tugas dalam produk digital atau situs web. Hal ini melibatkan pemetaan langkah-langkah yang akan diambil pengguna dari awal hingga akhir, dan mengidentifikasi potensi hambatan atau hambatan yang mungkin menghambat kemajuan mereka.

User Flow yang saya buat untuk pengguna, mulai dari membuat akun hingga memeriksa item yang telah mereka pilih.

e. Crazy 8

Crazy 8 adalah latihan desain yang digunakan dalam bidang desain UI UX untuk menghasilkan ide desain yang kreatif dan inovatif dengan cepat. Latihan ini biasanya memakan waktu sekitar 5–8 menit dan melibatkan pembuatan sketsa 8 ide desain berbeda untuk masalah atau fitur tertentu.

Saya menggunakan angka 8 yang gila untuk semua kemungkinan desain yang berbeda. Sangat membantu untuk mengeksplorasi pendekatan berbeda dalam merancang antarmuka pengguna suatu aplikasi atau situs web.

Wireframe

Wireframe adalah representasi visual dasar dari antarmuka situs web, aplikasi, atau perangkat lunak. Saya menggunakan Desain Mid-Fidelity untuk gambar rangka karena biasanya melibatkan representasi tata letak, struktur, dan fungsionalitas produk yang lebih detail dibandingkan desain dengan fidelitas rendah tetapi dengan detail dan polesan visual yang lebih sedikit dibandingkan desain dengan fidelitas tinggi.

Design Style

Panduan gaya desain adalah seperangkat pedoman yang memberikan arahan dan konsistensi untuk elemen desain, termasuk tipografi, skema warna, tata letak, ikonografi, dan interaksi.

Untuk Lazada sendiri mereka menggunakan warna dasar untuk websitenya sehingga saya membuatkan design/style-guide yang tidak terlalu berbeda dengan aslinya.

HI — Fi Desigtn

Desain High Fidelity mengacu pada proses pembuatan produk digital yang memiliki tingkat detail, akurasi, dan realisme yang tinggi. Proses desain ini biasanya melibatkan beberapa putaran umpan balik dan revisi untuk menyempurnakan desain hingga memenuhi kebutuhan pengguna. Namun untuk desainnya masih cukup terinspirasi dari website ZARA itu sendiri namun saya berusaha membuatnya lebih user-friendly.

4. Prototype

Prototipe adalah versi awal atau mockup suatu produk atau aplikasi yang digunakan untuk menguji dan menyempurnakan desainnya. Prototipe dapat dibuat menggunakan berbagai metode dan alat, seperti sketsa pena dan kertas, gambar rangka digital, atau maket interaktif. Dengan prototipe, saya dapat bereksperimen dengan berbagai tata letak, fitur, dan interaksi untuk menemukan solusi terbaik bagi kebutuhan pengguna.

(untuk Pengujian dapat menghubungi saya terdahulu).

5. Pengujian

Tahap terakhir dari pemikiran desain adalah pengujian. Ini mengacu pada proses mengevaluasi antarmuka pengguna dan pengalaman pengguna situs web, aplikasi, produk digital lainnya untuk mengidentifikasi masalah kegunaan, titik kesulitan pengguna, atau area lain yang perlu ditingkatkan.

A. Pengujian Kegunaan

Setelah membuat prototipe dan menghubungkan semua tampilan, saatnya menguji produk dengan pengguna. Tujuan saya adalah mengevaluasi desain baru kepada pengguna. Proses ini dilakukan secara online melalui aplikasi zoom. Pengguna harus berbagi layar selama pelaksanaan tugas.

B. Tugas yang Diberikan

Tugas-tugas ini melibatkan penciptaan pengalaman digital yang interaktif dan intuitif bagi pengguna. Tugasnya dapat bervariasi tergantung pada tahap proses desain. Berikut beberapa tugas yang saya buat sesuai skenario yang telah dibuat:

RINGKASAN WAWASAN

Berdasarkan hasil UT, pengguna berhasil menyelesaikan seluruh tugas dengan baik. Dari skala 1–5 beberapa tugas diberi skor 4 dari 5 yang artinya dapat dikatakan cukup berhasil dan sesuai dengan kebutuhan pengguna.

Result Score

Berdasarkan wawasan yang diperoleh dari pengguna, dapat disimpulkan bahwa tidak ada kesulitan yang berarti dari seluruh tugas yang diberikan. Semua informasi yang diberikan pada setiap halaman jelas dan informatif. Kendala yang dialami pengguna pada saat melaksanakan tugas ini hanya kesalahan perangkat saja karena terdapat beberapa prototype yang tidak berjalan pada perangkatnya.

Walaupun persentasenya sudah mencapai 80%, namun alangkah baiknya jika segala masukan dari pengguna dapat menjadi bahan pertimbangan untuk melakukan perbaikan sehingga efisiensi dan kemudahan penggunaan website ini tetap dapat tercapai.

Selama proses portofolio ini, salah satu hal yang saya pelajari adalah sudut pandang pengguna seperti bagaimana menemukan solusi yang baik bagi mereka sehingga pengalaman mereka dalam menggunakan produk menjadi lebih efisien dan menyenangkan.

Saya menyadari bahwa masih banyak yang harus diperbaiki dari studi kasus ini sehingga saya sangat menghargai kritik dan saran yang membangun dari Anda semua yang telah meluangkan waktu untuk membaca artikel ini.

Terima kasih sebelumnya!

--

--