# 🎨 UI ASSET GENERATION PLAN
**Demo Completion - Batch 1**  
**Start**: 2026-01-04 21:18  
**Style**: Dark-Chibi Noir (Style 32)

---

## 📋 BATCH 1 - UI ELEMENTS (20 assets)

### **Health & Stamina Bars** (4 assets)

1. **health_bar_frame.png**
   - 200×30px bar container
   - Dark border, noir style
   - Empty frame outline

2. **health_bar_fill.png**
   - 196×26px red gradient fill
   - Blood red (#CC0000)
   - Fits inside frame

3. **stamina_bar_frame.png**
   - 200×30px bar container
   - Same style as health
   - Empty frame

4. **stamina_bar_fill.png**
   - 196×26px blue gradient fill
   - Energy blue (#0099FF)
   - Fits inside frame

---

### **Inventory System** (6 assets)

5. **inventory_panel.png**
   - 400×500px background
   - Dark wooden panel texture
   - Noir aesthetic
   - Slightly worn edges

6. **inventory_slot_frame.png**
   - 64×64px item slot
   - Dark border
   - Can see through center

7. **inventory_slot_highlight.png**
   - 64×64px glow effect
   - Golden/yellow outline
   - Selected state

8. **hotbar_background.png**
   - 600×80px horizontal bar
   - Bottom of screen
   - 9 slots visible
   - Dark wood/metal

9. **item_slot_number.png**
   - Small number badge (1-9)
   - White text on dark circle
   - For hotbar slots

10. **inventory_close_button.png**
    - 40×40px X button
    - Red when hover
    - Top-right of panel

---

### **Dialogue System** (4 assets)

11. **dialogue_box.png**
    - 800×200px text container
    - Bottom-center of screen
    - Dark background, semi-transparent
    - Rounded corners

12. **dialogue_portrait_frame.png**
    - 120×120px character portrait frame
    - Left side of dialogue box
    - Ornate border

13. **dialogue_continue_arrow.png**
    - 32×32px blinking arrow
    - Bottom-right of dialogue
    - Indicates "press to continue"

14. **dialogue_name_tag.png**
    - 200×40px name banner
    - Above dialogue box
    - Shows NPC name

---

### **Quest & UI Elements** (6 assets)

15. **quest_marker.png**
    - 32×32px exclamation mark
    - Floats above NPC head
    - Yellow glow
    - Animated pulse

16. **quest_panel.png**
    - 350×250px quest list
    - Side panel
    - Shows active quests
    - Dark background

17. **button_normal.png**
    - 200×50px standard button
    - Dark metal/wood
    - Rounded edges

18. **button_hover.png**
    - 200×50px button (lit)
    - Slightly brighter
    - Golden glow

19. **button_pressed.png**
    - 200×50px button (pressed)
    - Darker, inset look
    - Tactile feel

20. **coin_icon.png**
    - 32×32px gold coin
    - Shiny, metallic
    - For currency display

---

## 🎨 STYLE GUIDE:

**Color Palette:**
- Dark browns/blacks (noir)
- Blood red (health)
- Energy blue (stamina)
- Gold accents (highlights)
- Semi-transparent backgrounds

**Art Style:**
- Dark-Chibi Noir (Style 32)
- Thick black outlines
- Flat colors
- Gritty, worn textures
- Post-apocalyptic feel

**Technical:**
- 32-bit PNG with alpha
- Clean edges
- Centered subjects
- UI-optimized (crisp at screen resolution)

---

## ⏱️ GENERATION ORDER:

**Priority 1** (Critical - 10 assets):
1-4: Health/Stamina bars
5-7: Inventory basics
11-13: Dialogue box

**Priority 2** (Important - 6 assets):
8-10: Hotbar
14: Name tag
15: Quest marker

**Priority 3** (Polish - 4 assets):
16-19: Quest panel + buttons
20: Coin icon

---

## 📊 ESTIMATED TIME:

- Batch 1 Priority: 15 min
- Batch 2 Priority: 10 min
- Batch 3 Priority: 5 min

**TOTAL**: 30 minutes for all 20 UI assets

---

## ✅ AFTER UI GENERATION:

Next batches:
- **Batch 2**: Buildings (Shack, Campfire, Chest) - 15 min
- **Batch 3**: Item icons (Wood, Stone, etc.) - 10 min

**TOTAL DEMO ASSETS**: 28  
**TOTAL TIME**: ~55 minutes

---

**Ready to generate!** 🚀

Starting with Priority 1 (critical UI) now...