# Mobile Responsive Evidence Matrix

이 문서는 `#493` 전 role shell·핵심 child surface 반응형 evidence 보강의 추적 기준이다. `artifacts/mobile/**`는 git 추적 대상이 아니므로, 실제 screenshot은 local review artifact이고 이 문서가 capture 범위와 판정 기준의 source-of-truth다.

## Capture Protocol

검수용 primary actual screenshot은 red box/E-label overlay 없는 clean ADB capture를 사용한다.

responsive screenshot helper는 현재 device 화면을 그대로 캡처한다. 화면 이동, Metro/dev-client warm-up, Android font/display 변경을 대신 수행하지 않는다. 따라서 capture 전에는 대상 route를 deep link 또는 Maestro/agent-device 조작으로 실제로 열고, 필요하면 font/display 변경 후 app을 relaunch한다.

```bash
adb -s emulator-5554 shell am start -W -a android.intent.action.VIEW -d "zerro://role/emitter" com.bootalk_appdev.zerro
sleep 5
pnpm --filter @zerro/mobile e2e:agent-device:responsive:screenshot -- emitter-home --device emulator-5554

pnpm --filter @zerro/mobile android:font-scale -- set 1.3 --device emulator-5554
adb -s emulator-5554 reverse tcp:8081 tcp:8081
adb -s emulator-5554 shell am force-stop com.bootalk_appdev.zerro
adb -s emulator-5554 shell am start -W -a android.intent.action.VIEW \
  -d "zerro://expo-development-client/?url=http%3A%2F%2F127.0.0.1%3A8081" \
  com.bootalk_appdev.zerro
sleep 5
adb -s emulator-5554 shell am start -W -a android.intent.action.VIEW -d "zerro://role/emitter" com.bootalk_appdev.zerro
sleep 5
pnpm --filter @zerro/mobile e2e:agent-device:responsive:screenshot -- emitter-home 1.3 --device emulator-5554
```

위 명령은 기본적으로 `artifacts/mobile/agent-device/responsive/<screen>-w<width>dp-font-<scale>.png`에 clean screenshot을 저장한다.

selector/ref 위치를 설명해야 할 때만 debug overlay를 명시한다.

```bash
pnpm --filter @zerro/mobile e2e:agent-device:responsive:screenshot -- emitter-home 1.3 --device emulator-5554 --debug-overlay
```

debug overlay artifact는 `<screen>-w<width>dp-font-<scale>-selector-debug-overlay.png` 형식으로 저장하며, helper가 `--device` 값을 `ANDROID_SERIAL`로 전달해 clean capture와 같은 device에서 수집한다. 이 artifact는 UX index/Figma 비교/PR 보고의 primary actual screenshot으로 쓰지 않는다.

## Device Profiles

| Profile | Width | Font scale | 목적 | Required |
|---|---:|---:|---|---|
| baseline | current emulator | `1.0` | 현재 개발 기준 화면 확인 | Yes |
| font-large | current emulator | `1.3` | Android 사용자 글꼴 확대 회귀 확인 | Yes |
| narrow | `360dp` 또는 `375dp` | `1.0` | Figma 375px frame을 고정폭으로 오해한 회귀 확인 | Yes |
| narrow-font-large | `360dp` 또는 `375dp` | `1.3` | text clipping, CTA overflow, bottom safe-area 확인 | Recommended |
| wide | `412dp` | `1.0` | 카드/리스트 stretch와 role shell density 확인 | Recommended |

display override를 사용했다면 반드시 복구한다.

```bash
pnpm --filter @zerro/mobile android:display -- reset
pnpm --filter @zerro/mobile android:font-scale -- restore --device emulator-5554
```

## Target Surface Matrix

| Surface | Route / entry | Evidence target | Current #493 state |
|---|---|---|---|
| onboarding | app launch / role select | role CTA clipping, role confusion, bottom gesture area | role-shell evidence captured |
| emitter-home | `/role/emitter` | summary cards, request CTA, bottom tab safe-area | role-shell evidence captured |
| emitter-notifications | emitter home notification CTA / bottom notification tab | read-state summary, filter density, notification row wrapping, bottom tab safe-area | font-large evidence captured |
| emitter-more | emitter hamburger / bottom more tab | menu row density, secondary copy wrapping, provider CTA visibility, bottom tab safe-area | font-large evidence captured |
| dispatcher-home | `/role/dispatcher` | role shell, unassigned dispatch summary, bottom tab safe-area | role-shell evidence captured |
| driver-home | `/role/driver` | 3-tab current contract, schedule CTA, no chat/more leakage | role-shell evidence captured |
| processor-home | `/role/processor` | role shell, inbound/weighing CTA, bottom tab safe-area | role-shell evidence captured |
| dispatcher-dispatch | dispatcher dispatch CTA | list/card density, sheet/modal clipping | font-large evidence captured |
| driver-confirm | driver assignment confirm | modal/sheet fit, CTA visibility, Android Back recoverability | font-large evidence captured |
| driver-dispatch-schedule | driver today schedule tab | schedule row density, route/proof CTA wrapping | font-large evidence captured |
| driver-dispatch-sheet | driver dispatch sheet tab | table/card horizontal fit, bottom action safe-area | font-large evidence captured |
| emitter-request | emitter request wizard | wizard step CTA, search/result/complete responsive fit | font-large evidence captured |
| emitter-history | emitter history/detail | list/filter/detail safe-area and text wrapping | font-large evidence captured |
| emitter-chat | emitter chat tab | message list, room preview, unread badge, bottom tab safe-area | font-large evidence captured |
| processor-inbound | processor inbound/detail/report | #489 closure 기준 list/filter/detail/report density | font-large evidence captured |
| processor-weighing | processor weighing/OCR | #489 closure 기준 OCR/provider-pending/offline/retry fit | font-large evidence captured |
| common-chat | emitter/dispatcher/processor chat | #489 closure 기준 room/contact sheet/attachment/read-state fit | font-large evidence captured |

## 2026-07-03 Step B Role Shell Capture

`#493` Step B는 APP code 변경 없이 role shell 5개 surface를 clean ADB screenshot으로 캡처했다. 검수용 actual은 `agent-device --overlay-refs` 또는 debug overlay를 쓰지 않았으므로 red box/E-label이 보이지 않는 화면을 기준으로 한다.

| Surface | Baseline `w411dp/font 1.0` | Font-large `w411dp/font 1.3` | Narrow `w375dp/font 1.0` | 판정 |
|---|---|---|---|---|
| onboarding | `artifacts/mobile/agent-device/responsive/onboarding-w411dp-font-1-0.png` | `artifacts/mobile/agent-device/responsive/onboarding-w411dp-font-1-3.png` | `artifacts/mobile/agent-device/responsive/onboarding-w375dp-font-1-0.png` | pass |
| emitter-home | `artifacts/mobile/agent-device/responsive/emitter-home-w411dp-font-1-0.png` | `artifacts/mobile/agent-device/responsive/emitter-home-w411dp-font-1-3.png` | `artifacts/mobile/agent-device/responsive/emitter-home-w375dp-font-1-0.png` | pass |
| dispatcher-home | `artifacts/mobile/agent-device/responsive/dispatcher-home-w411dp-font-1-0.png` | `artifacts/mobile/agent-device/responsive/dispatcher-home-w411dp-font-1-3.png` | `artifacts/mobile/agent-device/responsive/dispatcher-home-w375dp-font-1-0.png` | pass |
| driver-home | `artifacts/mobile/agent-device/responsive/driver-home-w411dp-font-1-0.png` | `artifacts/mobile/agent-device/responsive/driver-home-w411dp-font-1-3.png` | `artifacts/mobile/agent-device/responsive/driver-home-w375dp-font-1-0.png` | pass |
| processor-home | `artifacts/mobile/agent-device/responsive/processor-home-w411dp-font-1-0.png` | `artifacts/mobile/agent-device/responsive/processor-home-w411dp-font-1-3.png` | `artifacts/mobile/agent-device/responsive/processor-home-w375dp-font-1-0.png` | pass |

Local review HTML은 `artifacts/mobile/ux-flow/responsive-role-shell/index.html`에서 5개 surface와 3개 profile을 나란히 보여준다. `artifacts/mobile/**`는 git 추적 대상이 아니므로 이 표가 capture 범위의 tracked source-of-truth다.

이번 세션에서 Maestro `role-shell-coverage`는 Metro/dev-client interruption 이후 재시도 중 hang이 발생해 Step B의 pass evidence로 쓰지 않는다. Route/function coverage는 기존 `role-routing`, `role-shell-coverage` flow가 담당하고, Step B는 width/font-scale visual evidence 보강으로 한정한다.

## 2026-07-03 Step C Emitter Child Font-Large Capture

`#493` Step C는 배출자 child surface 중 알림, 채팅, 더보기를 font-large profile에서 clean ADB screenshot으로 다시 캡처했다. 이전 local responsive artifact는 red box/E-label overlay가 섞여 있어 selector/debug proof로만 보고, 아래 3개 파일을 primary responsive actual로 사용한다.

| Surface | Font-large `w411dp/font 1.3` | 판정 | 메모 |
|---|---|---|---|
| emitter-notifications | `artifacts/mobile/agent-device/responsive/emitter-notifications-w411dp-font-1-3.png` | pass | read-state summary, filter, notification rows, bottom tab이 font scale 1.3에서 겹치지 않는다. |
| emitter-chat | `artifacts/mobile/agent-device/responsive/emitter-chat-w411dp-font-1-3.png` | pass | room list preview는 의도된 ellipsis로 줄임 처리되며 unread badge와 bottom tab이 유지된다. |
| emitter-more | `artifacts/mobile/agent-device/responsive/emitter-more-w411dp-font-1-3.png` | pass | menu row, secondary copy, provider CTA, bottom tab이 font scale 1.3에서 사용 가능하다. |

Local review HTML은 `artifacts/mobile/ux-flow/responsive-role-shell/index.html`에서 role shell section 아래 `Step C Emitter Child Surfaces`로 함께 확인한다. `artifacts/mobile/**`는 git 추적 대상이 아니므로 이 표가 capture 범위의 tracked source-of-truth다.

## 2026-07-03 Step D Remaining Child Font-Large Capture

`#493` Step D는 Step B/C 이후 남은 핵심 child surface 9개를 font-large profile에서 clean ADB screenshot으로 캡처했다. 각 화면은 direct route가 아니라 실제 role home의 CTA/tab에서 진입한 뒤 저장했다. `processor-inbound`는 같은 `/role/processor` 내부 surface state가 deep link로 초기화되지 않는 특성이 있어 화면 back CTA로 홈 복귀 후 계근 화면을 이어서 검증했다.

| Surface | Entry proof | Font-large `w411dp/font 1.3` | 판정 |
|---|---|---|---|
| dispatcher-dispatch | `dispatcher.home.dispatch.cta` | `artifacts/mobile/agent-device/responsive/dispatcher-dispatch-w411dp-font-1-3.png` | pass |
| driver-confirm | `driver.home.dispatch-confirm.cta` | `artifacts/mobile/agent-device/responsive/driver-confirm-w411dp-font-1-3.png` | pass |
| driver-dispatch-schedule | `driver.home.start-transport.cta` | `artifacts/mobile/agent-device/responsive/driver-dispatch-schedule-w411dp-font-1-3.png` | pass |
| driver-dispatch-sheet | `driver.bottom.dispatch-sheet.tab` | `artifacts/mobile/agent-device/responsive/driver-dispatch-sheet-w411dp-font-1-3.png` | pass |
| emitter-request | `emitter.home.request-create.cta` | `artifacts/mobile/agent-device/responsive/emitter-request-w411dp-font-1-3.png` | pass |
| emitter-history | `emitter.home.history.cta` | `artifacts/mobile/agent-device/responsive/emitter-history-w411dp-font-1-3.png` | pass |
| processor-inbound | `processor.home.section-detail.cta` | `artifacts/mobile/agent-device/responsive/processor-inbound-w411dp-font-1-3.png` | pass |
| processor-weighing | `processor.home.weighing.cta` | `artifacts/mobile/agent-device/responsive/processor-weighing-w411dp-font-1-3.png` | pass |
| common-chat | `dispatcher.home.chat.cta` | `artifacts/mobile/agent-device/responsive/common-chat-w411dp-font-1-3.png` | pass |

이로써 `#493`의 tracked target surface는 모두 최소 font-large clean evidence를 가진다. Role shell 5개는 baseline/font-large/narrow 3-profile, child surface는 font-large profile 중심으로 닫는다. 향후 특정 child surface에서 narrow 회귀가 발견되면 이 문서의 Device Profiles 기준에 따라 targeted follow-up으로 확장한다.

## Pass / Gap Rules

- `pass`: clean screenshot shows no clipping, role leakage, bottom gesture overlap, impossible tap target, or unreadable text at the captured profile.
- `minor-gap`: visual issue exists but does not block basic use; create follow-up issue or PR note.
- `blocking-gap`: route/back/capture failure or UI unusable at a required profile; stop #493 capture and create implementation issue.
- `blocked-by-active-issue`: another active issue is changing the surface; do not capture stale evidence.

## Verification Gate

PRs that add responsive evidence must include:

- `pnpm --filter @zerro/mobile responsive:scan`
- `pnpm --filter @zerro/mobile check`
- related Maestro flow when route state is involved
- clean screenshot artifact paths with width/font profile
- `docs/MOBILE_UX_EVIDENCE_REGISTER.md` or `apps/mobile/e2e/TEST_COVERAGE_GRAPH.md` update when the coverage meaning changes