Automating Screenshot Creation from Slack Messages

When someone shares a link in Slack, it seems increasingly common that the best you can hope for is a cryptic URL and some emoji reactions hinting at what lies on the other side.

Clicking through often requires authentication, and drops you onto the slippery slope of doom scrolling. There’s a reason these platforms want to make link previews as incomplete as possible. And there is a reason these are something I aim to avoid.

What is bringing people to varying levels of tears?!

I want to stay in the loop, but I don’t want to micro-dose on Social Media throughout the day. I want a system that takes a URL from a Slack message, requests the page on my behalf, screenshots the output, and replies to the message in Slack with the screenshot. I explained this to ChatGPT last night, and it pointed me in the direction of Zapier.

This blog post shows how I achieved this, and some learnings.

Zapier Zaps ⚡️

A Zapier Zap is essentially an automation between two or more apps that connects them and makes them work together without any manual intervention. It helps automate repetitive tasks by triggering actions in one app when something happens in another.

 

My First Zap

The logic is straight forward. It used the Slack and ScreenshotOne connections.

A logic overview of my first Zap

  1. Message pushed from Slack

    • There were a few triggers in the Slack connection I could have used, but for right now I wanted to be in control of when it was triggered - ultimately, I may want it to automatically run when it notices a URL without preview

    • With Zapier connected to Slack, in the menu for any message in Slack, there will be an option to “Push to Zapier”

    • Within the prompt, select the Zap you want to trigger, and Push

  2. Extract URL from pushed message

    • Uses a Text formatter from Zapier to extract a URL from the pushed message (I fear this function may be part of a paid subscription - may need to revisit)

  3. Continue if there is a URL

  4. Take Website Screenshot

    • This takes the extracted URL and passes it to ScreenshotOne

    • I configured the call to ScreenshotOne using this playground - it’s a nice way to make sure the screenshot you generate is useful. Blocking ads, cookie banners, etc. are nice features

  5. Send DM to slack

    • 🛎️ * ding * it’s the screenshot you ordered

1. With Slack connected to Zapier, "Push to Zapier" is now a message option within Slack

1. Selecting which Zap to trigger

5. The End Result

A screenshot delivered via Slack DM

 

Learnings

"Send Direct Message" configuration showing the recipient username is static - it doesn’t need to identify the message sender, making the DM process straightforward

Zaps using the Slack connection are not shared integrations

They are only available to users who have authorized their own Zapier connection and have a copy of the Zap available to them in their own account

  • That means it isn’t a team wide capability

  • That means there is no concept of “the user who pushed the message”. You can assume that user is you, which simplifies the DM step

 

The Zap Runs UI detailing each execution

Zap Runs is critical tooling

  • It details each execution, the data/variables at each step, and where errors were encountered

  • It’s a very well thought through debug experience - kudos to the Zapier team for this

 

Is it a channel, a DM, a thread, or not?

Replying in a thread to Slack Messages is not as easy as it sounds

There is a certain amount of inspection and logic that has to be run on the pushed message to determine if it’s a channel message, a DM, or a threaded reply. My understanding after reading through many forum posts is:

  • If a Channel Name exists, it’s a channel message - not a DM

  • If the Message Thread Ts field exists or has a value that is different from Message Ts then the posted message is in a thread

  • I used this logic to provide an option for the Bot to reply to the thread directly, rather than DM the results