Professional Avatar Creation System

Create stunning, customizable avatars with this powerful layer-based dollmaker system. Built with modern web technologies and designed for flexibility, this application offers unlimited creative possibilities while maintaining enterprise-grade code quality and performance.

Core Features

Intelligent Automation

Automatic Imageset Discovery

The system scans for imagesets automatically and builds dropdown navigation when multiple projects exist. Simply create a folder structure and add PNG assets:

image_sets/
├── naruto/
│   ├── 01-Background/
│   │   ├── 0001.png, 0002.png, ...
│   │   └── btn_0001.png (80x80 thumbnails)
│   ├── 02-Hair/
│   └── 03-Face/
└── superhero/
    ├── 01-Costume/
    └── 02-Accessories/

Zero configuration needed! The scanner automatically:

• Discovers all imagesets in the folder
• Detects layers from numbered folder names (01-, 02-, etc.)
• Counts PNG assets (excluding thumbnails and 0000.png)
• Auto-detects image dimensions from first available file
• Generates JavaScript arrays via PHP json_encode()

Smart Layer Exclusions

Optional per-imageset rules prevent conflicting items. Create a simple settings.txt file:

//-- BEGIN EXCLUSIONS --//
8|10   # bottoms vs dresses
9|10   # tops vs dresses
9|11   # tops vs sweaters
//-- END EXCLUSIONS --//

What happens: Selecting a dress automatically clears tops and bottoms. Random button respects exclusions and gives all clothing types equal chances.

Technology Stack

Professional UI/UX

• Accordion System
  Collapsible panels with persistent state for Effects, Save Options, and Layer Tabs. Green theme throughout with white chevron icons.
• Flexbox Layout
  Equal-height sidebar and content areas. Smooth sidebar toggle with margin transitions. Full-width ads and footer sections.
• Tab Visual Hierarchy
  Active tabs larger and brighter than inactive. Hidden scrollbars with horizontal overflow. Z-index layering for overlap effects.

Combinations Counter

Displays total possible avatar combinations with intelligent shorthand formatting:

• 2.8 Trillion combinations shown as badge
• Hover popover shows full formatted number: 2,843,438,592,000
• Auto-calculated based on imageset assets
• Updates dynamically when switching imagesets

Security & Performance

• Cookie Namespacing: SocialMUD.Dollmaker.[Imageset] prevents conflicts
• Path Validation: basename() prevents directory traversal
• Section-Based Parsing: Exclusions use safe delimiter blocks
• Lazy Loading: Images load on-demand for fast initial page load
• Browser Caching: Thumbnails and full images cached automatically
• Optimized Storage: Temporary (1hr) and persistent (30d) file management

What's Included

• Complete dollmaker application (index.php)
• Dynamic scanner system (scanner.php, config.php)
• Server-side compositor (save-avt-page.php)
• Toast UI Image Editor integration (editor.php)
• Storage manager (ImageStorageManager.php)
• All JavaScript (scripts.js - 2400+ lines)
• Complete CSS with theme variables (styles.css)
• Bootstrap 5.3.2 + Font Awesome 6.5.1 (local assets)
• Comprehensive documentation (README.md + docs/)
• Example imagesets for testing

Developer-Friendly

Clean, well-documented code with inline comments. Modular architecture makes customization straightforward. MIT License for the code (assets are demonstration only - replace with your own artwork).

Documentation

Extensive documentation included:

• README.md - Complete feature list and setup guide
• docs/IMAGESETS.md - Imageset system deep dive
• docs/LAYER_EXCLUSIONS.md - Exclusions configuration
• CHANGELOG.md - Version history and updates
• QUICKSTART_EXCLUSIONS.md - Quick reference guide

Gallery

Browse concept dollmaker imageset expansion pack ideas. Click any image to view the video.