Loading project case study
All work

Personal Projects / 2026

AI Image Slicer

Reduced a repetitive design-production task from hours to minutes by detecting and extracting assets from composite mockups with 95%+ accuracy.

Visit live app Read the case study
AI Image Slicer

Value and impact

Mockup to usable assets
Hours → Minutes
Crops ready for review
95%+
Time returned to design
90%+

01

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.

  • AI/ML
  • Design Tools
  • Productivity
  • Personal

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.

04

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.

05

Impact

Designers can turn a composite mockup into usable individual assets in minutes instead of spending hours identifying boundaries and cropping by hand.

Detection accuracy above 95% and a review step keep corrections manageable while reducing manual effort by more than 90%. For design teams, the utility shifts time from asset preparation back to creative and product work and makes handoff preparation more predictable.

06

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.

PreviousCompetency Manager View all projects