Welcome to my little project where I use the power of GPT-4 and DALL-E/StableDiffusion to generate gamer profile avatars by simply providing an API key and typing in your gamer tag. This project is using the OpenAI API to generate images with DALL-E.
Also in this project I wanted to try out all the new, hot, blazing fast (😛), {{insert buzzwords here}} Next.js 13 features including the app router and server actions. If you see anything in the code that could be improved please feel free to open on issue/PR.
I came up with this idea by doing an internal hackathon at work. I wanted to do something with GPT-4 and DALL-E and I thought it would be cool to generate avatars for gamers. I then thought about how I could make this a little bit more interesting and came up with the idea to make the user type in their gamer tag and then generate an avatar for them.
I basically fed GPT-4 with some documentation on how to create the perfect DALL-E prompts. There are a lot of good guides on the internet which you can copy-paste into GPT-4. After providing it with some documentation and some guides on DALL-E prompt engineering I made it generate at least 5 prompts per gaming genre. The genres were also generated by GPT-4.
The full last call-to-action prompt is the following:
Now act like a professional DALL-E prompt engineer and take into account all the
information I just provided on how to create the perfect DALL-E prompt.
Your task now is to create DALL-E prompts to create an avatar image for a gamertag. Come
up with some cool ideas of some prompts with have something to do with gaming. Come up
with at least 10 distinct areas that have something to do with gaming, like FPS, RPGs,
anmine and so on and give me 3 prompts per area.
Output the promtps in form of a Javascript array of strings and the strings are the
prompts. The gamertag substitution string should be "{{gamerTag}}"
I saved a lot of tokens by copying pieces of the prompt documentation and then telling GPT-4 to respond with "READ" to it's answer as short as possible.
I then copied the output to my code and used the users' inputs to generate random images
for their gamer tags. This project is using the openai npm package to generate images
with DALL-E.
this project uses pnpm (>= 8)
pnpm installand then start the development server:
pnpm devOpen http://localhost:3000 with your browser to see the result.