Redesign Tokopedia Mobile App( UI & UX )

fahmi oye
4 min readOct 21, 2020

--

Introduction

Siapa yang tidak kenal tokopedia, aplikasi e-commerce dengan berbagai macam produk dari mulai fashion, alat dapur, perlengkapan bayi dll. Serta ada lebih dari 50 juta unduhan di play store maupun app store, menjadikan tokopedia sebagai e-commerce terbesar di Indonesia.

Banyaknya pengguna tokopedia, membuat kami ingin mencaritahu masalah apa yang terjadi oleh pengguna aplikasi tokopedia. Dengan begitu kami dapat memberikan inovasi atau ide-ide sehingga tokopedia menjadi lebih responsif terhadap masalah yang terjadi kepada pengguna.

Our team

Willy : ux research, ux design, ui design

Eve : ux research, ux design, ui design

Fahmi : ux research, ux design, ui design

Our goals

  • Redesign sajian konten pada produk detail untuk memudahkan pengguna mengambil keputusan untuk membeli barang.
  • Redesign dan relayout home screen dan fitur-fitur yang ada.
  • Simplify flow pada saat transaksi pembelian barang.

Research

Melakukan research untuk mencari tahu apa yang sebenarnya terjadi oleh user, apakah user mengalami hambatan atau masalah dalam penggunaan aplikasi, kami mencari tahu dengan melakukan beberapa metode:

Comparative

Menggunakan comparative research membuat kami dapat mencari tahu kelebihan dan kekurangan aplikasi e-commerce selain tokopedia

Bukalapak

Strength :

  • Adanya rekomendasi pada halaman utama.
  • Halaman utama mempunyai batas scroll.
  • Desain yang tidak begitu ramai.

Weakness :

  • Wishlist yang berada di app bar kurang reachable.
  • Filter slider gratis ongkir tertutup.
  • Informasi barang kurang lengkap.

Shopee

Strength :

  • Merchant lebih banyak.
  • Cara Kategorisasi (i.e. New Normal).
  • Rating toko mudah dilihat.

Weakness :

  • Layout terlalu penuh
  • Belum ada opsi asuransi pengiriman

JDID

Strength :

  • Fitur Back to Top.
  • Menu Sub-category di produk detail (tapi fixed).
  • Landing setelah klik “Beli Sekarang” dan “Tambah ke Keranjang” sama (secara flow jadi lebih simple).

Weakness :

  • Fitur Feed pada Home Page mirip dengan fitur Home (bisa dihilangkan)
  • Tidak ada notifikasi pesan dari jawaban penjual tentang diskusi yang di submit
  • Wishlist harus masuk ke profile dulu (Flow kepanjangan)

Qualitative, quantitative & usability research

Kami mengajukan beberapa pertanyaan kepada 21 orang pengguna aktif secara tatap muka maupun menggunakan google form agar kita bisa tau pribadi seseorang dalam menggunakan aplikasi tokopedia.

Result

Dari hasil interview, kami mempunyai kesimpulan yaitu :

  • Orang tidak terlalu mementingkan harga, sebagian ada yang lebih mementingkan harga Status Toko, dan Rating
  • Sesuai dengan ekspektasi, Interface dan Experience app Tokopedia sudah merupakan base yang baik, tinggal pengembangan dari segi prioritas, visibility beberapa features yang penting dan potensi new features yang membantu
  • Hasil dari research kita ternyata fitur search grouping kurang diminati.
  • Orang lebih banyak masuk keranjang, karena bisa lebih banyak memilih produk yang mau dibeli duluan.
  • Orang merasa tidak terganggu oleh visual dan flow tokped, malah ada yang bilang makin lengkap makin bagus.

User persona

Dari hasil interview kami ke pengguna, ada banyak jenis kebutuhan yang beragam, kami melakukan akumulasi yang sekiranya jawabanya sama dari pengguna yang lain.

Oleh karena itu kami hanya membuat 1 persona.

User journey

Affinity map

Melakukan metode ini membuat kami lebih mudah untuk mengelompokan sebuah data secara lebih luas lagi sehingga kita nanti dapat membuat HMW secara lebih mudah.

Dari gambar di atas kami memiliki 4 pengelompokan yaitu :

  1. Simply flow
  2. Features development
  3. Highlight Existed Features
  4. Priority in Product Selection

Ideation

How might we

Ketika kita sudah mempunyai 4 pengelompokan kami membuat HMW yang bisa dibilang bagaimana jika kita?, sehingga kami punya gambaran terbesar dari ide-ide kita nanti.

Dari HMW yang kami buat, kami masing-masing memberika ide pada setiap HWM. Memberikan ide sebanyak mungkin akan lebih baik karena semakin banyak pilihan semakin kita dapat meyortir mana yang penting untuk bisnis dan penting untuk user.

Dari banyaknya ide yang kami kasih, gambar di atas adalah hasil dari metode 2 x 2 matix yang dimana kami memilih apa yang penting untuk user dan penting untuk bisnis.

Wireframe High-fi

Conclusion

Untuk kesimpulannya adalah kami membuat fitur yang dapat membandingkan barang yang sama namun mempunyai detail yang beda seperti harga, rating barang,dll. Sehingga user dapat mengambil keputusan yang lebih tepat.

--

--

No responses yet