JSON Template Structure for GPT-Image2: Complete Schema and Examples
GPT-Image2 utilizes a hierarchical JSON template structure with standardized fields including type, platform, layout, style, content, and constraints to convert structured data into high-fidelity image generation prompts.
The freestylefly/awesome-gpt-image-2 repository defines a machine-readable schema that replaces ambiguous text prompts with explicit JSON objects. Understanding the JSON template structure for GPT-Image2 enables developers to produce consistent, high-quality visuals across UI screenshots, infographics, and character concept art by encoding every visual attribute as a discrete key-value pair.
Core Schema Components
The JSON template follows a strict hierarchy designed to eliminate ambiguity. Each template is a self-contained object where all necessary details for the image are expressed internally, allowing the backend pipeline to convert the structured data into natural-language prompts for the image model.
The Type Field
The type field specifies the overall category of the image and determines which additional fields are expected. Common values include UI Screenshot, Infographic, and Character Concept Art. According to the source code in docs/templates.md, different type values trigger different sub-object requirements—for example, UI Screenshot uses layout and style objects, while Infographic relies on structure and audience fields.
Platform, Space, and Subject Fields
These fields indicate the target context:
platform: Specifies the technical environment (e.g.,"iOS","Android","Web")spaceorsubject: Defines the thematic domain (e.g.,"Fitness App","Urban Metabolism")
Layout and Composition
The layout field describes visual arrangement, aspect ratio, and camera angles. For interface design, this might specify "Card-based feed with bottom tab bar" or "9:16 aspect ratio". The composition key serves a similar role for artistic outputs, defining spatial relationships between elements.
Style Configuration
The style object groups visual aesthetic details into a nested structure:
theme:"Dark Mode","Light Mode","Cyberpunk"primary_color: Hex codes or named colors like"Neon Green"typography: Font classifications such as"Clean sans-serif"aesthetic: High-level descriptors like"Scientific atlas"
For reusable style tokens, the repository maintains data/style-library.json, a JSON catalogue of predefined style values that templates can reference.
Content Objects
The content field holds an object or array describing core elements that must appear in the final image. For UI templates, this includes header strings and cards arrays with title/data/button properties. For character art, this contains appearance and attire descriptors.
Constraints for Quality Control
The constraints string establishes hard limits the model must obey, such as "High fidelity, readable text, 9:16 aspect ratio" or "No cyberpunk, no gibberish text, strict structural layout". Including readability constraints like "文字必须绝对可读" (text must be absolutely readable) prevents the generation of garbled or nonsensical text artifacts.
Implementation Files in the Repository
The template system is implemented across several key files in the freestylefly/awesome-gpt-image-2 codebase:
-
docs/templates.md: Contains the central collection of human-readable specifications and JSON template examples for every image category, including complete schemas for UI screenshots, infographics, and character concepts. -
data/style-library.json: Stores the canonical style tokens and color palettes that templates reference to ensure visual consistency across generations. -
src/main.jsx: The front-end React component that constructs and sends the JSON prompt object to the backend API endpoint. -
api/generate-image.js: The server-side handler that receives the JSON template, converts it into an optimized textual prompt, and calls the image generation model.
Complete Template Examples
UI Screenshot Template
This example from docs/templates.md demonstrates a mobile fitness application interface:
{
"type": "UI Screenshot",
"platform": "iOS",
"product": "Fitness App",
"layout": "Card‑based feed with bottom tab bar",
"style": {
"theme": "Dark Mode",
"primary_color": "Neon Green",
"typography": "Clean sans‑serif"
},
"content": {
"header": "Today's Activity",
"cards": [
{"title": "Running", "data": "5.2 km", "button": "Start"},
{"title": "Calories", "data": "340 kcal"}
]
},
"constraints": "High fidelity, readable text, 9:16 aspect ratio"
}
Infographic Template
Structured data visualization requires explicit structural definitions:
{
"type": "Infographic",
"topic": "Urban Metabolism",
"audience": "General Public",
"structure": {
"title_area": "城市生命系统图谱",
"layout": "Isometric cutaway, 12 numbered panels",
"modules": [
{"title": "能源", "icon": "lightning", "text": "Power flows"},
{"title": "水循环", "icon": "water_drop", "text": "Water flows"}
]
},
"style": {
"aesthetic": "Scientific atlas",
"colors": "Low saturation, color‑coded flows",
"background": "Light paper texture"
},
"constraints": "No cyberpunk, no gibberish text, strict structural layout"
}
Character Concept Art Template
Artistic generation uses descriptive fields for pose and environment:
{
"type": "Character Concept Art",
"character": {
"identity": "Cybernetic Bounty Hunter",
"appearance": "Short silver hair, glowing red synthetic left eye, athletic build",
"attire": "Tactical trench coat with neon piping, holding a plasma rifle"
},
"pose": "Dynamic action stance, looking over shoulder with a smirk",
"environment": "Rainy neon‑lit alleyway background (blurred)",
"style": "Concept art, sharp linework, vibrant cyberpunk palette"
}
Best Practices for Reliable Generation
To maximize output quality when constructing JSON templates for GPT-Image2, observe these principles as implemented in the repository's reference schemas:
-
Explicitness: Every visual attribute should be a separate key. Vague wording in the JSON leads to inconsistent results, whereas discrete keys for
primary_color,typography, andbackgroundproduce predictable outputs. -
Readability Constraints: Always include explicit constraints regarding text legibility, especially for UI screenshots and infographics where textual content must remain crisp and readable.
-
Type-Driven Field Selection: Tailor the sub-objects to match the
typefield value. AUI Screenshotrequiresplatformandproductidentifiers, whileCharacter Concept Artrequiresposeandenvironmentdescriptors.
Summary
- The JSON template structure for GPT-Image2 uses a hierarchical object with required fields:
type,layout/composition,style,content, andconstraints. - Type-specific fields vary by category—UI templates use
platformandproduct, while infographics usetopicandstructure. - Implementation spans
docs/templates.md(schema definitions),data/style-library.json(style tokens),src/main.jsx(frontend submission), andapi/generate-image.js(backend prompt conversion). - Constraints strings enforce critical quality controls like aspect ratios, color restrictions, and text readability requirements.
- Explicit key-value pairs significantly improve generation consistency compared to free-form text prompts.
Frequently Asked Questions
What are the required fields in a GPT-Image2 JSON template?
Every template must include the type field to categorize the image, a style object defining visual aesthetics, a content object describing elements to render, and a constraints string specifying quality limitations. Additional fields like platform, layout, or environment are required only for specific image types as defined in docs/templates.md.
How does the backend convert JSON templates into images?
The server-side handler in api/generate-image.js receives the JSON payload from the frontend (src/main.jsx), parses the structured data into an optimized natural-language prompt, and transmits that prompt to the image generation model. The JSON structure ensures all visual parameters are explicitly defined before prompt serialization occurs.
Why is the constraints field important for UI screenshots?
The constraints field prevents common generation failures such as illegible text, incorrect aspect ratios, or unwanted stylistic elements. For interface designs, including constraints like "High fidelity, readable text, 9:16 aspect ratio" or Chinese readability requirements ensures the generated screenshots remain functional and visually coherent.
Can I use predefined styles instead of defining colors manually?
Yes. The repository includes data/style-library.json, which contains a catalogue of predefined style tokens including color palettes, typography classifications, and aesthetic descriptors. Templates can reference these standardized values to maintain consistency across multiple image generations and team members.
Have a question about this repo?
These articles cover the highlights, but your codebase questions are specific. Give your agent direct access to the source. Share this with your agent to get started:
curl -s "https://instagit.com/install.md" Maintain an open-source project? Get it listed too →