AI Game UI

AI Game UI

Generate game UI elements, HUD designs, and menu screens using each::sense — the intelligent AI agent that automatically selects the best model for your request.

Quick Start

Requires an each::labs API key. Get one at eachlabs.ai.

Using curl

curl -X POST https://eachsense-agent.core.eachlabs.run/v1/chat/completions \
  -H "Content-Type: application/json" \
  -H "X-API-Key: $EACHLABS_API_KEY" \
  -d '{
    "messages": [
      {
        "role": "user",
        "content": "Design a fantasy RPG game HUD overlay: health bar in red with an ornate gold frame in the top-left, mana bar in blue below it, a circular minimap in the top-right with a stone border, a row of 6 skill slots along the bottom center with gem-encrusted frames, and a gold coin counter. Dark transparent overlay style, 16:9 aspect ratio, game UI design."
      }
    ],
    "stream": false
  }'

Using Python (OpenAI SDK)

from openai import OpenAI

client = OpenAI(
    api_key="YOUR_EACHLABS_API_KEY",
    base_url="https://eachsense-agent.core.eachlabs.run/v1"
)

response = client.chat.completions.create(
    model="eachsense/beta",
    messages=[{
        "role": "user",
        "content": "Design a fantasy RPG game HUD overlay: health bar in red with an ornate gold frame in the top-left, mana bar in blue below it, a circular minimap in the top-right with a stone border, a row of 6 skill slots along the bottom center with gem-encrusted frames, and a gold coin counter. Dark transparent overlay style, 16:9 aspect ratio, game UI design."
    }]
)

print(response.choices[0].message.content)

With Reference Image

Match the UI style of an existing game:

curl -X POST https://eachsense-agent.core.eachlabs.run/v1/chat/completions \
  -H "Content-Type: application/json" \
  -H "X-API-Key: $EACHLABS_API_KEY" \
  -d '{
    "messages": [
      {
        "role": "user",
        "content": [
              {"type": "text", "text": "Design a game settings menu screen matching the UI style of this reference. Include: volume slider, graphics quality dropdown, control remapping section, and save/cancel buttons. Same visual theme, border style, and color palette as the reference."},
              {"type": "image_url", "image_url": {"url": "https://example.com/existing-game-ui.png"}}
            ]
          }
    ],
    "stream": false
  }'

Images are sent inside messages using the OpenAI multimodal content format. Maximum 4 images per request.

Streaming

Set "stream": true for real-time SSE responses, or "stream": false for complete result in a single response. Streaming is useful for showing progress in UIs; non-streaming is simpler for scripts and automation.

UI Element Categories

UI Style Reference

Examples

Sci-Fi Shooter HUD

curl -X POST https://eachsense-agent.core.eachlabs.run/v1/chat/completions \
  -H "Content-Type: application/json" \
  -H "X-API-Key: $EACHLABS_API_KEY" \
  -d '{
    "messages": [
      {
        "role": "user",
        "content": "Design a sci-fi FPS game HUD: holographic transparent elements, a circular crosshair in the center, health and shield bars in the bottom-left as thin horizontal neon lines (green for health, blue for shield), ammo counter in the bottom-right showing 24/120 in a digital font, a radar minimap in the top-right corner with a hex-grid pattern, and a subtle compass bar along the top edge. Cyan and white color scheme on transparent dark background, 16:9, futuristic military UI."
      }
    ],
    "stream": false
  }'

Mobile Game Main Menu

curl -X POST https://eachsense-agent.core.eachlabs.run/v1/chat/completions \
  -H "Content-Type: application/json" \
  -H "X-API-Key: $EACHLABS_API_KEY" \
  -d '{
    "messages": [
      {
        "role": "user",
        "content": "Design a main menu screen for a casual mobile puzzle game. Bright cheerful background with soft clouds and a rainbow. Large round Play button in green at the center, smaller round buttons for Settings (gear icon), Leaderboard (trophy), and Shop (cart) arranged below in a row. Game title area at the top. Cartoon style with thick outlines, glossy button effects, 9:16 portrait mobile format."
      }
    ],
    "stream": false
  }'

RPG Inventory Panel

curl -X POST https://eachsense-agent.core.eachlabs.run/v1/chat/completions \
  -H "Content-Type: application/json" \
  -H "X-API-Key: $EACHLABS_API_KEY" \
  -d '{
    "messages": [
      {
        "role": "user",
        "content": "Design an RPG inventory screen UI: a central character silhouette with 6 equipment slots around it (head, chest, legs, weapon, shield, ring), a 5x4 grid of inventory bag slots on the right side, character stats panel on the left showing STR, DEX, INT, VIT with numerical values, and a gold/weight counter at the bottom. Medieval parchment and dark wood theme with iron rivets, warm candlelit ambiance, 16:9 game UI design."
      }
    ],
    "stream": false
  }'

Dialog System

curl -X POST https://eachsense-agent.core.eachlabs.run/v1/chat/completions \
  -H "Content-Type: application/json" \
  -H "X-API-Key: $EACHLABS_API_KEY" \
  -d '{
    "messages": [
      {
        "role": "user",
        "content": "Design a game dialog box UI for a visual novel: a semi-transparent dark panel spanning the bottom third of the screen, a character name tag in an accent-colored tab on the upper-left of the panel, placeholder text lines for dialog, a small character portrait frame on the left edge, and a flashing triangle indicator in the bottom-right to advance text. Three choice buttons stacked on the right side. Clean anime-style UI with soft rounded corners, pastel accent colors, 16:9 format."
      }
    ],
    "stream": false
  }'

Batch Workflow: Complete UI Kit

STYLE="fantasy RPG, ornate gold and stone borders, parchment texture, warm tones, game UI design"

ELEMENTS=(
  "Main menu screen: title area, Play button, Options button, Credits button, dark castle background"
  "HUD overlay: health bar top-left, mana bar below health, minimap top-right, 6 action slots bottom center, 16:9"
  "Inventory panel: 6x5 item grid, equipment slots, character stats, gold counter, close button"
  "Dialog box: bottom panel with character portrait frame, name tag, text area, choice buttons"
  "Pause menu: centered panel with Resume, Settings, Save, Quit buttons, blurred background overlay"
  "Loading screen: full screen with ornate progress bar at bottom, tip text area, background illustration frame"
)

for ELEMENT in "${ELEMENTS[@]}"; do
  curl -X POST https://eachsense-agent.core.eachlabs.run/v1/chat/completions \
    -H "Content-Type: application/json" \
    -H "X-API-Key: $EACHLABS_API_KEY" \
    -d "{
      \"messages\": [{\"role\": \"user\", \"content\": \"Design a game $ELEMENT. $STYLE\"}],
      \"stream\": false
    }"
  echo "---"
done

Common Pitfalls

• Text rendering is unreliable in AI images. UI text will appear garbled. Use the generated image as a visual layout reference and add real text programmatically.
• Aspect ratio mismatch — specify 16:9 for PC/console, 9:16 for mobile portrait, or 4:3 for tablets.
• Too many elements in one image become cluttered and small. Focus on one screen or panel at a time.
• Ignoring readability — high-contrast elements on semi-transparent backgrounds work best. Specify contrast.
• Inconsistent style across screens — use the same style description for every UI element in the kit.

Related Skills

• AI Game Asset — Icons for inventory and abilities
• AI Character Design — Character portraits for UI
• AI Game Environment — Background art for menus
• AI Sprite Generator — Animated UI elements

Related Models

• flux-2-max — Highest quality image generation
• seedream-v4-5 — Creative and artistic styles
• nano-banana-pro — Fast iterations

Documentation

• each::sense Overview
• each::labs API