Bank Jago · 2022

Pocket Tabs

Membantu orang mengelompokkan Kantong berdasarkan tujuan uangnya, bukan hanya siapa pemiliknya.

Info proyek
Peran
Product Designer
Area
Halaman Kantong di aplikasi Jago.
Cakupan
Tab buatan sendiriBuat, ganti nama, ubah urutan, dan hapus tab, di samping All, My Pockets, dan Shared with me Merapikan KantongTambahkan Kantong ke tab, pindahkan, keluarkan, atau isi tab kosong dengan Kantong yang sudah ada PanduanTooltip dua langkah untuk pengguna baru, dan toast konfirmasi untuk setiap perubahan PengamanAturan nama tab, pesan error langsung di kolom, dan pengecekan perubahan yang belum disimpan
Rilis
MVP 1, versi pertama fitur ini.
01 · Ringkasan

Kantong diurutkan berdasarkan pemilik. Orang berpikir berdasarkan tujuan.

Di aplikasi Jago, semua Kantong ada di satu halaman, dan satu-satunya cara memilahnya adalah berdasarkan kepemilikan: All, My Pockets, dan Shared with me. Itu cukup kalau Kantongnya sedikit. Tetapi tidak lagi berjalan ketika seseorang punya Kantong Utama, beberapa Kantong tabungan, Kantong Terkunci, Kantong yang dibagi dengan keluarga, dan Kantong GoBiz untuk usahanya, semuanya dalam satu grid.

Pocket Tabs memungkinkan orang membuat tab sendiri, seperti Bisnis, Pribadi, atau Investasi, lalu menentukan Kantong mana yang masuk ke masing-masing tab. Satu Kantong bisa ada di lebih dari satu tab, dan mengeluarkannya dari sebuah tab tidak pernah menyentuh uang di dalamnya.

Versi pertama ini mencakup seluruh siklusnya: membuat dan mengelola tab, memindahkan Kantong antar tab, mengisi tab yang kosong, serta pengaman dan panduan di sekitarnya.

02 · Masalahnya

Satu grid panjang, dipilah dengan cara yang keliru

Kantong adalah cara nasabah Jago membagi uangnya: pengeluaran harian, tabungan untuk tujuan tertentu, dana yang dikunci, Kantong bersama, dan Kantong bisnis untuk merchant GoBiz. Semakin sering seseorang memakai Kantong, semakin panjang grid-nya.

Tab yang ada hanya menjawab "siapa pemilik Kantong ini?", padahal orang biasanya mencari Kantong berdasarkan kegunaannya: uang usaha, dana liburan, investasi. Dengan tab kepemilikan saja, mereka harus menggulir dan memindai seluruh grid setiap kali.

Biarkan orang mengelompokkan Kantong sesuai cara mereka memikirkan uangnya, tanpa pernah membahayakan uang itu sendiri.

Bagian kedua itu sama pentingnya dengan bagian pertama. Setiap tindakan di fitur ini harus jelas terbaca sebagai merapikan, bukan memindahkan dana atau menghapus.

03 · Cara kerjanya

Enam alur, satu model mental

Tab di halaman Kantong

Mobile · langsung di grid
A · Halaman Kantong, kini dengan tab

Tab buatan sendiri berada tepat setelah tiga tab bawaan, dengan tombol + di ujung baris untuk membuat tab baru. Baris tab bisa digeser ke samping, jadi tetap berfungsi seiring bertambahnya tab.

Halaman Kantong dengan tab All, My Pockets, dan Shared with me, tombol plus, dan grid kartu Kantong
Halaman Kantong dengan baris tabnya
B · Membuat tab

Mengetuk + membuka bottom sheet singkat dengan satu kolom. Nama dibatasi 15 karakter dengan penghitung langsung, sehingga selalu muat di baris tab, dan tombol Save baru aktif setelah nama diisi. Toast mengonfirmasi tab baru, dan halaman langsung berpindah ke tab tersebut.

Bottom sheet Create New Tab dengan kolom nama kosong dan tombol Save tidak aktif
Nama kosong membuat Save tidak aktif
Sheet Create New Tab dengan My Investment terketik, penghitung 13 dari 15, dan tombol Save aktif
Penghitung 15 karakter yang langsung berubah
Toast bahwa tab My Investment sudah ditambahkan, dengan tab baru yang kosong terpilih
Dikonfirmasi, lalu langsung pindah ke tab baru
C · Mengisi tab yang kosong

Tab baru dimulai dalam keadaan kosong, jadi kartu Create Pocket-nya menawarkan dua jalan: membuat Kantong baru, atau menambahkan Kantong yang sudah ada dari tab lain. Pemilihnya memakai tab dan pencarian yang sama, bisa memilih beberapa Kantong sekaligus, dan tombol Save menghitung berapa yang dipilih.

Bottom sheet dengan pilihan Add New Pocket dan Add existing Pocket from other Tab
Dua cara mengisi tab kosong
Daftar Kantong dengan tombol pilihan, Lock Pocket terpilih, dan tombol Save (1)
Pilih Kantong yang ada; Save menghitungnya
Toast bahwa Kantong berhasil ditambahkan ke tab ini, dengan Lock Pocket kini ada di My Investment
Ditambahkan, dengan toast sebagai konfirmasi
D · Menambahkan Kantong ke tab lain

Dari tab mana pun, menekan lama sebuah Kantong membuka menunya. Add to other tab menampilkan setiap tab sebagai pratinjau kecil berisi Kantong yang sudah ada di dalamnya, sehingga orang mengenali tab dari isinya, bukan hanya dari namanya. Kalau tab yang tepat belum ada, ada pintasan New Tab di sheet yang sama.

Menu tekan lama pada Kantong dengan Copy Pocket Number, Edit Pocket order, dan Add to other tab
Menu tekan lama pada Kantong
Sheet Add to Other Tab yang menampilkan tab Business, Personal, dan Other sebagai pratinjau isinya, dengan tautan New Tab
Tab ditampilkan berdasarkan isinya
Toast bahwa Kantong sudah ditambahkan ke tab ini
Toast konfirmasi
E · Memindahkan atau mengeluarkan Kantong

Di dalam tab buatan sendiri, menu tekan lama yang sama menyesuaikan konteksnya: Move to other tab, dan Remove from this tab berwarna merah. Mengeluarkan hanya melepas Kantong dari tab ini. Kantong dan saldonya tetap seperti semula, dan toast-nya pun menyatakan hal itu: Kantong telah dikeluarkan dari tab ini.

Menu tekan lama di dalam My Investment dengan Edit Pocket order, Move to other tab, dan Remove from this tab berwarna merah
Di dalam tab buatan sendiri: pindahkan atau keluarkan
Di antara memakai tab dan mengelolanya

Merapikan Kantong dilakukan langsung di grid. Mengubah tab itu sendiri punya layar tersendiri, tempat semua perubahan disimpan sekaligus.

Mengelola tab

Dari menu ···
F · Manage Pocket Tabs

Manage Pocket Tabs ada di menu ··· halaman Kantong. Tab bisa diganti namanya, diubah urutannya dengan pegangan geser, dan dihapus, sementara tiga tab bawaan tetap terkunci. Perubahan disimpan sekaligus dengan satu centang, dan keluar dengan perubahan yang belum disimpan akan memunculkan pertanyaan terlebih dahulu.

Menu halaman Kantong dengan See my e-Statements, Edit Pocket order, Manage Pocket Tabs, dan About Pockets
Titik masuknya, di menu ···
Layar Manage Pocket Tabs dengan empat tab dan pegangan geser; hanya My Investment yang punya ikon hapus
Ganti nama, ubah urutan, hapus
Dialog Save Changes yang menanyakan apakah perubahan akan disimpan, dengan Don't Save dan Save
Perubahan yang belum disimpan tidak hilang diam-diam
G · Panduan untuk pengguna baru

Saat pertama kali membuka Kantong setelah pembaruan, tooltip dua langkah menunjuk ke + (Add New Tabs), lalu ke sebuah Kantong (tekan lama untuk mengatur ulang atau membuka pengaturan lain). Tooltip ini mengajarkan dua hal yang tidak terlihat di layar, dan kedua langkahnya bisa dilewati.

Tooltip yang menunjuk tombol plus: Add New Tabs, kelompokkan Kantong ke tab berbeda, dengan Skip dan Next
Langkah 1: dari mana tab berasal
Tooltip yang menunjuk sebuah Kantong: Manage Your Pocket, tekan lama untuk mengatur ulang atau membuka pengaturan, dengan Prev dan Got it
Langkah 2: gestur tekan lama
04 · Keputusan desain

Yang membuatnya tetap sederhana, dan aman

  1. 1

    Merapikan tidak pernah terlihat seperti memindahkan uang

    Setiap tindakan di fitur ini menyebut tab: Add to other tab, Move to other tab, Remove from this tab. Remove berwarna merah karena mengubah sesuatu, tetapi toast-nya menegaskan bahwa yang berubah hanya tabnya. Tidak boleh ada yang bertanya-tanya apakah saldonya ikut berpindah.

  2. 2

    Satu Kantong bisa ada di lebih dari satu tab

    Uang jarang masuk rapi ke satu kategori. Kantong bisnis bisa juga menjadi bagian dari rencana investasi, jadi menambahkan Kantong ke satu tab tidak mengeluarkannya dari tab lain.

  3. 3

    Biarkan grid tetap grid; simpan tindakan di balik tekan lama

    Halaman Kantong tetap menjadi tampilan saldo yang bersih. Tindakan merapikan ada di menu tekan lama yang menyesuaikan tab tempat pengguna berada, dan tooltip pengguna baru mengajarkan gestur itu sekali.

  4. 4

    Tunjukkan isinya, bukan hanya namanya

    Di sheet Add to Other Tab, setiap tab tampil sebagai pratinjau Kantong di dalamnya. Memilih tujuan yang tepat jadi soal mengenali, bukan mengingat.

  5. 5

    Tidak ada jalan buntu

    Tab kosong menawarkan dua cara untuk mengisinya, dan sheet Add to Other Tab punya pintasan New Tab. Orang tidak pernah perlu mundur dan mengulang dari awal untuk menyelesaikan tujuannya.

05 · Pengaman

Aturan untuk nama, dan untuk perubahan yang belum disimpan

Nama tab tampil di halaman utama Kantong, jadi perlu aturan. Setiap masalah ditandai dengan garis merah pada kolom yang bermasalah, ditambah toast yang menjelaskan apa yang perlu diperbaiki.

  • Nama kosongTab tidak bisa disimpan tanpa nama.
  • Nama gandaDua tab dengan nama yang sama mustahil dibedakan, jadi nama yang sudah dipakai ditolak.
  • Kata yang tidak pantasNama dicek terlebih dahulu sebelum bisa disimpan.
  • Lebih dari satu masalahError digabung menjadi satu pesan, sehingga semuanya bisa diperbaiki sekaligus.
  • Batas 15 karakterPenghitung langsung saat mengetik menjaga nama tetap cukup pendek untuk baris tab.
  • Perubahan belum disimpanKeluar dari Manage Pocket Tabs dengan perubahan akan ditanya apakah ingin menyimpannya, dengan Save sebagai tindakan utama.
Manage Pocket Tabs dengan tiga nama tab bergaris merah dan toast error tentang nama ganda dan tidak pantas
Beberapa error, satu pesan, setiap kolom bermasalah ditandai
06 · Hasil

Yang ingin saya ukur

Berikut sinyal yang akan menunjukkan apakah tab benar-benar membantu orang menemukan dan mengelola Kantong mereka:

  1. Adopsi. Persentase pengguna Kantong yang membuat setidaknya satu tab.
  2. Kedalaman. Jumlah Kantong per tab buatan sendiri, dan berapa banyak Kantong yang ada di lebih dari satu tab.
  3. Panduan. Berapa banyak orang yang menyelesaikan tooltip pengguna baru dibandingkan yang melewatinya.
  4. Hambatan. Seberapa sering error penamaan muncul, untuk menyempurnakan aturannya.
Akan ditambahkan: angka adopsi yang sebenarnya jika sudah tersedia.
07 · Penutup

Label kecil yang membawa kepercayaan

Sebagian besar fitur ini adalah pengelolaan daftar biasa: buat, ganti nama, ubah urutan, hapus. Yang menjadikannya masalah perbankan adalah setiap tindakan itu berada tepat di samping uang orang. Pekerjaan yang paling penting ada di kata-katanya, yaitu memastikan setiap label dan toast menyebut "tab", supaya merapikan tidak pernah terasa seperti memindahkan dana.

Sebagai MVP, tab dibuat sederhana: sebuah nama dan sekumpulan Kantong. Setelah kita melihat bagaimana orang benar-benar memakainya, ide yang lebih kaya seperti ikon tab atau saran pengelompokan bisa mendapat tempatnya.

Kontak

Suka dengan yang ini? Yuk, ngobrol.

Kalau Anda sedang mengerjakan sesuatu yang bisa terbantu dengan cara berpikir seperti ini, saya senang mendengarnya.

Kirim email