Bài 5: AI Design Generation — Text-to-Image, Style Transfer & Prompt Engineering cho Fashion

Kiến trúc Hệ thống Fashion Design & Print-on-Demand — Từ Domain Analysis đến Production

Phần 2: AI-Powered Design Studio

xdev.asia

1. AI Design Generation Pipeline

User Input                        AI Generation Pipeline
┌─────────────┐                 ┌────────────────────────────────┐
│ Text Prompt │────────────────▶│ Prompt Engineering Layer       │
│ Style Ref   │                 │  ├── Fashion vocabulary mapper │
│ Color Pref  │                 │  ├── Negative prompt builder   │
│ Product Type│                 │  └── Quality enhancer          │
└─────────────┘                 └────────────┬───────────────────┘
                                             │
                                ┌────────────▼───────────────────┐
                                │ Model Selection & Routing      │
                                │  ├── SDXL (general fashion)    │
                                │  ├── LoRA (brand-specific)     │
                                │  ├── ControlNet (structure)    │
                                │  └── IP-Adapter (style ref)    │
                                └────────────┬───────────────────┘
                                             │
                                ┌────────────▼───────────────────┐
                                │ GPU Inference Farm             │
                                │  ├── NVIDIA A100/H100 cluster  │
                                │  ├── Queue: BullMQ + priority  │
                                │  └── Batch processing          │
                                └────────────┬───────────────────┘
                                             │
                                ┌────────────▼───────────────────┐
                                │ Post-Processing                │
                                │  ├── Upscale (Real-ESRGAN 4x)  │
                                │  ├── Background removal        │
                                │  ├── Color correction          │
                                │  └── Content moderation (NSFW) │
                                └────────────┬───────────────────┘
                                             │
                                ┌────────────▼───────────────────┐
                                │ Design Library                 │
                                │  ├── Save to user gallery      │
                                │  ├── Generate variations       │
                                │  └── Apply to canvas           │
                                └────────────────────────────────┘

2. Prompt Engineering cho Fashion Domain

interface FashionPromptBuilder {
  buildPrompt(input: UserPromptInput): EnhancedPrompt;
}

interface UserPromptInput {
  text: string;                               // "minimalist mountain landscape"
  productType: 'tshirt' | 'hoodie' | 'poster' | 'mug';
  style: FashionStyle;
  colorPalette?: string[];                    // ["#1a1a2e", "#16213e", "#e94560"]
  printMethod: 'dtg' | 'dtf' | 'sublimation' | 'screen_print';
}

type FashionStyle =
  | 'street_wear' | 'vintage_retro' | 'minimalist' | 'japanese'
  | 'grunge' | 'y2k' | 'cyberpunk' | 'botanical'
  | 'typography' | 'abstract' | 'pop_art' | 'watercolor';

interface EnhancedPrompt {
  positive: string;
  negative: string;
  model: string;
  lora?: string;
  controlnet?: ControlNetConfig;
  samplerSettings: SamplerSettings;
}

// Fashion-specific prompt templates
const STYLE_TEMPLATES: Record<FashionStyle, StyleTemplate> = {
  street_wear: {
    prefix: 'urban streetwear graphic design,',
    suffix: 'bold colors, graffiti influence, hip-hop culture, high contrast',
    negativeAdd: 'photorealistic, 3d render',
    recommendedModel: 'sdxl-streetwear-v2',
  },
  vintage_retro: {
    prefix: 'vintage retro illustration,',
    suffix: 'distressed texture, faded colors, 70s aesthetic, halftone dots',
    negativeAdd: 'modern, clean, digital',
    recommendedModel: 'sdxl-base',
    lora: 'vintage-retro-lora-v1',
  },
  minimalist: {
    prefix: 'minimalist design, clean lines,',
    suffix: 'simple geometric, whitespace, modern typography, flat design',
    negativeAdd: 'complex, busy, detailed, ornate',
    recommendedModel: 'sdxl-base',
  },
  japanese: {
    prefix: 'Japanese art style,',
    suffix: 'ukiyo-e influence, cherry blossom, wave, kanji typography, zen aesthetic',
    negativeAdd: 'western, photorealistic',
    recommendedModel: 'sdxl-anime-v3',
  },
  // ... other styles
};

function buildFashionPrompt(input: UserPromptInput): EnhancedPrompt {
  const template = STYLE_TEMPLATES[input.style];
  
  // Color-aware prompting
  const colorHint = input.colorPalette
    ? `color palette: ${input.colorPalette.join(', ')},`
    : '';

  // Print-method-aware
  const printHint = {
    dtg: 'transparent background, isolated design, print-ready',
    dtf: 'transparent background, vibrant colors, high saturation, no gradients',
    sublimation: 'all-over print pattern, edge-to-edge, seamless',
    screen_print: 'limited colors, spot color separation, bold shapes, no gradients',
  }[input.printMethod];

  const positive = [
    template.prefix,
    input.text,
    colorHint,
    printHint,
    template.suffix,
    'high quality, 300 DPI, professional design',
  ].filter(Boolean).join(' ');

  const negative = [
    'blurry, low quality, watermark, signature, text artifact',
    'deformed, ugly, bad anatomy',
    template.negativeAdd,
  ].join(', ');

  return {
    positive,
    negative,
    model: template.recommendedModel,
    lora: template.lora,
    samplerSettings: {
      steps: 30,
      cfgScale: 7.5,
      sampler: 'dpm++_2m_karras',
      width: 1024,
      height: 1024,
      seed: -1,   // random
    },
  };
}

3. Model Architecture & Fine-tuning

LoRA Fine-tuning cho Brand-specific Styles

# LoRA training config cho fashion brand style
training_config = {
    "model": "stabilityai/stable-diffusion-xl-base-1.0",
    "lora_rank": 32,
    "lora_alpha": 32,
    "learning_rate": 1e-4,
    "train_batch_size": 4,
    "num_train_epochs": 100,
    "resolution": 1024,
    "dataset": {
        "instance_prompt": "a design in the style of [brand_token]",
        "class_prompt": "a fashion graphic design",
        "instance_data_dir": "./training_data/brand_designs/",
        "num_class_images": 200,
    },
    "optimizer": "adamw",
    "lr_scheduler": "cosine_with_restarts",
    "mixed_precision": "fp16",
    "gradient_accumulation_steps": 4,
}

ControlNet cho Structure-guided Generation

interface ControlNetConfig {
  model: ControlNetModel;
  inputImage: string;     // Reference image URL
  strength: number;       // 0.0 - 1.0
  guidanceStart: number;  // When to start applying
  guidanceEnd: number;    // When to stop
}

type ControlNetModel =
  | 'canny'          // Edge detection → maintain outline structure
  | 'depth'          // Depth map → 3D-like structure
  | 'openpose'       // Human pose → design placement trên body
  | 'lineart'        // Line art → sketch to design
  | 'scribble'       // Rough sketch → polished design
  | 'seg'            // Segmentation → region-based generation
  | 'color'          // Color reference → maintain color scheme
  | 'tile';          // Tile/pattern → seamless pattern generation

// Use case: User uploads a sketch, generate polished design
const sketchToDesign: ControlNetConfig = {
  model: 'lineart',
  inputImage: '/user-uploads/sketch-001.png',
  strength: 0.8,
  guidanceStart: 0.0,
  guidanceEnd: 0.8,
};

4. IP-Adapter & Style Transfer

// Style transfer: Tham chiếu từ ảnh mẫu → áp dụng style vào design mới
interface StyleTransferRequest {
  // Text prompt mô tả nội dung mong muốn
  prompt: string;                  // "tiger face, fierce expression"
  
  // Style reference image
  styleReference: {
    imageUrl: string;              // Ảnh mẫu style
    strength: number;              // 0.3 - 0.8 (quá cao sẽ copy y nguyên)
    type: 'ip_adapter' | 'ip_adapter_face' | 'ip_adapter_plus';
  };
  
  // Optional: Combine with ControlNet
  structureGuide?: ControlNetConfig;
}

// API endpoint
// POST /api/v1/generate/style-transfer
async function styleTransfer(req: StyleTransferRequest): Promise<GenerationResult> {
  const pipeline = new StableDiffusionXLPipeline({
    model: 'sdxl-base',
    ipAdapter: {
      model: req.styleReference.type,
      image: await loadImage(req.styleReference.imageUrl),
      scale: req.styleReference.strength,
    },
    controlnet: req.structureGuide ? {
      model: req.structureGuide.model,
      image: await loadImage(req.structureGuide.inputImage),
      conditioning_scale: req.structureGuide.strength,
    } : undefined,
  });

  return pipeline.generate({
    prompt: req.prompt,
    negative_prompt: DEFAULT_NEGATIVE,
    num_inference_steps: 30,
    guidance_scale: 7.5,
    width: 1024,
    height: 1024,
    num_images: 4,   // Generate 4 variations
  });
}

5. GPU Infrastructure & Job Queue

// GPU Worker Architecture
interface GPUWorkerPool {
  workers: GPUWorker[];
  queue: BullMQ.Queue;
  
  // Auto-scaling
  minWorkers: 2;
  maxWorkers: 20;
  scaleUpThreshold: 0.8;   // 80% utilization → scale up
  scaleDownDelay: 300;      // 5 min idle → scale down
}

interface GPUWorker {
  id: string;
  gpu: 'a100_40gb' | 'a100_80gb' | 'h100';
  status: 'idle' | 'processing' | 'loading_model';
  currentModel: string;       // Model đang load trên VRAM
  vramUsageMB: number;
  
  // Model caching — giữ model trên VRAM
  loadedModels: Map<string, LoadedModel>;
}

// Job Queue với priority
const generationQueue = new Queue('ai-generation', {
  defaultJobOptions: {
    attempts: 3,
    backoff: { type: 'exponential', delay: 2000 },
    removeOnComplete: { age: 3600 },        // Clean after 1h
    removeOnFail: { age: 86400 },           // Keep failed 24h
  },
});

// Priority levels
enum JobPriority {
  REALTIME = 1,      // Premium user, interactive
  HIGH = 5,          // Logged-in user
  NORMAL = 10,       // Free user
  BATCH = 20,        // Background batch generation
}

6. Post-Processing Pipeline

async function postProcessDesign(rawImage: Buffer): Promise<ProcessedDesign> {
  // 1. Upscale (Real-ESRGAN)
  const upscaled = await upscaleImage(rawImage, {
    model: 'realesrgan-x4plus',
    scale: 4,         // 1024 → 4096
    denoise: 0.5,
  });

  // 2. Background removal (always transparent for POD)
  const noBackground = await removeBackground(upscaled, {
    model: 'rembg-u2net',
    alphaMatting: true,
    alphaMattingForegroundThreshold: 240,
    alphaMattingBackgroundThreshold: 10,
  });

  // 3. Content moderation
  const moderationResult = await moderateContent(noBackground, {
    checkNSFW: true,
    checkViolence: true,
    checkCopyright: true,    // CLIP-based similarity check vs known brands/IPs
    threshold: 0.85,
  });

  if (!moderationResult.safe) {
    throw new ContentPolicyViolation(moderationResult.reason);
  }

  // 4. Color correction cho print
  const corrected = await colorCorrect(noBackground, {
    targetColorSpace: 'srgb',
    contrastEnhance: 1.1,
    saturationBoost: 1.05,    // Slightly boost cho print (colors look duller on fabric)
  });

  return {
    preview: await exportWebP(corrected, { quality: 85, maxWidth: 1200 }),
    printReady: await exportPNG(corrected, { dpi: 300, colorSpace: 'srgb' }),
    metadata: {
      width: corrected.width,
      height: corrected.height,
      hasTransparency: true,
      colorCount: await analyzeColors(corrected),
      moderationScore: moderationResult.score,
    },
  };
}

7. Batch Generation & Variations

// Batch generation: Tạo nhiều design cùng lúc cho product line
interface BatchGenerationRequest {
  basePrompt: string;
  variations: VariationType[];
  count: number;                // Số lượng per variation
  productTypes: string[];       // Apply lên nhiều product
}

type VariationType =
  | { type: 'color_swap'; palettes: string[][] }       // Same design, different colors
  | { type: 'style_mix'; styles: FashionStyle[] }      // Same content, different styles
  | { type: 'prompt_expand'; keywords: string[] }      // Expand prompt with keywords
  | { type: 'seed_walk'; seedStart: number; step: number }; // Smooth seed variation

async function batchGenerate(req: BatchGenerationRequest): Promise<BatchResult> {
  const jobs: GenerationJob[] = [];

  for (const variation of req.variations) {
    for (let i = 0; i < req.count; i++) {
      const prompt = applyVariation(req.basePrompt, variation, i);
      
      for (const productType of req.productTypes) {
        jobs.push({
          prompt,
          productType,
          priority: JobPriority.BATCH,
          callbackUrl: '/webhooks/batch-complete',
        });
      }
    }
  }

  // Enqueue all jobs
  const bulkResult = await generationQueue.addBulk(
    jobs.map(job => ({
      name: 'generate',
      data: job,
      opts: { priority: job.priority },
    }))
  );

  return {
    batchId: generateBatchId(),
    totalJobs: jobs.length,
    estimatedTime: estimateCompletionTime(jobs.length),
    statusUrl: `/api/v1/batch/${batchId}/status`,
  };
}

8. Tổng kết

Component	Technology	Purpose
Base Model	SDXL 1.0	High-quality 1024x1024 generation
Fine-tuning	LoRA (rank 32)	Brand-specific style adaptation
Structure Control	ControlNet	Sketch-to-design, pose-guided
Style Transfer	IP-Adapter	Reference-based style matching
Upscaling	Real-ESRGAN 4x	1024 → 4096 for print (300 DPI)
Background Removal	U2-Net / REMBG	Transparent background for POD
Content Moderation	CLIP + NSFW classifier	Safety & IP compliance
Job Queue	BullMQ + Redis	Priority queue, retry, batch
GPU Infra	A100/H100 + Auto-scaling	Cost-efficient GPU allocation
Prompt Engineering	Fashion-specific templates	Domain-optimized generation