Getting Started
Welcome to AI Mosaic Studio! This documentation will walk you through every step of the mosaic creation process. Whether you're a first-time user or an experienced artist, you'll find everything you need to know here.
Step-by-Step Guide
Step 1: Upload a Base Image
Click the "Choose File" button under the "Base Image" section and select the image you want to transform into a mosaic. This will be the reference image that the AI will use to guide the tile placement.
Step 2: Add Tile Images
Under the "Tile Images" section, you can either click to browse for images or drag and drop them directly into the drop zone. The more tiles you provide, the more detailed your mosaic will be. For best results, use at least 50 tiles.
Step 3: Configure Options (Optional)
You can enable "Auto Set Images" to let the AI automatically assign tiles to regions, or use "Manual Body Part Mapping" to assign specific tiles to different parts of the image (face, body, background, etc.).
Step 4: Generate the Mosaic
Click the "Generate Mosaic" button. The AI will process your images and display a progress bar. Once complete, your mosaic will appear in the result section.
Step 5: Adjust and Download
Use the sliders to adjust base opacity and tile opacity to fine-tune the visual balance. Then select your preferred export format (PNG, JPG, or WEBP) and resolution (HD or 4K) before clicking the "Download" button.
Understanding the Features
Auto Set Images
When this option is enabled, the AI will automatically analyze your base image and assign tiles to regions based on color and texture similarity. This is the recommended mode for most users as it produces excellent results with minimal effort.
Manual Body Part Mapping
This advanced feature gives you granular control over the mosaic creation process. When enabled, you can assign different tile sets to different regions of the base image:
- Face: Tiles for the facial region
- Body: Tiles for the torso and limbs
- Background: Tiles for the surrounding area
This is particularly useful for creating artistic effects where different parts of the image have distinct visual styles.
Opacity Controls
The "Base Opacity" slider controls how transparent the base image is overlaid on the mosaic. The "Tile Opacity" slider controls the transparency of the tiles themselves. Adjust these to achieve the perfect balance between the original image and the mosaic effect.
Tips for Best Results
- Use high-quality images: Higher resolution base and tile images produce better quality mosaics.
- Diverse tiles: Use tiles with a wide range of colors and textures to give the AI more options to work with.
- Optimise tile count: While you can use many tiles, 100–300 tiles typically provides a good balance between detail and performance.
- Consider composition: Images with clear subjects and distinct colour regions tend to produce the most striking mosaics.
- Experiment: Don't be afraid to try different combinations of settings and tile sets. The best results often come from experimentation.
Technical Information
How the AI Works
AI Mosaic Studio uses a combination of computer vision and colour-matching algorithms. The process involves:
- Region Detection: Using MediaPipe, the AI identifies key regions in your base image (face, body, etc.).
- Color Analysis: Each region's average colour is calculated in the CIELAB colour space for accurate colour comparison.
- Tile Matching: For each region, the AI selects the tile with the closest colour match from your uploaded tiles.
- Assembly: The selected tiles are arranged to form the final mosaic, preserving the composition of the original image.
Performance Considerations
Mosaic generation is computationally intensive and may take longer on older devices or with very large images. For the best performance:
- Use images with dimensions under 2000px
- Limit the number of tiles to 200–300
- Use a modern browser (Chrome or Edge recommended)
- Close other applications to free up system resources
Export Options
Formats
- PNG: Lossless format with support for transparency. Best for high-quality images and further editing.
- JPG: Lossy format with smaller file size. Good for sharing and web use.
- WEBP: Modern format with excellent compression and quality. Supported by most modern browsers.
Resolutions
- HD (1280×720): Good for social media and web use.
- 4K (3840×2160): High resolution suitable for printing and professional use.
Need More Help?
If you need additional assistance, here are some resources: