DEV Community

snackboy
snackboy

Posted on

Certainly! Absolutely! I apologize!

My experience with artificial intelligence systems is rather limited. But I have been tasked with identifying projects that might be useful to our institution so when the opportunity presents itself, I try to employ AI for help.

As a volunteer for our high school marching band association, I am in charge of the buttons. This includes making them with the button press as well as designing and printing. In most cases, we have PDF files on the ready so that we can just print templates as needed. But as I was checking the inventory for our home show, the "got band?" button was missing it's corresponding PDF meaning I had no digital version of the button and thus needed to start from scratch. AI to the rescue?

I've heard good things about Claude.ai so I decided to start with that. My prompt and Claude's initial response was promising:

Image description

which yielded the following design:

Image description

Pretty good so far. I wanted to the button to mirror the existing design, so I followed up with some design details:

Image description

Image description

This was perfect! And Claude even gives you the SVG code:

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 225 225">
  <!-- Button background -->
  <circle cx="112.5" cy="112.5" r="112.5" fill="black"/>

  <!-- White border -->
  <circle cx="112.5" cy="112.5" r="107.5" fill="none" stroke="white" stroke-width="5"/>

  <!-- Text -->
  <text x="112.5" y="100" font-family="Arial, sans-serif" font-size="48" font-weight="bold" text-anchor="middle" fill="white">got</text>
  <text x="112.5" y="150" font-family="Arial, sans-serif" font-size="48" font-weight="bold" text-anchor="middle" fill="white">band?</text>
</svg>
Enter fullscreen mode Exit fullscreen mode

Now let's compare that experience with Google's Gemini. I started with a similar prompt and Gemini yielded the following:

Image description

Okaayyy...this is good information, but it didn't quite make the leap that Claude did in actually doing the design, so I asked Gemini if it could do the design:

Image description

Answering Gemini's prompts for font, font-weight, text alignment, and border (which I said it was to be around the edge of the button), Gemini the rendered the following result:

Image description

Not even close...but okay. After I answered "entire button" to it's question, Gemini produced this:

Image description

What is going on here?!?!? It looks like Gemini isn't "designing" anything, but just searching for images that "fit" the criteria. However, the persistent person I am who says "Its gotta be my fault" gave it another try.

Image description

Image description

Image description

"Here's a revised preview:" and then no actual preview. This is just comical.

Image description

Okay. I'm done. I give up. You win Gemini.

Top comments (0)