Image Redaction

Surgically blur sensitive regions in images while preserving surrounding UI elements.

Prerequisites

pip install --break-system-packages Pillow  # if not already installed

Process

Precision mode (recommended): OCR + substring-only blur (EasyOCR)

Use this when you need to blur only specific sensitive substrings inside a larger line (e.g. blur a repo name but keep repo: visible).

Before running: decide what to redact (you can ask the user what exact substring(s) should be blurred if unclear).

1) Create a temp venv and install EasyOCR (no sudo):

python3 -m venv ~/tmp/ocr-venv
~/tmp/ocr-venv/bin/pip install --upgrade pip
~/tmp/ocr-venv/bin/pip install easyocr

2) Run the bundled script:

~/tmp/ocr-venv/bin/python3 \
  skills/image-redaction/scripts/redact_substring_easyocr.py \
  --in input.jpg \
  --out output.png \
  --substring "<sensitive-substring>" \
  --substring "<another-substring>"

3) Verify by opening the output image with the read tool.

Notes:

• The script prints the OCR hits + boxes so you can audit what was blurred.
• It’s proportional (bbox substring slicing), which is usually good enough for UI screenshots; if it ever drifts, increase --pad a bit.

1. Inspect the image

Read the image with the read tool to see it visually. Identify what’s sensitive and what must stay visible.

2. Measure before blurring

Get image dimensions and locate landmarks (icons, badges, borders) by sampling pixel colors:

from PIL import Image
img = Image.open("input.png")
# Find landmark positions by scanning for distinctive pixel colors
for y in range(start, end):
    for x in range(start, end):
        r, g, b, *a = img.getpixel((x, y))
        if <condition>:  # e.g., bright green badge, scrollbar gray
            print(f"Landmark at ({x}, {y})")
            break

Use landmarks as anchors to calculate text regions relative to stable visual elements.

3. Blur one region at a time

Start with one region, verify visually, then add more. Don’t blur everything in one pass.

from PIL import Image, ImageFilter

img = Image.open("input.png")
blur = ImageFilter.GaussianBlur(12)

def blur_region(img, box):
    """Blur a precise rectangular region. box = (x1, y1, x2, y2)."""
    crop = img.crop(box)
    for _ in range(3):  # triple-pass for strong blur
        crop = crop.filter(blur)
    img.paste(crop, (box[0], box[1]))

# Blur each sensitive region individually
blur_region(img, (x1, y1, x2, y2))
img.save("output.png")

4. Verify and iterate

Read the output image. Check for:

• Text leaking at edges (extend box by a few px)
• Bleed onto adjacent UI elements (shrink box or adjust boundary)
• Unblurred sensitive content you missed

Key Rules

• Each text element is its own region. Don’t use one big rectangle across multiple elements — that bleeds onto icons, badges, scrollbars.
• Measure text right-edges per row. Text lines have different lengths — scan for the rightmost non-background pixel per line.
• Respect UI boundaries. Scrollbars, badges, icons, timestamps — find their pixel positions and don’t cross them.
• Triple-pass blur (3 iterations of GaussianBlur(12)) is enough to make text unreadable without creating obvious blur artifacts.
• Work from landmarks. Find stable visual anchors (badge colors, icon positions, borders) first, then define text regions relative to them.

Common Pitfalls

• Eyeballing coordinates instead of measuring → multiple iteration rounds
• Uniform blur width for variable-length text → bleeds onto scrollbar/margins
• One big rectangle instead of per-element boxes → destroys adjacent UI
• Forgetting to check the last/first row which may have different layout
• Footer/header proximity — bottom rows can bleed onto footer chrome