Making Game Graphics in Midjourney (part II)

This is part 2 of how I made the graphics for my game Midsummer’s Eve.

Click here to read part 1, which explains how I generated the initial images using Midjourney.

In part 2 I’ll show you the basics of how I edited the images using Photoshop. Here’s the thing: YOU DON’T NEED TO BE AN ARTIST to do this! You don’t even need any practice with Photoshop. The software has become so user-friendly over the last several years, with capabilities that exceed most digital artist’s, that pretty much anyone can edit Midjourney photos to look seamless and authentic (for better or for worse, depending on how you feel about AI art in general).

Example 1 - Magical Path

This image received some minor edits that took me probably 5 minutes to complete in Photoshop. The main difference is obvious: it wasn’t dark enough to fit the evening theme of the other images.

What I started with
The end result

First, I darkened the image to give it the same evening feel as the others using only two steps:

  1. In Photoshop, create a new fill layer, using a dark, saturated indigo color.
  2. Set the layer to “Multiply” and the opacity to “35%.”

Second, I used this amazing, and amazingly easy-to-use, feature in Photoshop called “Generative Fill.” 

  1. Use the lasso tool to select an area that you want to change.
  2. Click “Generative Fill” (with no prompt).

This new feature (which is also AI) is a game-changer for editing any photo or artwork. In the past it would have taken me two or three hours to remove all the weird details in this image, and now Photoshop AI does it for me with the click of a button.

Example 2 - The News Stand and Snack Shop

I knew I wanted some sort of shop for the player to interact with that they didn’t have to enter – something with a walk-up window. I tried prompting for hot dog stands, cotton candy stands, flower stands, and news stands, but as you can see from the examples below, most of the images I got were bizarre and didn’t fit well with my other images.

An attempted “snow cone stand”
An attempted “hot dog stand”

I ended up taking two different shops from different images, editing them to look remove weird details, and inserting them into a different scene. This is the final result:

The steps I took to combine these three images:

  1. Use Photoshop’s generative fill or content-aware fill to remove the large house, replacing it with the trees in the background.
  2. Cut out the large tree and make it smaller, then use content-aware fill to fill in the gaps.
  3. Cut out the buildings and add them to the scene, then decrease their brightness and increase the contrast until the lighting matches.
  4. Remove weird details that don’t make sense (e.g. the random wagon wheel in front of the shop), and add details that do make sense (e.g. stacks of newspapers).
  5. Use generative fill to replace the reflections in the water so they actually match the new scene – YES, Photoshop can really do this and it’s amazing!

It really is that easy.

What I started with
The final result

Editing the images actually took a lot less time than generating them in the first place. And looking back, I think I could  have been less picky and generated fewer.

I don’t think I’ll be doing this again for a future game (although I won’t say never), but I’ll definitely be generating images to get good ideas and inspiration for content, composition, lighting, and whimsy.

Thanks for reading. If you haven’t already, try playing my game!

Leave a Reply

Your email address will not be published. Required fields are marked *