Best practices for large images

[loiclane]

Godot Version

Godot 4.3

Question

Hello! Utter novice question here.

I’m trying to make a 2D game with a painted background/map (not pixel art), that allows zooming in to look at details (hidden objects, text on posters, …).

If I use a single image, it would need to be at least 3840 x 2160 pixel at 100%, just to fill the screen, but could be larger.

I don’t want the image to end up blurry when zoomed in, but a 38400 x 21600 image is not exactly viable either. Svg wouldn’t work as godot rasterizes it.

Does anyone have any tips on how to handle the zoomed in display?

Thanks

[vonpanda]

Even tho it’s not pixelart, if you don’t mind seeing the pixels, you can change the filtering of the image

The texture on the left is in “Nearest” the one on the right in “Linear”

Otherwise you might want to break up the image, and switch what is visible on screen:

• Not zoomed-in you display a single 3840 x 2160 texture
• 25% zoom you start fading it out and display a 3840 x 2160 render of a quadrant
• 50% zoom you fade the quadrant and display 1/16 …
  
  
  
  
  

[hexgrid]

SVG won’t work directly, but if your “image” is a 3D model, it’ll scale just fine. Rather than an actual image, consider if it’s possible to take something like an SVG and turn that into geometry with selective texturing. You could even use things like level of detail to handle revealing hidden details at zoom.

Have a look at the PS2 game Okami (available on Steam, IIRC) – it’s all rendered 3D geometry, but every frame looks like it was painted with a brush.

[loiclane]

@vonpanda Thanks, that looks breaking up the image would work. I could probably optimize by areas that need a zoomed in version or not, too, depending on the camera position.

@hexgrid It won’t work with my current 3d skills (or Godot skills, I started two days ago) but i’m definitely keeping that in mind for my future projects.