- 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:
Copydoc (Figma plugin)
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:
Activate CopyDoc Plugin
Select all the frames you have prepared
On the CopyDoc popup, select the “Sync Content from Spreadsheet”
Drag and drop your compressed zip file that contains your CSV and images
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.