# How to Use the Template System for Brand Design Workflows in Awesome-GPT-Image 2

> Learn how to use the template system for brand design workflows in Awesome-GPT-Image 2. Generate complete brand identity kits with structured JSON payloads via the API.

- Repository: [苍何/awesome-gpt-image-2](https://github.com/freestylefly/awesome-gpt-image-2)
- Tags: how-to-guide
- Published: 2026-09-13

---

**The Awesome-GPT-Image 2 repository provides a data-driven template system that generates complete brand identity kits through structured JSON payloads sent to the `/api/generate-image` endpoint.**

The template system for brand design workflows in freestylefly/awesome-gpt-image-2 enables designers to produce consistent logos, business cards, and touch-point boards using a single structured prompt. By anchoring requests to predefined templates like `tpl-brand`, the system maps brand attributes to specific visual outputs through a clean JSON interface. This approach eliminates prompt engineering guesswork while ensuring reproducible results across enterprise design pipelines.

## Understanding the Template Architecture

All prompt patterns reside in [`docs/templates.md`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/docs/templates.md), where each template is identified by a unique anchor such as `tpl-brand`. These sections contain human-readable descriptions, anti-patterns to avoid, and sample JSON schemas that define valid payload structures.

### Template Metadata and Category Mapping

The [`data/style-library.json`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/data/style-library.json) file maps every template anchor to metadata including category classifications, style tags, and scene identifiers. This metadata drives the UI's category card selection and determines which cover images display for each template type. When you reference `tpl-brand`, the system looks up its associated **Brand** style tag and **Commerce** scene tag to guide the image generation model's visual language.

## Constructing a Brand Identity Package Payload

To initiate a brand design workflow, assemble a JSON object following the **Brand Identity Package** schema defined in [`docs/templates.md`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/docs/templates.md). The payload must include core brand attributes and visual specifications that the template translates into generation parameters.

### Required Schema Fields

A complete brand payload requires these specific keys:

- `brandName` – The official company or product name
- `positioning` – Strategic market positioning statement (e.g., "High-tech, trustworthy AI partner")
- `palette` – Object containing `primary`, `secondary`, and `accent` hex codes
- `typography` – Object specifying `heading` and `body` font families
- `logoUsage` – Descriptive string detailing logo construction (e.g., "Geometric neural-node fusion")
- `touchpoints` – Array of deliverables such as `["Logo", "Business Card", "App Icon"]`

```json
{
  "templateAnchor": "tpl-brand",
  "payload": {
    "brandName": "Nova Dynamics",
    "industry": "AI Technology",
    "keywords": ["Innovative", "Minimalist", "Trustworthy"],
    "positioning": "High-tech, trustworthy AI partner for enterprises",
    "palette": {
      "primary": "#0066FF",
      "secondary": "#FFFFFF",
      "accent": "#FFCC00"
    },
    "typography": {
      "heading": "Montserrat",
      "body": "Open Sans"
    },
    "logoUsage": "Geometric neural-node fusion with a star motif",
    "touchpoints": ["Logo", "Business Card", "App Icon", "Website Header"]
  }
}

```

## Executing the Generation API

The runtime implementation resides in [`api/generate-image.js`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/api/generate-image.js), which accepts POST requests and extracts the `templateAnchor` to route prompts to the hosted LLM-image model. The server validates the payload against the template schema before initiating generation.

### Direct API Implementation

For vanilla JavaScript implementations, POST the structured payload to `/api/generate-image` with proper headers:

```javascript
async function generateBrandBoard(payload) {
  const response = await fetch('/api/generate-image', {
    method: 'POST',
    headers: { 'Content-Type': 'application/json' },
    body: JSON.stringify({
      templateAnchor: 'tpl-brand',
      payload
    })
  });
  const result = await response.json();
  return result.imageUrl;
}

// Usage example
const brandPayload = {
  brandName: "Nova Dynamics",
  positioning: "High-tech, trustworthy AI partner for enterprises",
  palette: { primary: "#0066FF", secondary: "#FFFFFF", accent: "#FFCC00" },
  typography: { heading: "Montserrat", body: "Open Sans" },
  logoUsage: "Geometric neural-node fusion with a star motif",
  touchpoints: ["Logo", "Business Card", "App Icon", "Website Header"]
};

generateBrandBoard(brandPayload).then(url => {
  document.getElementById('brand-output').src = url;
});

```

### Using the apimartClient Helper

For React or Vite-based frontends, import the helper from [`src/apimartClient.js`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/src/apimartClient.js) to abstract the fetch logic and handle authentication headers:

```javascript
import { apimartClient } from './apimartClient';

async function fetchBrandBoard() {
  const client = apimartClient({ apiKey: process.env.API_KEY });
  const result = await client.generate({
    templateAnchor: 'tpl-brand',
    payload: {
      brandName: 'Nova Dynamics',
      industry: 'AI Technology',
      palette: {
        primary: '#0066FF',
        secondary: '#FFFFFF',
        accent: '#FFCC00'
      },
      typography: {
        heading: 'Montserrat',
        body: 'Open Sans'
      },
      touchpoints: ['Logo', 'Business Card', 'App Icon']
    }
  });
  console.log('Generated board URL:', result.url);
}

```

## Summary

- The **template system for brand design workflows** centers on the `tpl-brand` anchor defined in [`docs/templates.md`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/docs/templates.md), which standardizes brand kit generation through structured JSON schemas.
- **Metadata routing** through [`data/style-library.json`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/data/style-library.json) automatically applies **Brand** style tags and **Commerce** scene contexts when processing identity packages.
- **Payload construction** requires six mandatory fields—`brandName`, `positioning`, `palette`, `typography`, `logoUsage`, and `touchpoints`—to generate complete visual identity boards.
- **API execution** occurs through `POST /api/generate-image`, handled server-side by [`api/generate-image.js`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/api/generate-image.js), with frontend abstraction available via [`src/apimartClient.js`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/src/apimartClient.js).

## Frequently Asked Questions

### What file contains the template definitions for brand design?

The [`docs/templates.md`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/docs/templates.md) file houses all template definitions, including the **Brand Identity Package** section marked by the `tpl-brand` anchor. This file contains the human-readable descriptions, required JSON schemas, and "avoid-pitfalls" checklists for brand workflows.

### How does the system know which visual style to apply to my brand request?

The [`data/style-library.json`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/data/style-library.json) file maps the `tpl-brand` anchor to specific metadata tags, including a **Brand** style classification and optional **Commerce** scene designation. These tags inform the LLM-image model to generate enterprise-appropriate visuals rather than casual or artistic styles.

### Can I generate multiple brand touchpoints in a single API call?

Yes. Include all desired deliverables in the `touchpoints` array within your payload—such as `["Logo", "Business Card", "App Icon", "Website Header"]`—and the system returns a multi-page board or composite image containing all specified assets. The template processes this array in [`api/generate-image.js`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/api/generate-image.js) to construct the complete generation prompt.

### What is the difference between using the REST endpoint directly versus the apimartClient helper?

Direct `fetch` calls to `/api/generate-image` provide maximum flexibility for vanilla JavaScript implementations, while the `apimartClient` helper in [`src/apimartClient.js`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/src/apimartClient.js) handles authentication headers, error parsing, and request formatting automatically. Use the helper for React/Vite frontends to reduce boilerplate and ensure consistent header management.