Inspiration

Modern software engineering has made enormous strides in writing code with AI, but the post-code DevSecOps lifecycle—the "Life After Code"—remains deeply fragmented:

Blind Text-Only Triage: When end-to-end browser tests or visual UI components fail, CI logs output walls of stack traces with zero visual context. Engineers lose hours attempting to reproduce what actually broke on screen. Accidental Credential Exposure: Screen captures and reproduction dumps frequently leak sensitive user tokens, test credit cards, or API secrets into ticket threads. The Hidden Cloud Carbon Crisis: Traditional image watermarking and batch transformation tools rely on heavy server farms running CPU-intensive image decoders for every single upload, burning massive datacenter electricity and driving up cloud carbon emissions.

What it does

Watermark & Resize Studio is a privacy-first, zero-upload photo watermarking and batch processing platform combined with an autonomous GitLab Duo DevSecOps & GreenOps Agent: Client-Side Image Studio: Processes 100+ high-resolution images simultaneously in-browser using HTML5 Canvas API, Pica.js, and Web Workers. Zero images leave the user's browser tab. Autonomous Visual Triage & SOP Generator: Upon pipeline regressions or issue triggers, the Duo Agent executes the QuickCast Screen-to-Action Protocol, extracting keyframe telemetry from playback buffers and auto-generating an illustrated, timestamped Markdown Bug Report / Standard Operating Procedure. Zero-Leakage Privacy Redaction: Automated regex and visual bounding-box redaction filters automatically detect and mask Credit Cards (PCI DSS), CVVs, Social Security Numbers, and secret API keys before artifacts leave the runner. Hands-Off Self-Healing & Release: The Duo Agent inspects failing test logs, drafts remediation merge requests, verifies the build, and promotes passing versions directly to Google Cloud staging and production without human intervention. GreenOps Carbon Verification: Measures and certifies software carbon intensity directly within the CI/CD pipeline using the Green Software Foundation SCI framework.

How we built it

We orchestrated an end-to-end 7-stage DevSecOps lifecycle on GitLab:

GitLab Duo Agent Platform: Configured via .gitlab/duo-agents/visual-triage-agent.yml in Hands-off mode to autonomously handle failure triage, visual keyframe analysis, and remediation MR generation. GitLab CI/CD Pipeline (.gitlab-ci.yml ): Stage 1 (lint): Syntax validation and static structure checks. Stage 2 (test): DevSecOps privacy scan and token redaction tests across 165+ production files. Stage 3 (sci_carbon_benchmark): Automated Green Software Foundation SCI carbon intensity calculation. Stage 4 (package): Automated POSIX-compliant release artifact compilation (build-deploy.py). Stage 5 (deploy_google_cloud): Automated Google Cloud Storage staging mirror. Stage 6 (deploy_production): Cloudflare Pages production deployment. Stage 7 (verify_post_deploy): Live health probe and canonical SEO verification. We orchestrated an end-to-end 7-stage DevSecOps lifecycle on GitLab:

Frontend Stack: Native HTML5, Canvas API, Web Workers, Pica.js (Lanczos interpolation), JSZip (client-side ZIP packaging). 🌱​GreenOps & Sustainability: SCI Carbon Benchmark ($5,000 Special Prize)

We evaluated our system against the Green Software Foundation Software Carbon Intensity (SCI) specification

📐 Green Software Foundation: SCI Specification Model

$$ \text{SCI} = \frac{(E \times I) + M}{R} $$

Variable Definition Project Specification
$E$ Operational Energy Consumed 0.002 kWh (Client static CDN) vs. 0.85 kWh (Cloud decoders)
$I$ Grid Carbon Intensity 436 gCO2eq/kWh (Global operational baseline)
$M$ Embodied Hardware Emissions Negligible (Offloaded to client device lifecycle)
$R$ Functional Unit 1,000 processed batch photos

Every pipeline execution automatically runs this benchmark via tests/test_ci_pipeline.py, proving a >99.7% reduction in datacenter compute carbon compared to legacy cloud processing.

Challenges we ran into

YAML Schema Multi-Level Parsing: Ensuring our complex multi-stage pipeline configuration conformed strictly to GitLab's schema parser while retaining rich console logging and bash conditions. In-Runner Keyframe Privacy Redaction: Engineering real-time regex pattern matchers for payment cards and tokens so that automated test screenshots never accidentally expose sensitive data in issue comments or merge requests. Cross-Platform POSIX Path Compliance: Normalizing Windows backslash directory structures into strict POSIX forward-slash paths for flawless Cloudflare Pages and Google Cloud staging deployments.

Accomplishments that we're proud of

Zero Server Uploads: Full client-side processing guaranteeing complete privacy for creators and businesses. All 7 CI/CD Stages Passing: A green, resilient pipeline history visible to all judges. Hands-off Duo Agent Loop: Complete visual-to-action automation from failure detection to formatted SOP bug reports. Certified Open Source: Clean OSI-approved MIT License visible and detected directly on GitLab.

What we learned

Zero Server Uploads: Full client-side processing guaranteeing complete privacy for creators and businesses. All 7 CI/CD Stages Passing: A green, resilient pipeline history visible to all judges. Hands-off Duo Agent Loop: Complete visual-to-action automation from failure detection to formatted SOP bug reports. Certified Open Source: Clean OSI-approved MIT License visible and detected directly on GitLab.

What's next for Watermark Studio: Autonomous Visual Triage & GreenOps Agent

Expanding our Duo Agent to automatically suggest optimal image compression ratios based on real-time network conditions. Deepening integration with GitLab Service Desk so user bug submissions automatically generate visual reproduction replays hands-off.

Built With

Share this project:

Updates

Submission history