How to Automatically Turn Your Twitter Likes Into Visuals for Social Media

Here's a neat little trick that I use to auto-generate original visual social media content with almost zero effort
by Jon Yongfook ·

Contents

    Here's a neat little trick that I use to auto-generate original visual social media content with almost zero effort.

    In this tutorial I will show you how to use Bannerbear, Zapier and Buffer to perform this fully automated workflow:

    1. Capture Liked Tweets
    2. Apply a Quality Filter
    3. Auto Generate a Visual
    4. Schedule For Posting

    The result is auto-generated images that look like this:

    If you follow BannerbearHQ on Twitter you may have seen some of this style of image pop up on the feed. Well, the curtain has now been drawn back… it's all fully automated!

    A Note on Authenticity

    One thing before we start: with great power comes great responsibility!

    This technique can pretty much fully-automate a social media account with auto-generated content. Sometimes that may be appropriate, other times it may not be - it will depend on your brand and the goals you have for social media.

    Personally, I use this technique to supplement other types of content that I post on social - it's not the only thing I post.

    The Finished Zap

    If you are already familiar with Zapier, Buffer and Bannerbear already and just want to view / copy the finished zap, here is the link.

    For everyone else, lets get started!

    Capture Liked Tweets

    Zapier features a trigger that activates whenever you like a Tweet. This is how our automated workflow begins, so choose that trigger in Zapier:

    Choose which account you want to track the likes from and that's all for step 1!

    Apply a Quality Filter

    Here's where things start to get a bit more interesting.

    Not every piece of content that you Like on Twitter is quote-worthy. So we don't really want everything we like on Twitter to end up auto-generating an image.

    But at the same time, we don't want to have to alter our Like behaviour to cherry-pick content specifically for this workflow. Ideally we should just use Twitter as normal, and let this workflow decide what content to actually push through this process.

    So the next step is setting up a filter.

    You can tweak this to suit your preferences of course since this step is subjective, but personally I have set this workflow to only continue if:

    • The tweet is not a reply to someone (it is a standalone tweet)
    • Has a certain amount of likes
    • Is under a certain character count - Bannerbear features auto font-resizing so text length is not really an issue, but I'm looking for short-punchy tweets as they work best as image quotes
    • Does not have any links or mentions - again, same reason as above I'm looking for standalone text-based tweets that don't reference anything external

    Auto Generate a Visual

    The next step involves Bannerbear so if you haven't already, sign up for an account.

    I have added a quote style template for you to use with this tutorial - you are of course free to design your own template using the Bannerbear template editor!

    Add the template to a new Project:

    This template is already set up with the layers needed for a tweet image, those being:

    • Tweet text
    • Author name
    • Twitter handle
    • Avatar

    Once you've added the template to a Bannerbear project, make a note of your Project API Key as you'll need that next:

    Create an Image in Bannerbear via Zapier

    Back in Zapier, add the next step in the automated workflow - choose the Bannerbear app and the "Create Image" action:

    Zapier will then ask you what Bannerbear template to use and present a dropdown list to choose from. Choose the template you just added.

    The final part of this step is simply populating the template with data from the Tweet:

    Connect the "Tweet text" field to the text data from the tweet, the "Handle text" field to the screen name data etc.

    One thing to note is that in my Zap I have an earlier step to transform avatar urls provided by the Twitter API into a higher resolution version. If you use the avatar urls from the original tweet data, you will find that they are small and the result will be pixelated.

    Run a test to ensure everything is working correctly and you should get a fresh, auto-generated image as a result:

    Next step - lets do something with this image!

    Schedule For Posting

    Now that the image has been rendered by Bannerbear, we need to do something with it :)

    You could post to social media straight away via Zapier using this workflow but personally I prefer to add to my Buffer queue so that I don't overwhelm my feed. As the next step in the workflow I post the image to Buffer with a simple text message that includes the @name of the original author:

    And that's it!

    Now you have an automated image generation workflow that creates fresh visuals when you Like tweets on Twitter (as long as they pass your filter criteria) and then schedules them for posting to social!

    Next Steps

    How might we take this Zapier workflow a step further? How about trying…

    • Sending the image to 2 different Buffer queues
    • Sending the tweet data to 2 different Bannerbear templates
    • Using different Bannerbear templates based on certain critera…
    About the authorJon Yongfook@yongfook
    Jon is the founder of Bannerbear. He has worked as a designer and programmer for 20 years and is fascinated by the role of technology in design automation.

    What To Know About Zapier’s New Chatbots Feature

    Chatbots play a significant role in modern business communication. Thanks to AI and other technological developments, they are easier and cheaper than ever to add into your workflow—even if you can't code. Here's what to know about Zapier's new AI-powered Chatbots product.

    What to Know About Zapier’s New Canvas Feature

    Learn about Zapier's new Canvas product, an AI-powered diagramming tool built to connect people, plans, and apps.

    3 Ways to Dynamically Change Text Color in Your Bannerbear Images

    Automatic text color modification gives your generated images more versatility. Here are three ways to transform text colors with Bannerbear.

    Automate & Scale
    Your Marketing

    Bannerbear helps you auto-generate social media visuals, banners and more with our API and nocode integrations

    How to Automatically Turn Your Twitter Likes Into Visuals for Social Media
    How to Automatically Turn Your Twitter Likes Into Visuals for Social Media