UX Case Study Project Akhir Krealogi
Meredesign Aplikasi Tugas Akhir dari Krealogi
Latar Belakang
Disini kami mengerjakan tugas akhir dari kampus merdeka study indepent di skilvul ada tugas mengenai ux case study. Ux case study yang saya buat adalah Krealogi yang berisikan meredesign ui yang sudah ada di aplikasi krealogi yang bisa di lakukan dimana saja dan kapan saja.
Aplikasi UI/UX design yang telah kita buat yaitu meredesign dari aplikasi krealogi yang sudah ada namun kita hanya menambahkan beberapa dari Cashflow kategori pembelajaraan
Objektif
- Mengetahui pendapat user terhadap tampilan baru aplikasi krealogi
- Mengetahui kesiapan aplikasi Krealogi dalam fitur cash flow dan performa
- Mengetahui kesesuaian user flow oleh user terhadap aplikasi Krealogi
- Mengetahui tingkat keberhasilan single ease question untuk aplikasi
Respondent Criteria
- Berusia 18–30 tahun
- Mengerti tentang UI Design
- Mempunyai akal dan pikiran
- Berdomisili di seluruh wilayah Indonesia
- Memiliki kemampuan Bahasa Indonesia sebagai native language
- Bersikap aktif dan responsif
- Memiliki pendapat yang sejalan
- Memahami topik yang sejalan
- Mampu memberikan feedback secara jujur
- Mempunyai Smartphone dan Koneksi Internet
Peran dalam Tim
Dalam kelompok saya memiliki 4 orang anggota termasuk saya, saya disini berperan sebagai:
- Muhammad Arya Nurarif Sebagai ketua kelompok pada 80 bagian yang mengerjakan pada Catat Transaksi Pengeluaran, Catat Transaksi Pemasukan, Catat Transaksi Hutang, Gudang Produk
- Aminah Khansa Sebagai Wakil ketua kelompok pada 80 bagian yang mengerjakan pada Menu Keuangan, Ringkasan, Profile, Ubah Informasi
- Vernando Tobing Membuat Pesanan, Detail Pesanan, Pesanan, Statistik Keuangan,
- Nurul Fathiah Annisa D mengerjakan dibagian Home, Notifikasi, Unduh/Cetak, Quote Penyemangat, Quote Apresiasi, Rencana Produk(PO), Produksi Berjualan
Design Process
Dalam sebuah proses pembuatan aplikasi UX case study ini ada beberapa tahap yaitu pembuatan Emphatize, Define, Ideate, User Flow, Wireframe. Selanjutnya pada tahap design process ini kami menggunakan design thingking yang sudah pernah kami buat pada figma yang akan saya jelaskan
1. Empathize
Dalam proses ini kami me-riset beberapa aplikasi sebagai dasar dari pembuatan aplikasi yang akan kami buat. Kami juga me-riset beberapa keluhan pengguna pada aplikasi lain.
2. Define
Pada tahap selanjutnya sehabis Empathize kami melanjutkan untuk mencari beberapa point permasalahan selanjutnya kita membahas atau merudingkan dengan teman kelompok poin yang paling penting atau kita butuhkan.
3. Ideate
Selanjutnya kelompok kami mengeluarkan seluruh ide, dan inspirasi yang terpikirkan, untuk nantinya kami sortir kembali dengan tujuan bisa fokus sesuai dengan bidangnya.
Kemudian kami melakukan pengelompokan fitur-fitur berdasarkan prioritasnya.
Jika gambar Design thingking pada Prioritization Idea tidak terlihat, https://www.figma.com/file/t8HGcPy0nkpnCbSTTbnPxr/Design-Thinking%3A-Define-%26-Ideate-(Template)-and-Userflow?node-id=0%3A1&t=lxLPz7XhDeOjeXvh-0
4. Userflow
Setelah itu kelompok kami membuat userflow yang berisikan dibawah ini:
Jika pada gambar Userflow tidak terlihat, https://www.figma.com/file/NrxBENYpNLH5xMlOv0mZjl/Krealogi-80?node-id=0%3A1&t=9x0prelE5BcVRpEO-0
5. Wireframe
Setelah membuat userflow, kami membuat Wireframe sebagai kerangka sebelum membuat UI Design. Dibawah ini merupakan Wireframe dari Home, Notifikasi, Rencana Produksi, Catat Detail, Produksi Barang, Menu Keuangan, Unduh/Cetak, Ringkasan, Quote Apresiasi, Profile, Ubah Informasi, Pesanan, Gudang
6. Design System
Setelah membuat wireframe, saya membuat design system yang bertujuan agar tampilan ui yang dibuat terlihat konsisten dan juga dapat meminimalisir waktu yang digunakan.
7. UI Design
Setelah membuat wireframe dan design system saya mulai membuat UI Mockup, berikut adalah beberapa hasil dari desain yang telah dibuat.
- Halaman Beranda
Pada halaman ini terdapat beberapa menu yang ada pada gambar di atas
Pada halaman ini terdapat menu lonceng, beranda, gudang pesanan dan terdapat fitur keuntungan pemasukan atau pengeluaran sekaligus dapat gabung dalam komunitas
- Unduh/Cetak Laporan
Pada halaman ini terdapat Unduh laporan transaksi dalam bentuk PDF ataupun Ms. Excel
- Quote Penyemangat
Pada halaman Quote ini memberikan semangat untuk mencari keberhasilan dalam mengapai sesuatu
- Rencana Produk
Pada halaman ini berisikan semua jadwal, terjadwal, dan belum terjadwal. Dan ada fitur tambah Catat Produksi. Pada halaman bawah terdapat fitur tambah catat produksi
Di halaman ini user dapat menambahkan catatan detail produksi dan kalau sudah selesai informasi detail produksi akan bertambah halaman selanjutnya
- Catat transaksi pada halaman keuangan
Dalam halaman ini berisikan nama transaksi, keterangan biaya dan lain”. Sekaligus tambah gambar yang tidak mewajibkan nya. Ditambah ada 1 frame krealogi yaitu catat transaksi Hutang
- Daftar Transaksi
Halaman ini berisikan Pilih transaksi untuk dijadikan pemasukan atau buat transaksi baru
- Gudang
Halaman ini berisikan Produk jadi, produk 1/2 jadi, bahan baku. Sekaligus ada fitur tambah Catat Produk
Di halaman ini berisikan Tambah gudang catat produk terhadap informasi produk yang ingi ditambahkan
- Statistik Keuangan
Di halaman ini berisikan 2 statistik keuangan yaitu Bar Chart dan Line Chart, yang dapat di unduh sekaligus dibagikan kebeberapa pengguna ataupun yang lain nya.
Ini contoh halaman Bar chart yang berisikan statistik keuangan yang berupa diagram, diagram tersebut bisa di unduh/download dan diagram statistik keuangan bisa di bagikan
- Menu Keuangan
Di halaman ini berisikan 3 frame keuangan yaitu keuangan detail, Pilih periode, dan Pilih tanggal yang dapat di terapkan agar bisa mengecek keuntungan pemasukan/pengeluaran
Pada halaman ini berisikan halaman menu keuangan dalam beberapa periode-semua periode sekaligus melihat presentase keuntungan, pemasukan, pengeluaran dan dapat di unduh melalui tombol unduh yang disediakan.
- Profile
Pada halaman ini ada beberapa fitur yang berada pada gambar diatas.
- Ubah Informasi
Pada halaman ini terdapat fitur ubah informasi profile yang dapat merubah beberapa nama, jenis usaha, provinsi sekaligus detail alamat.
- Pesanan
Pada gambar di atas terdapat fitur pesanan yang dapat bisa kita lihat sendiri yaitu ada beberapa frame pesanan yaitu semua, perlu dikirim, belum lunas ataupun sedang dikirim. Sekaligus pada tombol tambah catat pesanan ada berbagai macam informasi yang harus di isi oleh user
Halaman ini adalah halaman pesanan yang sudah dikirim, belum lunas dan lain lain sekaligus ada fitur yang dapat menambahkan catat pesanan.
8. Prototyping
Setelah sudah menyelesaikan mockup ui, langkah selanjutnya adalah membuat alur informasi seperti userflow yang telah dibuat.
9. Testing
Setelah membuat prototype kami melakukan uji coba pengguna terhadap satu responden. Tujuannya untuk mengetahui bagaimana hasil dari ui design dan prototyping yang sudah di buat. Selain itu pada tahap testing ini akan mendapatkan ide baru, dan feedback dari respondent yang dimana feedback dapat meningkatkan performa dari desain produk. Kami membuat beberapa persiapan sebelum melakukan Usability Testing seperti stimulus user research dan record data user research yang dimana akan diisi setelah dilakukan wawancara/interview. Wawancara dilakukan melalui google meet.
Informasi responden
Nama Responden : Halimah Khairiyah Jamilah
Umur : 20 Tahun
Domisili : Jakarta
Pekerjaan : Mahasiswi
Asal Kampus : Universitas Negeri Jakarta(UNJ)
Pada saat interiew kami memberikan link prototype sekaligus mengizikan untuk sharescreen kepada kami untuk testing dan juga kami menanyakan beberapa pertanyaan, terdapat 8pertanyaan dan 7 tugas yang kami berikan yaitu mencoba fitur Home, Keuangan, Catat Transaksi, Pesanan, Gudang, Catat Produk, lalu akun, sekaligus ada fitur perubahan informasi akun. Setelah itu kami menyakan tingkat kepuasan penggunaan aplikasi kepada responden dengan hasil akhir yang diberikan adalah “7” dengan skala 1–7.
10. Rekomendasi
Untuk informasi selanjutnya, tidak ada kekurangan dalam meredesign ini semuanya cukup puas dalam aplikasi krealogi ini, untuk di ukur dari nilai 1–10 nilainya 8. Setelah semua tahap di selesaikan, kemudian kita meredesign pada bagian wireframe(UI Design) dilanjut mencocok cocokan ui design(prototyping).