Using AI to create images for blog-posts

· 757 words · 4 minute read

Everybody’s doing AI. And so am I!

Last week, I got bored and decided to mess with the OpenAI-API. This resulted in a script that reads in a blog-post and then generates a square image to go with it. Not exactly rocket-science, but it was fun to mess with.

Read on to see my findings!

What I wanted to achieve 🔗

My goal was mainly to explore the OpenAI API, see if I could build something on top of it.

For this little project, I decided I’d see how good OpenAI would be at creating ‘header-images’ and ‘summary-texts’ for my blog-posts.

The basic idea is very simple:

Blog post -> AI summary -> AI header image

The result 🔗

I had to tinker a bit with the prompts to get something ‘nice’. First I used a standard prompt: “summarize the article”, but this resulted in a very standard answer: “the author writes about…”. Very un-human, and resulting in boring image-prompts.

I finally landed on asking the AI to find the original problem or reason for writing the article, and then write that as a children’s book-title. This creates a more fun description.

I tried several image-styles, but landed on the style of Matisse pretty quickly. It’s fresh in colors, and very abstract.

The abstract images feel more human than a ‘fake photo’, and have the added benefit of needing human-interpretation. That solves the shortcomings of the AI-image generation, as it sometimes generates very weird stuff.

Examples 🔗

Here are some examples of the “children’s book title summary” the AI made, with the accompanying “Matisse drawing”:

Image generated with DallE
Original article (‘Building design’), AI-summary: ‘The Impractical Window’

Image generated with DallE
Original article (‘Parking machine at the zoo in Emmen’), AI-summary: ‘The Confusing Parking Machine: A Story of Redesign’

Image generated with DallE
Original article (‘Ironing device from Hema’), AI-summary: ‘The Confusing Ironing Dial’

Image generated with DallE
This article, original title: ‘Using AI to create images for blog-posts’, AI-summary: ‘Using AI to Create Images for Blog-Posts’ (lol, GPT got lazy and just reused my title! Also, the instructions in the prompt specifically say: no letters…)

Implementation in the blog 🔗

I added images to articles from 2011 (see the archive, scroll all the way down and open some articles from 2011)…

… And I quickly got bored with adding these fake images 😅

I like to tinker, think and then write about that. I had fun creating the script, seeing the result and writing this blog-post because that shows off something I did. Adding computer-generated headline-images to posts feels like showing off with something cool OpenAI did.

Also, all my articles are grossly out-of-date, badly written and abandoned (sorry!). Those articles don’t need fancy computer-generated images, that’s way too high quality for this blog! If I set the bar so high, I would never write anything again 😅

What I learned 🔗

  • I learned tinkering is more fun than the end-result
  • AI is surprisingly cheap as long as you use the ‘old’ DallE-2 and GPT-3.5. I used only 1 dollar for this whole experiment.
  • AI is much better at writing creative headlines than me 😅

The script 🔗

I installed the openai-package for python, added my API key and then wrote a quick script (together with ChatGPT).

The script does three things:

  • read in a blogpost (a markdown-file)
  • call OpenAI to summarize the script into a small piece of text
  • call OpenAI again to generate an image off of this description

The summary and image are both stored with the original file, and that way I can reference them later in Hugo (the software that powers my blog).

import openai
import urllib.request
import os

def summarize_text(text):
	# OpenAI API call to summarize the text
	response = openai.chat.completions.create(
	  model="gpt-3.5-turbo-0125",
	  messages=[
		{"role": "system", "content": "What's the problem the author is writing about? Describe it as the title of a children's book. Only write the title of the book, don't add words like 'the author' or 'the article'"},
		{"role": "user", "content": text}
	  ]
	)
	summary = response.choices[0].message.content
	return summary

def generate_dalle_image(prompt):
	# Function to generate an image using DALL-E API
	response = openai.images.generate(
		model="dall-e-2",
		prompt="Matisse painting of: "+prompt,
		size="1024x1024",
		quality="standard",
		n=1
	)
	image_url = response.data[0].url
	return image_url

def save_summary_to_markdown(summary, filename):
	with open(filename, 'w') as f:
		f.write(summary)

def save_image_from_url(image_url, filename):
	urllib.request.urlretrieve(image_url, filename)

def main(input_markdown_file, output_markdown_file, output_image_file):
	# Read markdown file
	with open(input_markdown_file, 'r') as f:
		text = f.read()

	# Generate summary
	summary = summarize_text(text)

	# Generate image
	image_url = generate_dalle_image(summary)

	# Save summary to a new markdown file
	save_summary_to_markdown(summary, output_markdown_file)

	# Save image to a JPG file
	save_image_from_url(image_url, output_image_file)

input_markdown_file = 'index.md'
output_markdown_file = 'summary.md'
output_image_file = 'summary.jpg'
main(input_markdown_file, output_markdown_file, output_image_file)