Scrollable content goes here

Home

Resume

PDF

Linkedin

Home

Resume

PDF

Linkedin

Redesign Matahari App

Redesign Matahari App

Role

UI/UX Design

Credit

Solo Project

Company

Matahari - Binar Academy (Boothcamp)

PROTOTYPE

PROTOTYPE

Prototype Redesign Matahari App

Aplikasi Matahari adalah platform ritel terbesar di Indonesia, yang menawarkan produk fashion, kecantikan, dan alas kaki berkualitas dengan harga terjangkau untuk kalangan menengah yang terus berkembang. Awalnya, saya menggunakan aplikasi ini untuk mengeksplorasi fiturnya, termasuk menu kategori yang memudahkan pencarian produk.Namun, saya menemukan beberapa masalah pada antarmukanya, terutama di bagian menu kategori dan filter pencarian yang membuat navigasi terasa membingungkan.Hal ini mendorong saya untuk melakukan redesign aplikasi, dengan fokus pada perbaikan alur dan kemudahan dalam pencarian produk.

Aplikasi Matahari adalah platform ritel terbesar di Indonesia, yang menawarkan produk fashion, kecantikan, dan alas kaki berkualitas dengan harga terjangkau untuk kalangan menengah yang terus berkembang. Awalnya, saya menggunakan aplikasi ini untuk mengeksplorasi fiturnya, termasuk menu kategori yang memudahkan pencarian produk.Namun, saya menemukan beberapa masalah pada antarmukanya, terutama di bagian menu kategori dan filter pencarian yang membuat navigasi terasa membingungkan.Hal ini mendorong saya untuk melakukan redesign aplikasi, dengan fokus pada perbaikan alur dan kemudahan dalam pencarian produk.

Problem

Review pengguna di Play Store dan App Store menunjukkan beberapa masalah

Review pengguna di Play Store dan App Store menunjukkan beberapa masalah

fitur filter yang membingungkan

fitur filter yang membingungkan

produk yang tidak sesuai

produk yang tidak sesuai

antarmuka yang kurang ramah pengguna

antarmuka yang kurang ramah pengguna

performa aplikasi yang lambat

performa aplikasi yang lambat

Untuk mengatasi hal ini, saya akan melakukan wawancara pengguna guna mengidentifikasi pain point dan merancang ulang antarmuka yang dapat menyederhanakan pencarian produk serta meningkatkan pengalaman pengguna.

Untuk mengatasi hal ini, saya akan melakukan wawancara pengguna guna mengidentifikasi pain point dan merancang ulang antarmuka yang dapat menyederhanakan pencarian produk serta meningkatkan pengalaman pengguna.

Sedikit perubahan pada menu utama

Problem, Jarak Product Cards di bagian "Mungkin Kamu Suka" terlalu sempit. Hal ini membuat tampilan antarmuka terasa sempit, berantakan, dan tidak seimbang.


Solusi, Perlu ditambah agar tampilan lebih mudah dibaca dan tidak terasa padat.

Menambahkan bayangan halus atau garis tepi di sekitar setiap kartu untuk meningkatkan pemisahan visual dan membuatnya lebih mudah dibedakan. Pastikan keselarasan dan jarak antar elemen konsisten untuk tampilan yang lebih rapi dan terorganisir.

Sedikit perubahan pada menu utama

Problem, Jarak Product Cards di bagian "Mungkin Kamu Suka" terlalu sempit. Hal ini membuat tampilan antarmuka terasa sempit, berantakan, dan tidak seimbang.

Solusi, Perlu ditambah agar tampilan lebih mudah dibaca dan tidak terasa padat.

Menambahkan bayangan halus atau garis tepi di sekitar setiap kartu untuk meningkatkan pemisahan visual dan membuatnya lebih mudah dibedakan. Pastikan keselarasan dan jarak antar elemen konsisten untuk tampilan yang lebih rapi dan terorganisir.

Menu Utama

Peubahan pada menu kategori

Problem, Merasa bingung karena terdapat dua bagian kategori karena hal ini dapat menciptakan redundansi dan berpotensi menimbulkan masalah navigasi.

Solusi, Hapus salah kategori yang berada di bawah search bar, untuk menghilangkan duplikasi dan meningkatkan kejelasan. Satu bagian kategori yang terstruktur dengan baik akan meningkatkan pengalaman pengguna dan menyederhanakan navigasi.

Peubahan pada menu kategori

Problem, Merasa bingung karena terdapat dua bagian kategori karena hal ini dapat menciptakan redundansi dan berpotensi menimbulkan masalah navigasi.

Solusi, Hapus salah kategori yang berada di bawah search bar, untuk menghilangkan duplikasi dan meningkatkan kejelasan. Satu bagian kategori yang terstruktur dengan baik akan meningkatkan pengalaman pengguna dan menyederhanakan navigasi.

Menu Kategori

Penambahan fitur baru pada hasil pencarian untuk setiap product

Problem, Product Card hanya menampilkan warna dan ukuran, tanpa informasi mengenai jumlah ulasan dan jumlah barang terjual, sehingga menyulitkan pengguna untuk menilai popularitas dan keandalan produk.

Solusi, Tambahkan informasi mengenai jumlah ulasan dan jumlah barang terjual untuk memberikan pengguna informasi yang lebih jelas dan relevan, sehingga mereka dapat mengambil keputusan pembelian dengan lebih mudah dan tepat.

Penambahan fitur baru pada hasil pencarian untuk setiap product

Problem, Product Card hanya menampilkan warna dan ukuran, tanpa informasi mengenai jumlah ulasan dan jumlah barang terjual, sehingga menyulitkan pengguna untuk menilai popularitas dan keandalan produk.

Solusi, Tambahkan informasi mengenai jumlah ulasan dan jumlah barang terjual untuk memberikan pengguna informasi yang lebih jelas dan relevan, sehingga mereka dapat mengambil keputusan pembelian dengan lebih mudah dan tepat.

Hasil Pencarian

Perubahan fitur filter pada hasil pencarian untuk setiap produk

Problem, Pada bagian filter, pilihan warna hanya ditampilkan dalam bentuk teks, sehingga membingungkan pengguna karena mereka tidak dapat mengenali warna secara visual.

Solusi, Tambahkan contoh warna di samping setiap nama warna, sehingga pengguna dapat dengan mudah mengenali dan memilih warna yang diinginkan. Perbaikan ini meningkatkan kejelasan.

Problem, Pada bagian filter, pilihan warna hanya ditampilkan dalam bentuk teks, sehingga membingungkan pengguna karena mereka tidak dapat mengenali warna secara visual.

Solusi, Tambahkan contoh warna di samping setiap nama warna, sehingga pengguna dapat dengan mudah mengenali dan memilih warna yang diinginkan. Perbaikan ini meningkatkan kejelasan.

Filter Warna

Perubahan pada dropdown filter harga

Problem, Filter harga menggunakan slider menyulitkan pengguna memilih rentang harga secara presisi, serta tampilan harga tidak jelas karena tanpa format yang sesuai.

Solusi, Slider diganti dengan input harga minimum–maksimum yang lebih intuitif, dilengkapi format harga yang jelas (simbol Rp dan pemisah ribuan), serta desain yang lebih rapi untuk meningkatkan kenyamanan pengguna.

Problem, Filter harga menggunakan slider menyulitkan pengguna memilih rentang harga secara presisi, serta tampilan harga tidak jelas karena tanpa format yang sesuai.

Solusi, Slider diganti dengan input harga minimum–maksimum yang lebih intuitif, dilengkapi format harga yang jelas (simbol Rp dan pemisah ribuan), serta desain yang lebih rapi untuk meningkatkan kenyamanan pengguna.

Filter Harga

Sebelum dan Sesudah

Sebelum dan Sesudah

Perbandingan antarmuka aplikasi e-commerce sebelum dan sesudah redesain. Versi terbaru menampilkan tampilan yang lebih bersih, navigasi yang lebih intuitif, serta pengalaman pengguna yang lebih nyaman dan terfokus.

Perbandingan antarmuka aplikasi e-commerce sebelum dan sesudah redesain. Versi terbaru menampilkan tampilan yang lebih bersih, navigasi yang lebih intuitif, serta pengalaman pengguna yang lebih nyaman dan terfokus.

Halaman Utama

1

1

Jarak antara Card Product ke Card Product lainnya

Jarak antara Card Product ke Card Product lainnya

2

2

Memindahkan brand ke atas agar pengguna fokus pada brand setelah melihat banner diskon.

Memindahkan brand ke atas agar pengguna fokus pada brand setelah melihat banner diskon.

3

3

Menambahkan opsi “Lihat Semua” agar pengguna dapat langsung melihat seluruh produk tanpa harus menggulir ke samping, sehingga navigasi menjadi lebih efisien dan nyaman.

Menambahkan opsi “Lihat Semua” agar pengguna dapat langsung melihat seluruh produk tanpa harus menggulir ke samping, sehingga navigasi menjadi lebih efisien dan nyaman.

4

4

Membuat Button untuk Memberi Tahu Pengguna Bahwa Itu Dapat Diklik, Bukan Hanya Card Product

Membuat Button untuk Memberi Tahu Pengguna Bahwa Itu Dapat Diklik, Bukan Hanya Card Product

Sebelum - Menu Utama

Sesudah - Menu Utama

Halaman Kategori

1

1

Sebelumnya terdapat dua tampilan kategori yang ganda, sehingga saya menghapus kategori yang berada di bagian atas, tepat di bawah kolom pencarian, untuk menyederhanakan tampilan dan menghindari duplikasi informasi.

Sebelumnya terdapat dua tampilan kategori yang ganda, sehingga saya menghapus kategori yang berada di bagian atas, tepat di bawah kolom pencarian, untuk menyederhanakan tampilan dan menghindari duplikasi informasi.

Sebelum - Menu Kategori

Sesudah - Menu Kategori

Hasil Pencarian

1

1

Perubahan pada tampilan bagian kategori hasil pencarian

Perubahan pada tampilan bagian kategori hasil pencarian

2

2

Menambahkan logo di bagian pencarian

Menambahkan logo di bagian pencarian

3

3

Menambahkan informasi jumlah ulasan dan jumlah produk terjual di setiap kartu, serta memberikan garis tepi (stroke) pada setiap kartu.

Menambahkan informasi jumlah ulasan dan jumlah produk terjual di setiap kartu, serta memberikan garis tepi (stroke) pada setiap kartu.

Sebelum - Hasil Pencarian

Sesudah - Hasil Pencarian

Filter Pemilihan Warna

1

1

Buat Contoh Warna agar Pengguna Dapat Mengetahui Warna Asli,
Menampilkan sampel warna (color swatches) di samping atau menggantikan teks warna, agar pengguna dapat melihat representasi visual warna yang sebenarnya dan membuat pilihan dengan lebih percaya diri.

Buat Contoh Warna agar Pengguna Dapat Mengetahui Warna Asli,
Menampilkan sampel warna (color swatches) di samping atau menggantikan teks warna, agar pengguna dapat melihat representasi visual warna yang sebenarnya dan membuat pilihan dengan lebih percaya diri.

Sebelum - Filter Warna

Sesudah - Filter Warna

Filter pemilihan harga

1

1

Pengguna dapat menyesuaikan harga sesuai keinginan, mulai dari harga terendah hingga harga tertinggi.

Pengguna dapat menyesuaikan harga sesuai keinginan, mulai dari harga terendah hingga harga tertinggi.

Sebelum - Filter Harga

Sesudah - Filter Harga

Penutup

Proyek desain ulang ini memungkinkan saya untuk mempertajam tidak hanya kemampuan desain visual saya, tetapi juga kemampuan saya untuk berpikir kritis tentang perilaku pengguna, tujuan bisnis, dan kegunaan. Dengan menganalisa masalah yang ada saat ini dan memikirkan kembali alur pengguna, saya dapat mengusulkan pengalaman yang lebih bersih, lebih intuitif, dan berpusat pada pengguna untuk para pembeli online Matahari.

Salah satu pelajaran terpenting yang saya pelajari selama proses ini adalah bahwa desain tidak pernah benar-benar selesai. Desain akan terus berkembang - dan memang seharusnya begitu - melalui umpan balik, pengujian, dan pengulangan yang terus menerus. Meskipun studi kasus ini dilakukan secara mandiri, saya sangat senang dengan potensi memvalidasinya melalui pengujian kegunaan dan wawasan pengguna yang nyata di masa depan.

Sebagai seorang desainer, saya selalu ingin berkembang dengan memecahkan masalah nyata dengan solusi yang berpusat pada manusia. Saya melihat proyek ini bukan sebagai hasil akhir, tetapi sebagai bagian dari perjalanan berkelanjutan untuk menciptakan pengalaman digital yang lebih baik dan lebih bermakna.

Proyek desain ulang ini memungkinkan saya untuk mempertajam tidak hanya kemampuan desain visual saya, tetapi juga kemampuan saya untuk berpikir kritis tentang perilaku pengguna, tujuan bisnis, dan kegunaan. Dengan menganalisa masalah yang ada saat ini dan memikirkan kembali alur pengguna, saya dapat mengusulkan pengalaman yang lebih bersih, lebih intuitif, dan berpusat pada pengguna untuk para pembeli online Matahari.

Salah satu pelajaran terpenting yang saya pelajari selama proses ini adalah bahwa desain tidak pernah benar-benar selesai. Desain akan terus berkembang - dan memang seharusnya begitu - melalui umpan balik, pengujian, dan pengulangan yang terus menerus. Meskipun studi kasus ini dilakukan secara mandiri, saya sangat senang dengan potensi memvalidasinya melalui pengujian kegunaan dan wawasan pengguna yang nyata di masa depan.

Sebagai seorang desainer, saya selalu ingin berkembang dengan memecahkan masalah nyata dengan solusi yang berpusat pada manusia. Saya melihat proyek ini bukan sebagai hasil akhir, tetapi sebagai bagian dari perjalanan berkelanjutan untuk menciptakan pengalaman digital yang lebih baik dan lebih bermakna.

Let's start creating together

Let’s turn ideas into something beautiful and powerful.

Copy my email

Let's start creating together

Let’s turn ideas into something beautiful and powerful.

Copy my email

Portfolio By Muhammad Faris 2025

Portfolio By Muhammad Faris 2025