Skip to content
Spectra.fm Docs

Zapier

Use Zapier’s Webhooks to connect Spectra.fm with 5,000+ apps and automate your screenshot workflow.

Setup

Section titled “Setup”

1. Create a New Zap

Section titled “1. Create a New Zap”

In Zapier, create a new Zap with your preferred trigger app.

2. Add Webhooks Action

Section titled “2. Add Webhooks Action”

Search for Webhooks by Zapier and select Custom Request.

3. Configure the Request

Section titled “3. Configure the Request”
SettingValue
MethodPOST
URLhttps://api.spectra.fm/project/YOUR_PROJECT_ID/export

4. Add Headers

Section titled “4. Add Headers”
KeyValue
X-API-KeyYour Spectra.fm API key
Content-Typeapplication/json

5. Set Data

Section titled “5. Set Data”

Choose Raw and enter:

{
  "combinations": [
    {"locale": "en", "theme": "light"},
    {"locale": "en", "theme": "dark"}
  ]
}

Example Zaps

Section titled “Example Zaps”

New Trello Card → Generate Screenshots

Section titled “New Trello Card → Generate Screenshots”
  1. Trigger: Trello - New Card in List
  2. Action: Webhooks - POST to Spectra.fm
  3. Action: Slack - Send Channel Message

New Shopify Product → Generate Marketing Assets

Section titled “New Shopify Product → Generate Marketing Assets”
  1. Trigger: Shopify - New Product
  2. Action: Webhooks - POST to Spectra.fm
  3. Action: Email - Send notification

Weekly Schedule → Export Screenshots

Section titled “Weekly Schedule → Export Screenshots”
  1. Trigger: Schedule - Every Week
  2. Action: Webhooks - POST to Spectra.fm
  3. Action: Google Drive - Upload File

New GitHub Release → Generate App Store Screenshots

Section titled “New GitHub Release → Generate App Store Screenshots”
  1. Trigger: GitHub - New Release
  2. Action: Webhooks - POST to Spectra.fm
  3. Action: Slack - Send notification to #releases

Using Dynamic Data

Section titled “Using Dynamic Data”

Reference data from your trigger using Zapier’s field mapping:

URL:

https://api.spectra.fm/project/{{project_id}}/export

Data:

{
  "combinations": [
    {"locale": "{{locale}}", "theme": "{{theme}}"}
  ]
}

Next Steps

Section titled “Next Steps”