# Dzikir Display Mode UX Brief

## 1) Objective
Provide two complementary experiences for Dzikir:

- **Daftar (Baris)** for fast scanning and jumping between items.
- **Fokus (Slide)** for one-item focus with consistent thumb reach and counting flow.

This mode applies to all Dzikir tabs: **Pagi**, **Petang**, and **Sesudah Shalat**.

## 2) Settings Specification

Section name in Settings: **Tampilan Dzikir**

| Label | Type | Options | Default | Visibility |
|---|---|---|---|---|
| `Mode Tampilan Dzikir` | Segmented | `Daftar (Baris)` / `Fokus (Slide)` | `Daftar (Baris)` | Always |
| `Posisi Tombol Hitung` | Segmented | `Pill Bawah (Disarankan)` / `Bulat Kanan Bawah` | `Pill Bawah (Disarankan)` | Only in `Fokus (Slide)` |
| `Lanjut Otomatis Saat Target Tercapai` | Switch | `On/Off` | `On` | Only in `Fokus (Slide)` |
| `Getaran Saat Hitung` | Switch | `On/Off` | `On` | Always |

## 3) Interaction Rules

### A. Mode: Daftar (Baris)
- Keep current row-based list and per-row counter pattern.
- Users can scan, jump, and increment any row directly.
- Counter behavior remains per item, per day.

### B. Mode: Fokus (Slide)
- Display exactly **one dzikir item per slide**.
- Horizontal swipe moves between dzikir items.
- Counter button is fixed in one location (based on selected button position).
- Top area displays progress: `Item X dari Y`.
- Tapping counter increments by `+1` until target.
- When target reached:
  - Mark item as complete.
  - If `Lanjut Otomatis... = On`, move to next slide automatically (except last item).

## 4) Button Placement Recommendation

Primary recommendation:

- **Pill Bawah (Disarankan)** as default in Focus mode.

Reason:
- Better one-handed ergonomics.
- Consistent location improves counting rhythm.
- Larger tap target lowers miss taps while reciting.

Optional style:
- **Bulat Kanan Bawah** for users preferring minimal visual footprint.

## 5) Data & State Behavior

- Counter data is shared across modes (switching mode must not reset progress).
- Existing daily tracking logic remains unchanged.
- Switching mode keeps current tab (`Pagi/Petang/Sesudah Shalat`) intact.
- Completed state must be reflected identically in both modes.

## 6) Completion & Feedback UX

- Counter states: `normal` and `completed`.
- Completed label example: `Selesai`.
- Last item completion feedback:
  - Show subtle confirmation message: `Semua dzikir pada tab ini selesai`.
- Empty or missing data:
  - Show friendly empty state, never blank screen.

## 7) Default Product Decision

- App default: **Daftar (Baris)** for broad familiarity.
- Advanced/focus users can enable **Fokus (Slide)**.
- In Focus mode, default button placement: **Pill Bawah (Disarankan)**.

## 8) Success Criteria

- Users can switch between modes without losing count progress.
- Focus mode reduces hand travel for repeated taps.
- Both modes remain consistent across all Dzikir tabs.
- No behavioral mismatch between count target, completion state, and progress indicator.