Personal Projects / 2026
AI Image Slicer
AI-powered tool that automatically detects and extracts individual images from mockup screenshots. Reduces manual image extraction from hours to minutes with 95%+ accuracy.
Design Highlights
Overview
AI Image Slicer is a web application that streamlines the designer workflow of extracting individual images and logos from composite mockup screenshots. Using AI-powered image analysis, it automatically detects boundaries, crops embedded images, and generates downloadable zip files—all in a few clicks.
Challenge
Designers frequently receive mockups containing multiple images, logos, and graphics embedded within a single screenshot. Manually identifying boundaries, cropping each element, and exporting individual files is tedious and time-consuming—often taking hours for complex mockups. This workflow bottleneck slows down design handoff and asset preparation.
Approach
Built a React-based web application using Cursor that uses AI to analyze uploaded mockup images. The system automatically detects visual boundaries between embedded elements, identifies individual images and logos, and crops them cleanly. The flow is three steps: upload a mockup, review the detected images, download everything as a zip.
Solution
Created a streamlined three-step workflow: upload mockup → AI scans and detects embedded images → download zip of cropped assets. The AI analyzes the composition, identifies distinct visual elements, and generates clean, properly cropped individual images. Users can review detected elements before downloading, ensuring accuracy and control over the final output.
Impact
Reduced image extraction time from hours to minutes, a major productivity gain for designers working with mockups. Achieved 95%+ accuracy in detecting and cropping embedded images, minimizing manual corrections. Eliminated the tedious manual cropping process, allowing designers to focus on creative work rather than asset preparation. The tool has become a valuable utility for designers handling client mockups and design handoffs.
Key Learnings
AI can dramatically accelerate repetitive design tasks when properly scoped to specific workflows. Focusing on a narrow, well-defined problem (extracting images from mockups) rather than trying to solve all image processing needs was the right scoping decision. Simple, focused tools that save significant time have high adoption even without complex features. Providing visual feedback and user control over AI outputs builds trust and ensures quality.