• a good life
  • Posts
  • Streamline Facebook Ad Creation With Midjourney, ChatGPT, and Figma: A Step-by-step Guide

Streamline Facebook Ad Creation With Midjourney, ChatGPT, and Figma: A Step-by-step Guide

I recently started experimenting with Facebook ads for my Skool community.

And I figured,

“might as well try to use AI to make this process more streamlined”

After some research and experiments, I’ve found a dope way to make this process much faster.

Let’s get into it.

What You’ll Need

For this workflow you will need to the following tools:

You should create a folder on your computer to save all of the images and ad copy we create (more on this later).

With that out of our way, we can move onto the first step.

Starting the Journey (with Midjourney)

Midjourney is my go-to tool for AI image generation.

Why?

  • it’s by far the best image generator out there

  • it has a rabid community who are always experimenting and sharing their results

When starting this process, we need to first come up with some ideas for ad creative images to create.

Ways to do this:

  • find images you like and use those to remix in Midjourney

  • use ChatGPT to help you ideate image concepts

You can use the image descriptions generated by ChatGPT as inspiration (or you can start from scratch).

I’m not going to go deep into Midjourney prompting techniques in this article.

So check out their documentation on prompt writing best practices if you are a complete beginner.

Here’s an example:

Here’s the output:

Do this a few more times until you have a good set of images for the ad creatives.

Important:

Once you’ve got a nice set of images you like, save them to your computer in that folder I told you create in the beginning.

Put them into a subfolder called images.

Now, let’s get to work on our ad copy.

Generating Ad Copy

Let’s look at the anatomy of the Facebook ad we’ll be creating:

Here’s a breakdown of each component:

  • Headline: Attention-grabbing text, concise and compelling.

  • Sub-headline: Additional context, highlights key features or benefits.

  • Image: Eye-catching, relevant visual element.

  • CTA: Direct prompt for specific action, clear and urgent.

We will be using ChatGPT to help us write our ad copy.

Let’s look at the prompt below:

You are an expert copywriter and internet marketer.
Your goal is to help me generate ad copy for my product or service.

Here is information about what I'm advertising below in <info> tags:

<info>
{$BUSINESS_INFO}
</info>

Please do the following:
1) Analyze the business information and identify the key selling points and value props.
2) Use your knowledge of consumer psychology and persuasive copywriting to think of different ways we could angle the ad copy to our potential customers.
3) Generate a 5 ad copy sets. Each set should include:
- Headline
- Subheadline
- Image description
- CTA
4) Take each ad copy set and put it into a CSV file with the following columns: #headline, #subheadline, #cta, #image
5) Provide me the CSV file for download


---
Begin!

Replace the {$BUSINESS_INFO} variable with whatever you are trying to sell.

Then paste that bad boy into ChatGPT.

It should provide you a downloadable csv file that will look something like this:

After you download this file, move it to our shared folder where we saved our images previously.

You’ll notice the #images header has the image descriptions that ChatGPT generated for us.

Replace these with the file names of each Midjourney image we saved to our images subfolder.

Organizing Our Ad Variaions

Alright, so far we’ve:

  • generated Midjourney images for our ads

  • generated ad copy variations for our ads

  • saved all of these in a shared folder on our computer

  • adjusted the #images column to have the file name of one our images in the images folder.

Your shared folder should look like this:

This is what it should look like

Then you will select both the CSV and the images folder, and compress them into a zip file:

Now we’re ready to move onto Figma and CopyDoc.

Creating Figma Design Templates

I’ve already shown you the anatomy of our ad creatives above.

Now let’s make an ad creative frame in Figma.

You can experiment with different dimensions, but for this article we’ll just focus on 1080px x 1080px frames.

Step 1: Make the Frame

Go to Figma and click the Frame button on the top right:

Step 2: Set the Dimensions

Make the dimensions 1080 × 1080:

Step 3: Create the Base Template

Remember the anatomy of our creative:

  • Headline

  • Sub-headline

  • Image

  • CTA

This is next part is crucial so pay attention…

Notice how I’ve named the elements inside of the creative frame with the corresponding column names from our CSV (e.g., #cta on the CTA text):

CopyDoc requires these to correspond to the columns in the CSV we will be suing to inject our variations into our creative templates.

With that said, let’s move on to using CopyDoc.

Copydoc Time

First add the CopyDoc plugin to Figma:

You should be able to activate it if you look for it on the right sidebar in Figma:

Now, this is where we’re bring it all together…

I hope you’re sitting down when you do this.

You might fall over when you realize how much time this is gonna save you.

Here’s me loading 3 variations of ad creatives into my Figma frame presets:

The high-level steps are:

  1. Activate CopyDoc Plugin

  2. Select all the frames you have prepared

  3. On the CopyDoc popup, select the “Sync Content from Spreadsheet”

  4. Drag and drop your compressed zip file that contains your CSV and images

  5. Click the button that will say “Sync Rows with Layers”

After that, each frame will be populated with the different ad copy and images.

And I also like to do a little touch up afterwards:

Human-in-the-loop.

I have the final say and I wanted to change the colors.

Remember, you are always in the creative driver seat.

What Now?

With this new process, you can now experiment with Meta ads you want to run and see which perform best.

I just stared experimenting this week with a creative I made for my Skool.

And to be transparent, here are the results after a week:

For someone who had no prior experience running Meta Ads until this week, I’ll count this as a win (and I didn’t spend nearly as much time making the creatives thanks to this process).

The Big Picture

This process will allow you to create Meta Ads with:

  • less time

  • less effort

  • and more volume

You’ll be able to iterate faster on your ads and find what works faster.

AI is only going to continue to augment our creative process as humans.

It’s important to learn these new methods early so you can start cultivating the mindset of a creative in the new age—build your AI skill stack.

I hope you enjoyed this breakdown and are as excited by it as I am.

That’s all for now folks! ‘Til next time, much love and peace y’all 🤠 

Shoutouts

Thank you to the folks over at Foreplay for publishing their experiments and inspiring the breakdown I made today.