Screens & States

A complete view of all screens the user may encounter during the Selfie Capture experience. Each state includes a brief description and a direct link to its source in Figma.

Open Full Screen and Specs in Figma
Source of truth for layout, visual specs, interactions, and platform variations..

---

Tutorial

Pre-capture instructional screen introducing the selfie step. Includes illustration/video and clear guidance before the camera opens.

Permission Screens

Shown when camera permissions have not been granted. Includes pre-permission context, OS-specific instructions, and fallback steps if the system dialog is dismissed.

Auto Capture

Automatic capture triggers when face alignment, lighting, and detection thresholds are met. This is the primary and recommended capture method.

Manual Capture (Fallback)

Fallback option shown after a period of inactivity (default: 30 seconds) or when auto-capture cannot confidently detect a valid frame. Users can take the photo manually.

Feedback Messages (Real-Time Guidance)

Real-time, contextual guidance displayed while the camera is active. Helps users correct lighting, distance, positioning, and visibility issues to ensure a valid capture.

Uploading

Displayed while the captured selfie is uploaded and prepared for server-side validation. Prevents users from interacting until upload is complete.

Success

Shown when the selfie passes validation. The user can proceed to the next verification step without additional input.

Retry Errors

Displayed when validation fails but attempts remain. Provides specific corrective guidance and a retry CTA. Attempts reset after a successful capture.

Final Errors (No Attempts Remaining)

Shown when all capture attempts have been used. The selfie is submitted for manual review, and the user may continue to the next step.

Connection Error

Displays when connectivity is lost during capture or upload. Users can retry once a stable connection is restored.