# Trust Me Bro — UI concept guide

## Scope

These are reviewable visual proposals for later manual implementation. No Unreal widgets, Blueprints, gameplay controls, collision, geometry, or logic were changed. `ui/index.html` is a standalone interactive concept viewer, not a playable game or an installed game interface.

The viewer provides main menu, pause, retry, and checkpoint states, arrow-key tab navigation, a settings dialog, preview brightness, and a reduced-motion toggle. Its start/resume actions show a visual checkpoint state and explicitly announce that no game has launched. The viewer never saves progress or communicates with Unreal.

## Deliverables

| File | Purpose |
|---|---|
| `ui/main-menu.svg` | 1920 × 1080 main-menu composition |
| `ui/pause-menu.svg` | 1920 × 1080 pause composition |
| `ui/retry-screen.svg` | 1920 × 1080 automatic-retry treatment |
| `ui/checkpoint-notification.svg` | 1920 × 1080 checkpoint toast composition |
| `ui/button-primary.svg` | Editable main action asset |
| `ui/button-secondary.svg` | Editable secondary action asset |
| `ui/concept-background.jpg` | Optimized authentic capture used behind UI studies |
| `brand/icon-*.svg` | Consistent exportable control icons |

The four scene SVG exports embed their background JPEG for standalone portability. They use live Arial/Helvetica lettering; convert to outlines in the final design tool if precise font portability is required.

## Main menu

The large “ONE MORE TRY?” treatment introduces persistence without insulting the player. Two visible actions keep the hierarchy clear. “Start run” and “Settings” are proposed interface labels. Use the game’s actual launch and settings routes when manually implementing; do not create unverified systems just to match the concept.

## Pause

“Take a breath.” provides a deliberate pause in an otherwise demanding game. One restrained glass surface carries the menu. Resume receives the strongest contrast. Pause functionality itself is a visual proposal here, not a verified claim about the current game. Confirm the project’s actual pause/input behavior before implementation.

## Retry

The inspected death-zone Blueprint displays a message, waits one second, respawns the character at the stored location, resets trap interfaces, and finishes retry. The proposed **MISSED IT. / Same jump. Better read.** treatment fits that existing flow. Do not extend the actual retry delay for the animation. The HTML viewer loops a decorative falling dot solely to make the concept easy to inspect; the in-game version should be a brief single transition.

No manual retry click is required by the proposed failure overlay. “Replay concept” is a review-viewer control, not intended game UI.

## Checkpoint

The actual checkpoint Blueprint stores the character’s respawn location and rotation on overlap. The proposed “A little progress. Kept.” toast acknowledges a checkpoint change, without adding progression percentages or claiming a new save system. Notify once on a newly reached checkpoint and suppress repeated overlap notifications. Persistent save behavior was not established and is not claimed.

## Manual UMG implementation notes

Use a full-screen Canvas Panel with Safe Zone support. Main menu text and actions should anchor left; pause should anchor center; checkpoint toast should anchor top right. Keep actual game HUD information away from the toast. Use scale rules and safe margins rather than absolute screen coordinates. SVG exports are composition references; rebuild text with native UMG text for localization and crisp rendering.

Use the palette in `BRAND_GUIDE.md`. Body text should remain readable over the brightest capture: retain a dark scrim or opaque surface. Glass blur is decorative; content must work without it. Avoid blurring the entire screen during active gameplay if it affects target visibility.

Keyboard/controller focus needs a persistent signal-color ring and a non-color cue. Preserve focus when opening/closing settings. Minimum interactive target should be 44 × 44 logical pixels in the final UI. Respect motion settings and avoid impact flashes. Keep copy short and supportive.

## Testing and limitations

The asset generator ran successfully; all SVG files are XML-parseable. Viewer source includes responsive layouts, visible focus indicators, native dialog behavior, ARIA tab state, arrow/Home/End navigation, and reduced-motion support. Browser rendering and input validation should be completed as part of the parent website QA. These concepts have not been imported into UMG or tested in the actual game.

Source artwork regeneration: run `brand/generate_assets.py` with Python and Pillow, then `brand/outline_logos.ps1` on Windows for font-independent branding. Both only write the brand/UI output folders and read the authentic screenshot; they never touch Unreal source files.