Spardocs

Inspiration

Search across a library of inspiration pages to find examples and patterns for the change you're considering.

Inspiration is a searchable library of real-world pages — examples of patterns and components that other stores use. Use it when you're sketching a hypothesis and want to see how others have solved the same problem.

Searchable inspiration library.

What's in it

  • Captured screenshots and HTML of inspiration pages.
  • Semantic search across page text and tags.
  • Pages you've added yourself under Settings → Inspiration — see Settings.
  • Regions you've captured with the Spar browser extension — see below.

Capture inspiration from any site with the browser extension

Saw a competitor doing something interesting while you were browsing? The Spar browser extension lets you select that exact region, save it as inspiration, and optionally turn it straight into a test adapted for your own store — without leaving the page you're on.

Connect the extension

Click the Spar extension icon in Chrome's toolbar, then Connect Spar account. This opens Spar's approval page (/extension/connect) in a new window, already signed in as you — approve the connection there and the extension picks it back up automatically.

Capture a region

  1. Click the extension icon and choose which of your Spar sites you're capturing for (only shown if you have access to more than one).
  2. Click Start capture. Hover highlights candidate regions on the page; click one to select it, then confirm.
  3. Review the captured region, add an optional note, then choose:
    • Save inspiration — keeps the capture without generating anything.
    • Create test — queues generation immediately. You can close the tab; nothing blocks on it.

What happens after Create test

Spar interprets why the pattern works, adapts it to your site's brand and content (never copying the source site's actual text, products, or styling), and maps it to a real page on your own site. It creates a backlog test with one generated variation — including a brand-adapted mockup for visual patterns — and runs it through the same pipeline as every other generated variation. Once the variation has content and a working preview, Spar creates an in-app notification linking straight to it, already open in the normal Variation editor with live preview, version history, and the Jade assistant.

Needs input

If Spar can't confidently match the pattern to one of your own pages, the request is marked Needs input rather than guessing. Open the request at /t/<your-team>/s/<your-site>/inspiration/requests/<request-id> to pick the correct target page yourself; generation resumes from there without recomputing the interpretation.

Saved captures

Anything saved without generating a test — and anything still generating — shows up under Inspiration → Capture (/t/<your-team>/s/<your-site>/inspiration/capture), separate from the crawled inspiration library above. From there you can start Create test on a saved capture at any time, or delete it — deleting genuinely removes the stored images, not just the listing.

What's captured, and what isn't

  • Captured: a screenshot of the region you select, the page's sanitized HTML/structure around it, and a bounded set of computed styles needed to understand layout.
  • Never captured: cookies, local/session storage, password fields, hidden inputs, form values, or event handler/script source. Form inputs are blanked and common payment/auth/personal-data attributes are redacted before anything leaves the page.
  • Deleting a saved capture removes its stored images from Spar's storage, not just its entry in the Saved view.

Exact matches and near-misses

When you search, results are split into two groups:

  • Exact matches — pages that closely match your query.
  • Near-misses — pages that are related but less confident. These can surface unexpected inspiration from adjacent patterns you might not have thought to search for.

Open any result to see it full size, then flip through the rest with the previous/next arrows or your keyboard's arrow keys instead of going back to the grid between each one.

When to use it

  • You're writing a hypothesis and want to attach a reference for "this kind of treatment".
  • You're proposing a redesign and want to back it up with examples.
  • You're stuck on what to test and want to scroll through ideas.

Last updated on

On this page