Made with GPT Image 2 · CC0 · 2 Sept 2026

Design a 2D game HUD (heads-up

Generated with prompt: Design a 2D game HUD (heads-up display) for a survival game, landscape orientation, 16:9 aspect ratio. Add black letterbox bars on top and bottom to simulate 16:9. This is a UI/UX layout brief: follow the exact content and positioning described below. Do not invent additional UI elements. Do not apply any particular art style unless one is specified elsewhere in the prompt — focus entirely on what is present and where. BACKGROUND Full-bleed outdoor wilderness scene (open grassland with a dirt path, scattered rocks, distant tree line, overcast sky) fills the entire canvas edge to edge. No border, frame, or letterboxing around it — every UI element below sits as an overlay on top of this scene, not inside a separate panel carved out of it. TOP-LEFT: VITALS STRIP A single horizontal row of 5 compact stat readouts, positioned in the top-left corner with a small margin from both edges. Each of the 5 readouts is a tight cluster of: one small icon, one short horizontal progress bar, one number (0-100). The 5 stats, in order: Hunger, Thirst, Warmth, Fatigue, Health. The whole strip is compact — its total height should be no more than roughly 8% of the canvas height. Do not stack these vertically; they read left to right in one line. TOP-CENTER: MODE TABS Two toggle-style tabs, horizontally centered near the top of the screen: "Shelter" and "Construction". These look like tabs or a segmented control, visually distinct from the vitals strip and from the icon dock described below — they switch what the main view shows, they do not open a separate window. TOP-RIGHT: SYSTEM CONTROLS Two small icon buttons in the top-right corner: a gear icon (Settings) and a close/menu icon (Escape). Small and unobtrusive — the least visually prominent elements on screen. LEFT EDGE: NAVIGATION DOCK A vertical column of 5 icon-only buttons (no text labels visible by default), centered vertically along the left edge of the screen. Each icon represents one destination: a folded map (Map), a book or journal (Journal), a backpack (Inventory), a flask or beaker (Experiment), a hammer and wrench (Crafting). This dock is narrow — icons only, not full-width buttons with text. BOTTOM-CENTER: ACTION AND CAPTION CLUSTER A single grouped cluster, horizontally centered near the bottom of the screen, containing (top to bottom within the cluster): 1. One line of short descriptive text (example: "Open, unremarkable ground. A road passes through.") — a caption, not a full-width bar. 2. A row of 1-3 action buttons with short text labels (examples: "Gather Flint", "Gather Stone", "Hunt Rabbit"). 3. One additional button, visually grouped with the others but slightly set apart: "Wait 1 Hour". This entire cluster is compact and only as wide as its contents require — it does not stretch across the full width of the screen, and it does not form a continuous bar along the bottom edge. WHAT TO AVOID No full-height sidebar panel. No full-width bar spanning the bottom of the screen. No boxed-in inset for the background scene — it must fill the entire canvas. No nav buttons with both an icon AND a text label side by side — the nav dock is icon-only.