"WE NEED A COOL NAME" - AI Game Asset Generator

A full-stack application for generating game assets using runware and claude api.

Features

• 3-Node Pipeline Workflow: Intuitive step-by-step asset configuration

  • Node 1: Enter your game idea
  • Node 2: Configure game style, characters, backgrounds, and dialogue
  • Node 3: Validate prompts and generate assets

• Prompt Validation: Uses Claude API to validate and sanitize user inputs against prompt injection attacks

• Parallel Asset Generation: Generates multiple assets simultaneously using Runware API

  • Characters (with automatic background removal)
  • Backgrounds (stylized or realistic)
  • Dialogue images

• Studio Dashboard: Organized asset browser with tree navigation following unity best practice (https://unity.com/how-to/organizing-your-project)

  • Preview images, audio, and dialogue files
  • Download individual assets or all as ZIP

• Multi-Session Support: Create up to 3 generation sessions in tabs

Tech Stack

Frontend

• TypeScript
• Tailwind CSS (styling)
• shadcn/ui (component library)
• React Flow (pipeline visualization)
• Framer Motion (animations)
• JSZip (asset downloading)

Backend

• Python 3.11+
• FastAPI (API framework)
• Pydantic (data validation)
• Anthropic SDK (Claude API)
• HTTPX (async HTTP client)
• SSE-Starlette (Server-Sent Events)

Prerequisites

• Node.js 18+
• Python 3.11+
• Anthropic API key
• Runware API key

Setup

Docker (highher recommended)

If you dun want Docker

1. Clone and Install

cd frontend
npm install

cd backend
pip install -r requirements.txt

2. Configure Environment Variables

Create a .env file in the backend directory:

cd backend
cp .env.example .env
# Edit .env with your API keys

Required environment variables:

• ANTHROPIC_API_KEY: Your Anthropic API key for Claude
• RUNWARE_API_KEY: Your Runware API key for image generation

3. Run the Application

Start the backend:

cd backend
uvicorn main:app --reload --port 8000

Start the frontend (in a new terminal):

cd frontend
npm run dev

The application will be available at http://localhost:5173

API Endpoints

POST /api/validate

Validate and optimize game asset prompts.

Request Body:

{
  "rawIdea": "A retro RPG dungeon crawler",
  "gameStyle": "rpg-pixel",
  "dialogueType": "text",
  "characters": [
    {
      "id": "hero",
      "name": "Hero",
      "description": "A brave knight with silver armor"
    }
  ],
  "backgroundDescription": "Dark dungeon with torches",
  "useRealisticBackground": false
}

POST /api/generate

Start asset generation process.

Request Body: Validated manifest from /api/validate

Response:

{
  "sessionId": "uuid-string"
}

GET /api/session/{sessionId}

Get session details and asset status.

GET /api/session/{sessionId}/stream

Stream session updates via Server-Sent Events.

Image Generation Models

The application uses the following Runware models:

Use Case	Model	Model ID
Characters & Stylized Assets	FLUX.2 klein	runware:400@3
Dialogue Text Images	FLUX.1 dev	runware:101@1
Realistic Backgrounds	FLUX pro	bfl:5@1
Background Removal	BiRefNet	runware:112@5

Project Structure

.
├── backend
│   ├── main.py
│   ├── models.py
│   ├── requirements.txt
│   ├── runware_service.py
│   └── validation_service.py
├── frontend
│   ├── index.html
│   ├── package.json
│   ├── package-lock.json
│   ├── README.md
│   ├── src
│   │   ├── App.tsx
│   │   ├── components
│   │   │   ├── pipeline
│   │   │   │   └── Pipeline.tsx
│   │   │   ├── studio
│   │   │   │   ├── AssetPreview.tsx
│   │   │   │   ├── AssetTree.tsx
│   │   │   │   └── Studio.tsx
│   │   │   └── ui
│   │   │       ├── Button.tsx
│   │   │       ├── Card.tsx
│   │   │       ├── Dialog.tsx
│   │   │       ├── Input.tsx
│   │   │       ├── Label.tsx
│   │   │       ├── Select.tsx
│   │   │       └── Textarea.tsx
│   │   ├── index.css
│   │   ├── lib
│   │   │   ├── api.ts
│   │   │   └── utils.ts
│   │   ├── main.tsx
│   │   ├── pages
│   │   │   ├── LandingPage.tsx
│   │   │   └── StudioPage.tsx
│   │   └── types
│   │       └── index.ts
│   ├── tsconfig.app.json
│   ├── tsconfig.json
│   ├── tsconfig.node.json
│   └── vite.config.ts
├── LICENSE
└── README.md

Security

The application includes prompt injection protection following OWASP (TO-DO):

License

MIT