# How the Prompt Template Schema System Works in awesome-gpt-image-2

> Learn how the prompt template schema system in awesome-gpt-image-2 converts descriptions into API prompts using JSON schemas and dynamic substitutions. Unlock efficient image generation.

- Repository: [苍何/awesome-gpt-image-2](https://github.com/freestylefly/awesome-gpt-image-2)
- Tags: deep-dive
- Published: 2026-09-11

---

**The prompt template schema system converts high-level image generation descriptions into concrete GPT-Image 2 API prompts by defining a JSON schema with variable placeholders, loading templates from a central style library, and dynamically substituting user values into formatted prompt strings.**

The **prompt template schema system** is the architectural backbone of the freestylefly/awesome-gpt-image-2 repository, transforming abstract creative directions into structured API calls for OpenAI's GPT-Image 2 model. This system standardizes how image generation requests are constructed through reusable templates that support dynamic variable substitution and localization.

## Schema Definition and Structure

The schema definition resides in [`docs/templates.md`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/docs/templates.md) and establishes the contract for all valid prompt templates. Each template object must conform to a specific JSON-like structure with five required fields:

- **`title`** – A short, human-readable name for the template displayed in the UI
- **`description`** – Guidance text explaining when and how to use the template
- **`variables`** – An object defining placeholder tokens (e.g., `{style}`, `{subject}`) that users can customize
- **`prompt`** – The base prompt string containing variable tokens that will be substituted at runtime
- **`example`** – A fully-rendered example prompt used for UI previews and documentation

The actual template data is stored in [`data/style-library.json`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/data/style-library.json), which maintains an array of objects where each entry strictly adheres to this schema. This separation of schema definition from data storage enables type safety and validation across the application.

## Loading Templates from the Style Library

At application startup, the client loads the entire template collection into memory. The [`src/main.jsx`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/src/main.jsx) file imports the style library as a static JSON module:

```javascript
import styleLibrary from '../data/style-library.json';

```

This import makes the template collection available throughout the component tree. The style library is structured as an array of template objects, allowing the UI to render the "Industrial Prompt Templates" section by mapping over this dataset. Each template object includes metadata and the variable definitions needed for dynamic formatting.

## Formatting Templates with Variable Substitution

When a user selects a template from the interface, the `formatTemplatePrompt` function in [`src/main.jsx`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/src/main.jsx) executes the variable substitution logic. This function accepts three parameters: the template object, the current UI language, and the style library reference.

The formatting process follows this sequence:

1. Extract the `variables` object from the template definition
2. Iterate through each variable entry and replace tokens in the base prompt string
3. Join optional sections based on template configuration
4. Return a single formatted string ready for API submission

Here is the core implementation from [`src/main.jsx`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/src/main.jsx):

```javascript
const formatTemplatePrompt = (item, language, styleLibrary) => {
  const vars = item.variables || {};
  let prompt = item.prompt;
  for (const [key, val] of Object.entries(vars)) {
    prompt = prompt.replace(`{${key}}`, val);
  }
  return prompt;
};

```

The function handles token replacement using simple string substitution, where `{variableName}` patterns in the template prompt are replaced with user-provided values. This approach ensures that complex GPT-Image 2 prompts can be constructed from reusable components while maintaining the specific syntax required by the backend API.

## User Interaction and Final Submission

The UI presents available templates in a list format. When a user clicks a template button, the system invokes `formatTemplatePrompt` and updates the **editablePrompt** state with the formatted result. This allows users to review and further customize the prompt before submission.

The final formatted string is transmitted to the backend via the `submitPersonalGeneration` function defined in [`src/apimartClient.js`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/src/apimartClient.js):

```javascript
export async function submitPersonalGeneration(prompt, apiKey, lang) {
  const payload = { prompt, language: lang };
  const resp = await fetch('/api/generate-image', {
    method: 'POST',
    headers: { 
      'Authorization': `Bearer ${apiKey}`, 
      'Content-Type': 'application/json' 
    },
    body: JSON.stringify(payload),
  });
  return resp.json();
}

```

This function constructs a POST request to `/api/generate-image` with the formatted prompt in the request body. The backend expects the prompt to follow GPT-Image 2 syntax, which the schema system guarantees by constraining how templates are constructed and formatted.

## Summary

- The **prompt template schema** enforces consistency across all image generation requests through a defined set of fields: `title`, `description`, `variables`, `prompt`, and `example`
- Template data lives in [`data/style-library.json`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/data/style-library.json) while schema documentation resides in [`docs/templates.md`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/docs/templates.md)
- The `formatTemplatePrompt` function in [`src/main.jsx`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/src/main.jsx) handles variable substitution by replacing `{token}` placeholders with user values
- Formatted prompts are submitted to the GPT-Image 2 API via `submitPersonalGeneration` in [`src/apimartClient.js`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/src/apimartClient.js)
- This architecture enables reusability, localization support, and maintainability for industrial-grade prompt engineering

## Frequently Asked Questions

### What fields are required in the prompt template schema?

The prompt template schema requires five fields: `title` for the display name, `description` for usage guidance, `variables` for placeholder definitions, `prompt` for the base template string, and `example` for preview rendering. These fields are documented in [`docs/templates.md`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/docs/templates.md) and implemented in [`data/style-library.json`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/data/style-library.json).

### How does variable substitution work in template formatting?

Variable substitution occurs in the `formatTemplatePrompt` function within [`src/main.jsx`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/src/main.jsx). The function iterates through the `variables` object and replaces tokens formatted as `{variableName}` in the template prompt with corresponding user-provided values, returning a single formatted string ready for API submission.

### Where are the prompt templates stored in the repository?

All prompt templates are stored in [`data/style-library.json`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/data/style-library.json) as a JSON array of objects. The schema definition that validates these templates is documented in [`docs/templates.md`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/docs/templates.md), and the runtime loading logic resides in [`src/main.jsx`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/src/main.jsx).

### How is the final prompt submitted to the GPT-Image 2 API?

The formatted prompt is submitted through the `submitPersonalGeneration` function in [`src/apimartClient.js`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/src/apimartClient.js). This function sends a POST request to `/api/generate-image` with the prompt string included in the JSON payload, along with authorization headers containing the user's API key.