UI/UX Case Study Membuat Dashboard Toko Kue Online
Bismillah. Halo teman-teman semua!
Pada kesempatan kali ini kita akan membuat suatu desain dashboard usaha toko kue sederhana yang melayani pelanggan secara online.
Pada artikel ini, saya akan menjelaskan langkah-langkah yang saya lakukan dari awal hingga akhir. Selamat membaca^^
Sebelum kita mulai proses desain, akan lebih baik jika kita mengetahui dan memahami apa itu dashboard. Well, Dashboard adalah seperti layar atau panel yang menampilkan informasi penting dari berbagai sumber dalam satu tempat. Dashboard dapat diibaratkan seperti mading atau papan informasi di dinding yang menunjukkan hal-hal seperti bagaimana bisnis berjalan, berapa banyak uang yang diperoleh, berapa banyak orang yang mengunjungi situs web, atau berapa banyak pesan yang sudah dibalas. Dengan bantuan dashboard, seseorang bisa dengan cepat melihat apa yang sedang terjadi dan kemudian membuat keputusan berdasarkan informasi tersebut.
Latar Belakang
“Kami adalah sebuah toko kecil yang menjual kue secara online. Kami ingin memiliki dashboard yang sederhana untuk melihat bagaimana penjualan kami berjalan setiap bulan”.
Berdasarkan brief di atas, dapat kita ketahui bahwa usaha toko kue tersebut sedang dalam tahap pengembangan. Itu berarti dashboard yang akan kita buat tidak membutuhkan terlalu banyak komponen, tetapi tetap menampilkan informasi penting yang dibutuhkan.
Tujuan
Tujuan dari dibuatnya dashbaord usaha toko kue online tersebut adalah agar pemilik toko dapat mudah memantau dan memahami tren penjualan bulanan dan produk apa yang paling banyak terjual.
Komponen
Untuk meningkatkan efisiensi dan efektivitas dalam pemantauan beberapa informasi penting terkait penjualan, komponen akan dibagi menjadi beberapa bagian berikut:
1. Ringkasan Penjualan Bulanan
2. Analisis Produk Terlaris.
3. Tambahan konten yang relevan.
Okee sebelum kita memulai desain dashboard, kita akan menyiapkan artboard nya terlebih dahulu.
Saya menggunakan artboard dengan ukuran 1440 x 900 seperti artboard dashboard pada umumnya. Lanjut, setelah artboard kita juga membutuhkan sidebar dengan logo toko di atasnya.
Okedehh, sekarang waktunya kita mulai eksekusi desainnya hoho!
- RINGKASAN PENJUALAN
Ringkasan penjualan merupakan gambaran umum mengenai semua transaksi penjualan yang terjadi dalam periode waktu tertentu, seperti harian, mingguan, bulanan, atau tahunan. Pada bagian ini akan memuat beberapa hal diantaranya, grafik bar yang menunjukkan total penjualan per bulan dan angka total penjualan dan jumlah transaksi dalam satu bulan terakhir. Alright, let’s start with designing the chart.
Pada grafik di atas saya hanya mengisinya sampai bulan april, sesuai dengan bulan artikel ini dibuat. Tapi.. Sebentar, kenapa terlihat seperti ada yang kurang ya?
Saya melakukan perbaikan dengan menambahkan total pesanan yang akan muncul ketika mouse diarahkan ke grafik. Dengan menambah garis putus-putus, user akan lebih mudah ketika membaca grafik.
Oke, selanjutnya adalah angka total penjualan dan jumlah transaksi dalam satu bulan terakhir.
Saya membuatnya dengan tampilan yang sederhana dan menonjolkan poin penting dari card tersebut dengan memberi warna-warna yang memiliki arti. Contohnya, warna hijau berarti sebuah keuntungan sedangkan warna merah berarti sebuah kerugian.
2. ANALISIS PRODUK TERLARIS
Pada analisis produk terlaris ini, akan memuat beberapa informasi penting yang di visualisasikan dalam bentuk pie atau diagram lingkaran dan tabel yang menyajikan daftar produk terlaris beserta jumlah unit yang terjual. Pada bagian pie saya mengalami beberapa kali revisi karena merasa kurang cocok, baik dari segi kata-kata maupun tata letak.
Ini adalah pie yang pertama kali saya buat. Terlihat agak polos dan masih banyak ruang. Akhirnya saya melakukan beberapa revisi.
Setelah melakukan revisi beberapa kali, inilah final design pie nya. Saya menambahkan beberapa elemen sebagai pelengkap informasi. Saya juga menghapus drop down karena akan meletakannya di tabel laporan produk.
Tabel laporan produk berisi informasi mengenai detail produk-produk terlaris pada bulan tersebut. Seperti yang saya katakan sebelumnya, drop down yang sebelumnya ada di card pie saya pindahkan ke tabel laporan. Hal itu bertujuan supaya user mendapatkan informasi yang lebih lengkap karena sudah dalam bentuk laporan. Selain itu, terdapat fitur copy yang akan memudahkan user dalam mencatat laporan.
Setelah siap semuanya, saatnya kita masukkan semua elemen ke dalam artboard dan tambahkan pelengkap lainnya.
Hmm sidebarnya tampak lumayan sepi, sepertinya perlu kita tambahkan sesuatu..
Tadaa! Inilah hasil akhir desain nya! Saya menambahkan sedikit aksen cinnamon dan kata-kata, serta button untuk upload produk terbaru sebagai shortcut. Okedehh, terimakasih sudah membaca sampai akhir. Feel free jika teman-teman memiliki kritik & saran bisa disampaikan melalui kolom komentar ya!🤗✨
See you!
