Gacha Game UI Mockup

Documento original

GPT Image 2 · en

{
  "type": "Mobile game UI prototype",
  "theme": "Sci-fi, cute, glass-like, neon blue and purple color scheme",
  "header": {
    "status_bar": "Top standard iOS status bar",
    "top_controls": "The left side has a back button, and the right side displays a currency bar with a diamond icon and \"128\".",
    "title": "{argument name=\"main title\" default=\"Robot blind boxes\"}",
    "subtitle": "{argument name=\"subtitle\" default=\"Draw your lucky partner\"}"
  },
  "layout": {
    "side_menu": {
      "position": "The currency column is located to the right below.",
      "count": 2,
      "items": [
        {
          "icon": "gift",
          "label": "Prize pool"
        },
        {
          "icon": "document",
          "label": "Extract records"
        }
      ]
    },
    "centerpiece": {
      "description": "A transparent glass display case containing the grand prize.",
      "subject": "{argument name=\"robot character description\" default=\"A cute chibi-style robot with glowing blue eyes and glossy white armor.\"}",
      "case_details": [
        "The top left corner is marked \"NO.001\".",
        "The bottom right corner has a star-shaped sticker that says \"Rare Item Probability UP!\"",
        "The progress bar at the bottom displays the text \"Guaranteed rare item after 6 more draws\" and \"4/10\"."
      ]
    },
    "background_elements": {
      "description": "Blurry toy store background",
      "floating_items": {
        "count": 3,
        "description": "A square box with a robot face design and labeled \"BLIND BOX\", one of which has a \"?\" mark."
      }
    },
    "action_buttons": {
      "position": "Centered above the bottom navigation bar",
      "count": 2,
      "buttons": [
        {
          "color": "blue",
          "text": "{argument name=\"left button text\" default=\"One draw\"}",
          "cost": "x 30"
        },
        {
          "color": "purple",
          "text": "{argument name=\"right button text\" default=\"ten times\"}",
          "cost": "x 270",
          "tag": "10% off"
        }
      ]
    },
    "bottom_navigation": {
      "count": 4,
      "items": [
        {
          "icon": "home",
          "label": "Blind box",
          "state": "active"
        },
        {
          "icon": "store",
          "label": "Mall"
        },
        {
          "icon": "star",
          "label": "collect"
        },
        {
          "icon": "smiley",
          "label": "mine"
        }
      ]
    }
  }
}

Cómo usar

1. Copia el prompt original completo, incluidos los parámetros.
2. Adapta el tema, el texto y la composición a tus necesidades.
3. Usa una herramienta externa compatible; comprueba el acceso y el resultado.

Antes de empezar

• Comprueba si necesita una imagen de referencia. La compatibilidad no demuestra qué modelo generó el ejemplo.
• Revisa nombres, cifras y textos; el resultado puede variar entre versiones del modelo.