gi-web-optimizer

name	gi-web-optimizer
description	Optimize approved assets for web publishing in The Great Inversion asset pipeline. Use when Tim says "optimize for web," "make web-ready," "resize and compress," "create thumbnails," "generate OG images," "batch optimize," or wants to convert approved assets from 05-Approved-Assets into web-ready versions for 06-Web-Ready. Handles resize, compress to WebP, thumbnail generation (400px), OpenGraph crop (1200x630), and feature strip crop (1200x400), then updates the Asset Register tracker.
metadata	{"author":"Tim Dickey","version":"1.0","pipeline-step":"5"}

GI Web Optimizer

Automates Step 5 of the GreatInvert Asset Pipeline — optimizing approved assets for web publishing.

When to Use This Skill

Use when Tim asks to:

• Optimize approved assets for web
• Make assets web-ready
• Resize and compress images
• Create thumbnails, OG images, or feature strips
• Batch-process images from 05-Approved-Assets into 06-Web-Ready
• Run Step 5 of the asset pipeline

What It Produces

From each approved source image, the optimizer generates up to 4 outputs:

Output	Dimensions	Subfolder	Description
Optimized full-size	Auto (based on aspect ratio)	Optimized-Images	Compressed WebP at quality 82
Thumbnail	400px wide (proportional height)	Thumbnails	Small preview version
OpenGraph crop	1200 x 630	OpenGraph	Social sharing preview
Feature strip	1200 x 400	Feature-Strips	Horizontal banner crop

Instructions

Single Image Optimization

1. Identify the approved asset file (should be in 05-Approved-Assets or local workspace).
2. Run the optimize script:

python /home/user/workspace/skills/gi-web-optimizer/scripts/optimize_asset.py \
  <source_image> <output_dir> \
  --quality 82 --format webp

3. Review the JSON output for dimensions and file sizes.
4. Optional flags: --skip-thumb, --skip-og, --skip-strip, --prefix <name>, --format png|jpg.

Batch Optimization

1. Collect approved assets into a directory or create a text file listing image paths (one per line).
2. Run the batch script:

python /home/user/workspace/skills/gi-web-optimizer/scripts/batch_optimize.py \
  <input_dir_or_file_list> <output_dir> \
  --quality 82 --format webp

3. The script processes all PNG, JPG, JPEG, and WebP images found.
4. An optimization_summary.json file is saved to the output directory.

Update the Tracker

After optimization, update the Asset Register with web-ready entries:

python /home/user/workspace/skills/gi-web-optimizer/scripts/update_tracker_webready.py \
  <tracker.xlsx> <optimization_summary.json>

This adds new rows to the Asset Register tab for each derivative (thumbnail, OG image, feature strip, optimized full-size) with:

• Auto-incremented Asset_ID (AST-XXX)
• Stage set to "Web-Ready"
• File path pointing to 06-Web-Ready subfolders
• Dimensions and format metadata
• File size noted in the Notes field

Upload to Google Drive

After optimization, upload the web-ready files to the correct subfolders in the GreatInvert Google Drive:

• 06-Web-Ready/Optimized-Images/
• 06-Web-Ready/Thumbnails/
• 06-Web-Ready/OpenGraph/
• 06-Web-Ready/Feature-Strips/

Dimension Presets

The optimizer auto-detects the closest aspect ratio and applies these target sizes:

Aspect Ratio	Target Size
16:9	1920 x 1080
4:3	1600 x 1200
1:1	1200 x 1200
3:4	1200 x 1600
9:16	1080 x 1920

Override with --target-width and --target-height flags.

Examples

Single hero image:

Tell Computer: "Optimize GI_playbook_ai-fluency_hero_home_approved_20260329_v01.png for web"

Batch of approved assets:

Tell Computer: "Batch optimize all images in 05-Approved-Assets/Website for web publishing"

Custom quality and format:

Tell Computer: "Optimize the playbook mockup at quality 90 in PNG format, skip the feature strip"