Back to ScreenshotOne in Google Sheets
SheetXAI logo
ScreenshotOne logo
ScreenshotOne · Google Sheets Guide

Build a Multi-Viewport Screenshot Grid From a Google Sheet

2026-05-14
5 min read

The Scenario

You're a front-end developer. Your team just finished a major CSS refactor and the QA handoff requires visual sign-off across three breakpoints — desktop, tablet, and mobile — for thirty staging page URLs that are sitting in column A of a Google Sheet. The designer doing the review needs all three screenshots per page in adjacent columns so she can compare breakpoints in one scrollable view. No downloading zip files. No navigating to three separate URLs per page. One sheet, three columns of image URLs.

The refactor ship date is Friday. It's Thursday morning.

The bad version:

  • Write a script (or construct thirty sets of three API calls manually) — one for desktop, one for tablet, one for mobile — per URL.
  • Collect ninety image URLs, map each back to the correct row, paste them into columns B, C, and D.
  • Realize the row ordering got jumbled because your script processed URLs asynchronously and the responses came back out of order.
  • Re-sort and re-verify ninety cells before handing the sheet to the designer.

The QA deadline is in a few hours. Ninety API calls, ninety pastes, and a sort pass is not what Thursday morning should look like on a ship-day sprint.

The Easy Way: One Prompt in SheetXAI

SheetXAI is an AI agent inside your Google Sheet. It reads the URL list, fires three ScreenshotOne captures per URL through its built-in integration, and writes the three image URLs into columns B, C, and D — in the correct row order, in one shot.

For each URL in column A, take three ScreenshotOne screenshots — desktop (1920x1080), tablet (768x1024), and mobile (375x812) — and paste the three image URLs into columns B, C, and D.

SheetXAI reads column A, fires three captures per URL at the specified dimensions, and writes desktop URL in B, tablet URL in C, mobile URL in D — row order preserved.

What You Get

  • Column B: desktop screenshot URL (1920x1080) for each page.
  • Column C: tablet screenshot URL (768x1024) for each page.
  • Column D: mobile screenshot URL (375x812) for each page.
  • Row order matches column A exactly — no sorting needed before handing to the designer.
  • Any failed capture gets a note in the relevant column so the designer knows which breakpoint needs a manual check rather than getting a silent blank.

What If the Data Is Not Quite Ready

The viewport dimensions need to match your design system exactly

Your design system uses non-standard breakpoints — 1440px for desktop, 834px for tablet, 390px for mobile — not the defaults.

For each URL in column A, take three ScreenshotOne screenshots at 1440x900 (desktop), 834x1194 (tablet), and 390x844 (mobile) and write the image URLs into columns B, C, and D.

Some pages have already been captured and don't need to be re-shot

A first pass was run yesterday and columns B, C, D have URLs for some rows. You want to re-capture only the rows where at least one column is still blank.

For each row in column A, check if columns B, C, and D all have values — skip any row where all three are filled. For the rest, take ScreenshotOne screenshots at 1920x1080, 768x1024, and 375x812 and write the missing image URLs into the empty columns.

The staging URLs require a specific HTTP header for access

The staging environment is behind basic auth, so ScreenshotOne's standard capture returns a login screen instead of the page.

For each URL in column A, take three ScreenshotOne screenshots at 1920x1080, 768x1024, and 375x812 — pass the Authorization header "Basic <encoded_credentials>" with each request. Write the image URLs into columns B, C, and D.

Kill chain: validate staging URLs are live, capture all three viewports, and flag broken pages

You want confidence that you're not handing the designer blank screenshots because some staging pages aren't deployed yet.

For each URL in column A, first verify the page returns a 200 status — if it doesn't, write "NOT LIVE" in column B and skip to the next row. For pages that are live, take ScreenshotOne screenshots at 1920x1080, 768x1024, and 375x812 and write the desktop URL in column B, tablet in column C, mobile in column D. When done, write a summary count in cell F1: "X of 30 pages captured successfully."

Health check, capture, and summary — everything the designer needs to start the review without coming back to ask questions.

Try It

Get the 7-day free trial of SheetXAI and open your staging URL sheet — list the pages in column A and ask SheetXAI to capture desktop, tablet, and mobile screenshots and write all three image URLs across columns B through D. Also see how to batch screenshot landing pages or the full ScreenshotOne overview.

Stop memorizing formulas.
Tell your spreadsheet what to do.

Join 4,000+ professionals saving hours every week with SheetXAI.

Learn more