Geser-Update Task (Mobile)

Ganti status task tanpa buka detail page, cukup geser kartu ke kiri atau kanan.

  1. 1

    Yang berubah & kenapa

    Dulu kalau mau ganti status task dari To Do ke Dikerjakan, lo harus: tap card → buka detail → ubah status di dropdown → save → tap back → cari task berikutnya. 5 step buat 1 perubahan. Lama, ribet, dan kalau update banyak task sekaligus jadi capek tangan + capek mata.

    Sekarang di mobile (layar < 768px) cukup 1 gesture: geser ke kanan. Status maju ke kolom berikutnya. Geser kiri = balik ke kolom sebelumnya. Card melayang keluar layar pas commit, lalu balik muncul di kolom baru.

    Fitur ini dirilis Mei 2026 atas request langsung dari Prof Michael (workspace ESR Bhalada), yang bilang "harus ketuk Back, masuk To Do, pilih Task, Update Task, itu sangat effort dan kurang efisien". Kami setuju, jadi langsung kami kerjakan.

    • Fitur ini cuma aktif di mobile (≤768px). Di desktop, lo tetep punya drag-and-drop kanban (geser horizontal antar kolom dengan mouse).
    • Pertama kali buka task board di mobile, ada banner tip muncul di bawah ngajarin gesture-nya. Banner auto-hilang 8 detik atau klik X.
  2. 2

    Cara pakai: geser kanan untuk maju status

    Buka project di mobile → masuk view Kanban → cari task di kolom To Do.

    1. Sentuh kartu task pakai 1 jari
    2. Geser ke kanan (ke arah jam 3)
    3. Begitu lo geser >40% lebar kartu, background hijau muncul + icon ✓ + tulisan label status target (mis. "→ DIKERJAKAN")
    4. Saat HP getar ringan (haptic feedback), lo udah aman buat lepas
    5. Lepas jari → kartu melayang keluar layar ke kanan → status update ke server → kartu balik muncul di kolom Dikerjakan

    Kalau geser-nya kurang jauh (< 40% lebar kartu), kartu snap back ke posisi semula. Aman, gak salah commit.

    • Threshold-nya 40% lebar kartu, sekitar 120px di HP standar. Cukup ringan tapi gak gampang accidentally trigger pas scroll.
    • Kalau lo niatnya scroll vertical (atas/bawah), gerakan vertical-dominant otomatis di-detect → swipe horizontal dibatalkan. Scroll page tetep jalan normal.
    • Setiap status workflow project lo akan auto-detect, kalau project pakai custom workflow (mis. "Backlog → In Review → QA → Done"), swipe mengikuti urutan itu, bukan default todo/in_progress/done.
  3. 3

    Geser kiri untuk balikin status

    Salah klik tadi? Geser kartu ke kiri:

    1. Sentuh kartu (mis. yang udah di kolom Dikerjakan)
    2. Geser ke kiri (ke arah jam 9)
    3. Background oranye muncul + tulisan "← TO DO" + icon panah balik
    4. HP getar saat threshold tercapai
    5. Lepas → kartu pindah balik ke kolom sebelumnya

    Mekanisme sama persis kayak geser kanan, cuma arah-nya berlawanan + warna beda biar gampang dibedain visually. Hijau = maju, oranye = mundur.

    Kalau task udah di status terakhir (Selesai), geser kanan gak akan ngapa-ngapain, kartu cuma gerak 30% jaraknya buat ngasih hint "udah end of line". Sama untuk task di status pertama (To Do) → geser kiri di-resistance juga.
  4. 4

    Yang gak ke-trigger swipe (intentional)

    Swipe gesture punya beberapa skenario yang sengaja kami exclude supaya gak ganggu interaksi lain:

    1. Tap di tombol / link / dropdown dalam kartu, Lo bisa langsung tap avatar, dropdown menu, atau title task untuk buka detail. Swipe handler check target.closest("button, a, input") di awal touchstart, kalau hit elemen interaktif → skip swipe.

    2. Tap singkat (gak geser), Sentuh kartu lalu lepas tanpa gerakan = native click event → opens task detail page seperti biasa.

    3. Scroll vertikal, Begitu kami detect gerakan dominan ke atas/bawah > 8px, swipe di-cancel di sana. Page tetep bisa scroll dengan fluid.

    4. Long-press (hold tanpa gerak), Drag-and-drop kami disable di mobile (delay sensor 99 detik), jadi long-press juga gak akan trigger reorder atau drag.

    • Kalau lo mau benerin urutan task dalam 1 kolom (reorder), buka detail task → set field "Priority". Drag-reorder cuma di desktop sekarang.
  5. 5

    Apa yang terjadi di belakang layar

    Begitu lo lepas jari past threshold, ini step-by-step technical-nya:

    1. Optimistic update, Card visual langsung pindah ke kolom baru tanpa nunggu server respond. UI feels instant.
    2. API PATCH ke /api/v1/tasks/:id dengan body { status: "in_progress" } (atau status target lainnya).
    3. Activity log auto-created: "Status diubah dari To Do ke Dikerjakan oleh [nama lo] via mobile swipe".
    4. Realtime broadcast ke semua member project, kalau ada owner/PM yang buka project di laptop, kartunya juga geser sendiri.
    5. Automation trigger, Kalau project punya automation rule "ketika status = Dikerjakan, kirim notif Slack", rule itu auto-execute setelah update sukses.

    Kalau API gagal (network drop, server error): card balik ke kolom asal tanpa toast spam. Lo bisa coba lagi.

  6. 6

    Aksesibilitas (reduced-motion + workflow custom)

    Kami respect setting iOS/Android "Reduce Motion". Kalau user enable, animasi melayang dimatikan → card cuma snap berpindah kolom instant, gak ada spring physics.

    Untuk custom workflow (project pakai status non-default lewat Pengaturan → Workflow), urutan swipe ngikutin definition urutan status di sana. Misal workflow lo: Backlog → Spec → Build → Review → Ship. Maka:

    • Card di Backlog: geser kanan → Spec, geser kiri → no-op (paling kiri)
    • Card di Build: geser kanan → Review, geser kiri → Spec
    • Card di Ship: geser kanan → no-op, geser kiri → Review

    Swipe maju 1 step per gesture, bukan jump ke akhir. Kalau lo mau ke status non-adjacent, buka detail task + pilih dropdown manual.

    • Setting reduced-motion: iOS → Settings → Accessibility → Motion → Reduce Motion. Android → Settings → Accessibility → Remove animations.
  7. 7

    Troubleshooting

    Q: Swipe gak nge-trigger sama sekali, kartu cuma gerak dikit lalu balik.
    A: Kemungkinan: (1) Lo geser kurang dari 40% lebar kartu, coba geser lebih panjang, sampai background warna full kelihatan. (2) Lo lagi tap di tombol/dropdown dalam kartu, coba geser di area title atau body, bukan di icon avatar/menu.

    Q: Banner tip "geser kartu" gak muncul lagi setelah saya tutup.
    A: Itu disimpen di localStorage browser, sengaja shown sekali aja biar gak annoying. Kalau lo mau lihat lagi: clear browser data untuk app.satutim.id, atau buka DevTools → Application → Local Storage → hapus key satutim_swipe_hint_dismissed_v1.

    Q: Di desktop saya kok gak ada swipe? Saya pakai trackpad bisa pinch & scroll.
    A: By design, desktop punya drag-and-drop antar kolom (geser kartu pakai mouse) yang lebih powerful (bisa pindah multi-kolom sekaligus dengan visual feedback drag overlay). Swipe gesture cuma di-aktifin untuk viewport ≤768px karena di mobile DnD susah dipakai (jari nutupin layar).

    Q: Saya pakai iPad, viewport lebih besar dari 768px tapi tetap touch device. Bisa swipe?
    A: Saat ini iPad portrait (~768-1024px) ke-treat sebagai desktop, jadi dapet DnD bukan swipe. Kalau lo pengen swipe juga di iPad, kasih tau kami di /contact, kami bisa pindahin threshold ke 1024px atau detect touch capability via matchMedia("(pointer: coarse)") instead of width.

    Q: Setelah swipe sukses, kartu balik muncul di kolom lama (status gak tersimpan).
    A: Kalau ini terjadi: (1) Cek koneksi internet (network drop), refresh page lihat status sebenarnya. (2) Cek role lo di project, kalau lo Guest, mungkin gak punya permission ubah status. (3) Kalau persistent, screenshot + kirim ke /contact dengan info workspace name + task title.

  8. 8

    Use case real dari Prof Michael

    Prof Michael (ESR Bhalada workspace) butuh fitur ini karena workflow harian-nya:

    > "Tiap pagi gw buka SatuTim di HP cek tasks yang harus dikerjain hari ini. Biasanya ada 8-15 task. Yang lama udah selesai semalem, gw mau mark Done. Yang masih on-going dari kemarin, gw advance ke Review. Yang baru jadi prioritas hari ini, gw pindah dari Backlog ke To Do. Sebelumnya tiap 1 task = 4-5 tap. Total tiap pagi 50-60 tap cuma buat sort task. Sekarang 1 swipe per task = total ~15 swipe. Cepet banget."

    Kalkulasi efisiensi: ~75% reduction in taps per status update. Bukan saving micro, ini real ergonomic improvement buat power user yang manage banyak task harian.

    Kalau lo punya pain point UX serupa di feature SatuTim manapun, kirim feedback via Pengaturan → Bug Report atau email langsung halo@satutim.id. Kami baca semua + prioritize berdasarkan dampak.

    • Fitur swipe juga eligible buat: brief list (geser brief untuk archive), discussion topic (geser untuk pin/unpin). Belum di-ship tapi sedang di-evaluate. Vote di Roadmap kalau lo mau prioritized.