Using AI to create tech icons

Sakharov

Chieftain
Joined
Nov 25, 2023
Messages
86
Hi! Recentrly I tried to generate some arts using ideogram. I think it's good choice to generate tech icons! I think that all added content should fit the entire game stale. So as I am not familiar with design, usage of AI seems to be a good choice.

The most successful generations I put in attachments. What do you think, which promts can be used to fit civ3 style better?
Also how to convert to 256-color PCX correctly?
 

Attachments

  • Automatic weapons 2.jpeg
    Automatic weapons 2.jpeg
    57.7 KB · Views: 51
  • Synthetic fibers.jpeg
    Synthetic fibers.jpeg
    131.6 KB · Views: 31
  • Refrigeration.jpeg
    Refrigeration.jpeg
    109.1 KB · Views: 29
  • Movies.jpeg
    Movies.jpeg
    110.9 KB · Views: 30
  • Movies 2.jpeg
    Movies 2.jpeg
    139.3 KB · Views: 23
  • Mass media.jpeg
    Mass media.jpeg
    143 KB · Views: 26
  • Mass media 2.jpeg
    Mass media 2.jpeg
    151.7 KB · Views: 35
  • Heavy weapons.jpeg
    Heavy weapons.jpeg
    187.6 KB · Views: 27
  • Fission.jpeg
    Fission.jpeg
    52.7 KB · Views: 36
  • Elephant.jpeg
    Elephant.jpeg
    135.6 KB · Views: 31
  • Automatic weapons.jpeg
    Automatic weapons.jpeg
    75.2 KB · Views: 27
  • Covert operations 2.jpeg
    Covert operations 2.jpeg
    70.4 KB · Views: 22
  • Covert operations 3.jpeg
    Covert operations 3.jpeg
    55.7 KB · Views: 30
  • Covert operations 4.jpeg
    Covert operations 4.jpeg
    49.7 KB · Views: 30
  • Covert operations.jpeg
    Covert operations.jpeg
    42.1 KB · Views: 21
  • Elephant 2.jpeg
    Elephant 2.jpeg
    150.8 KB · Views: 29
  • Elephant 3.jpeg
    Elephant 3.jpeg
    143 KB · Views: 30
Sakharov... Those images look very good.
The main problem converting 16 million colors to 254 colors for the Civ Game pcx images is when there are thousands of shades and colors to reduce. Generally too many shades will become pixelated and show splotches and areas that will be the same color rather than a blended graduation.
This is generally the background colors or large areas of graduated color such as the Sky or backgrounds that have lighting that shows thousands of shades of color.

The small pcx images that are 32 x 32 pixels require using only a part of the larger image in many cases and it is best to use several adjustments in brightness, contrast, color saturation and sharpness etc... to get a decent end result for Civ Game images that use a 256 color palette.
There are tutorials you can take a look at to help.

I took your Fission Image and made a Large and Small pcx image you can use and see the end result.
I used error diffusion and nearest color matching in combination along with manually adjusting the images to show better despite the thousands of shades in the background due to lighting and multiple colors.

jpg example and zip file of pcx Large and Small images attached
 

Attachments

Sakharov... Those images look very good.
The main problem converting 16 million colors to 254 colors for the Civ Game pcx images is when there are thousands of shades and colors to reduce. Generally too many shades will become pixelated and show splotches and areas that will be the same color rather than a blended graduation.
This is generally the background colors or large areas of graduated color such as the Sky or backgrounds that have lighting that shows thousands of shades of color.

The small pcx images that are 32 x 32 pixels require using only a part of the larger image in many cases and it is best to use several adjustments in brightness, contrast, color saturation and sharpness etc... to get a decent end result for Civ Game images that use a 256 color palette.
There are tutorials you can take a look at to help.

I took your Fission Image and made a Large and Small pcx image you can use and see the end result.
I used error diffusion and nearest color matching in combination along with manually adjusting the images to show better despite the thousands of shades in the background due to lighting and multiple colors.

jpg example and zip file of pcx Large and Small images attached
How exactly you convert it to PCX?

Particulary Fission looks OK to me, there's not much colors, but I agree that there's a problem. Probably it's possible to make AI use less colors, I'm still exploring possible prompts.
Also I found out another problem: most of pictures look no good after resizing to 32x32, especially if there are small details. For example, that "synthetic fibers" picture. There should be only one object in focus and clear background.
 
Well, even small icon looks OK. But maybe that glowing "electrons" look weird. However, "synthetic fibers" small icon looks like crap.

fissionlarge.pngfissionsmall.png

TV icon looks so-so (that would be "mass media" tech in my future mod, but this time I just replaced existing tech). Maybe TV should be bigger and background should be clear. What about that pink noise on large icon? I used Photoshop to convert from JPG to PCX, how to use it correctly?

TV.png
 
I found that excellent guide about PCX on forum:


I've done everything according to that guide but I still got that magenta artifacts. I first converted my image to 254 indexed colors and added magenta and green to the very end of colormap. What I did wrong? Is there some specific colormap for civ3?

photoshop.png
 
Well, I asked - I found the answer by myself. You have to put magenta in green in the beginning of palette, not in end.
Also small icon now don't look so ugly, cause it now uses different palette.

fridge1.png

About promts. Maybe adding such keywords as "bulky", "90's CGI", "minimalistic", "low-poly" would make a sense. Here's what I got with following prompt:
3D render depicting bow and some arrows. Late 90's CGI style, no small details, bulky, glow around object, clear black background., 3d render, illustration

Archery.jpeg
 
You can change an image to use a range of one color that can look OK too.

Usually if the larger image has many details it is best to use only a part of that image for the 32x32 small image.

Your image on the above post #6 has 19,532 colors but because thay are basically in the same range you can get good large and small pcx images.

It is helpful to adjust the 16 million color image to the same size as the image size you want... then take a screenshot then copy and paste the new image on the pre-sized blank. The colors will be much less and it is easier to finish any adjustments and make a new palette.
 

Attachments

  • same size.png
    same size.png
    30.8 KB · Views: 22
You can change an image to use a range of one color that can look OK too.

Usually if the larger image has many details it is best to use only a part of that image for the 32x32 small image.

Your image on the above post #6 has 19,532 colors but because thay are basically in the same range you can get good large and small pcx images.

It is helpful to adjust the 16 million color image to the same size as the image size you want... then take a screenshot then copy and paste the new image on the pre-sized blank. The colors will be much less and it is easier to finish any adjustments and make a new palette.

Yep, I used similar approach. At first I resized full-color image, and then switch to 256. I just used forced colors in Photoshop. I tried with some picutres, they look prety acceptable. Anyway better than using stock images from Internet. The main issue is to achieve authentic style to fit the game. Today I also tried generating some wonder splashes. This one looks pretty close to civ3 style, it also may be a tech icon. Let's call it Urbanization or so.
 

Attachments

  • Urbanization.jpeg
    Urbanization.jpeg
    211 KB · Views: 16
A bit more wonder splashes. I've been thinking of some coastal SW producing battleships or so.

AssemblyLine.jpegBattleship.jpegBattleship2.jpegChemical Plant.jpeg

And also some potential tech icons. What may portray "gas" technology? Of course, boiling kettle on a gas stove. :D

Archery2.jpegComputers.jpegGas 1.jpegGas 2.jpegGas 3.jpegMiniaturization.jpeg
 
I think if just a few images are added to the Civ Game then the "authentic style" is more important but if the entire game is being made then keeping what ever format you like the same for each image section is best..
 
Some AI-generated government-specific FP splashes. IMO Fascism and Democracy ones looks acceptable, not sure about others.
 

Attachments

  • Monarchy.jpeg
    Monarchy.jpeg
    218.3 KB · Views: 35
  • Feudalism.jpeg
    Feudalism.jpeg
    162.4 KB · Views: 19
  • Fascism.jpeg
    Fascism.jpeg
    214.1 KB · Views: 34
  • Democracy.jpeg
    Democracy.jpeg
    174.6 KB · Views: 37
  • Communism.jpeg
    Communism.jpeg
    190.6 KB · Views: 24
One of recent successful generations. It can be used for some tech named "Draft" or "Mass Army". One of distinctive features of civ3 icons are abstract silhouettes and glow, so I used it in prompt.
 

Attachments

  • glowing-silhouette-of-saluting-soldier-clear-backg-LoleIUr4TZymxe1min-lVQ-B44HhwxSSoqkJThxYDT...jpeg
    glowing-silhouette-of-saluting-soldier-clear-backg-LoleIUr4TZymxe1min-lVQ-B44HhwxSSoqkJThxYDT...jpeg
    55 KB · Views: 29
  • DraftLarge.pcx
    DraftLarge.pcx
    15.9 KB · Views: 11
  • DraftSmall.pcx
    DraftSmall.pcx
    2.1 KB · Views: 16
Tried to make icon with Statue of Liberty. Could be a replace for Democracy or maybe a standalone tech (Liberalism, Human Rights etc). Also I included .zip with some other PCX. I have plans to replace all icons with AI-generated to achieve more consistent style and add some variety to game.
 

Attachments

  • Democracy.jpeg
    Democracy.jpeg
    134.2 KB · Views: 6
  • AI icons.zip
    AI icons.zip
    60.2 KB · Views: 2
I have also been messing around with using AI to generate a few icons. I honestly just consider them placeholders, I would rather have real art made by a real artist, but I also need to be realistic. I'm not going to commission art for a mod for a 24-year-old video game that maybe 10 people will play if I'm lucky.

Also, you should bundle all your icons up and put them in a separate thread in graphics. Modpacks, So they're easier to find!
 
Top Bottom