Zoom out with the Camera

Started by AndreasBlack, 01 Dec 2021, 20:49

« previous - next »

AndreasBlack

I've Searched the forum, but only found how i can center the camera and some similar examples of camera placement.

My game resolution is 320 x 200

and the image i've imported is much bigger, but it's big enough to fit in the actual game screen which is what i want. Let's pretend the image is 1280/1080

How do i resize the room inside the engine so the full image fits the entire screen and not just a portion of it and it becomes a "scrollable room"? At first i was thinking about changing the resolution of the game but that makes the GUI interface go crazy.  (wrong)

I'm guessing it could be done with the camera somehow!

Thanks


Crimson Wizard

#1
Quote from: AndreasBlack on 01 Dec 2021, 20:49At first i was thinking about changing the resolution of the game but that makes the GUI interface go crazy. 

Firstly, I dont know what your game plan is and which stage of development you are on, but I strongly advise to decide whether you want to have a low-res game or high-res game.
If you keep the game 320x200 then everything will be pixelated; and even if you zoom the room out then you'll see a larger portion of the room but still rendered in 320x200.

Of course, if you change the game to high-res then you will have to adjust GUI in accordance to this; and maybe other things too. But it's more important to have a proper game res even if that comes at a cost of editing some elements.

That said, zooming rooms is supported since AGS 3.5.0. This is done by changing room camera's size. Camera's size determines which portion of the room you see. The relation between room camera and viewport creates zoom in/out effect.
Code: ags

Game.Camera.SetSize(1280, 720);

PLEASE NOTE that will zoom not only the room background, but also everything in the room (objects, characters)!
If you want to rescale background only, then perhaps you will have to reimport room's background at a smaller resolution.

AndreasBlack

#2
Quote from: Crimson Wizard on 01 Dec 2021, 21:36


Firstly, I dont know what your game plan is and which stage of development you are on, but I strongly advise to decide whether you want to have a low-res game or high-res game.
If you keep the game 320x200 then everything will be pixelated; and even if you zoom the room out then you'll see a larger portion of the room but still rendered in 320x200.

Of course, if you change the game to high-res then you will have to adjust GUI in accordance to this; and maybe other things too. But it's more important to have a proper game res even if that comes at a cost of editing some elements.

That said, zooming rooms is supported since AGS 3.5.0. This is done by changing room camera's size. Camera's size determines which portion of the room you see. The relation between room camera and viewport creates zoom in/out effect.
Code: ags

Game.Camera.SetSize(1280, 720);

PLEASE NOTE that will zoom not only the room background, but also everything in the room (objects, characters)!
If you want to rescale background only, then perhaps you will have to reimport room's background at a smaller resolution.

Christ this is the second time i ask something and i've already "almost" been there myself, i just didn't think about typing in the actual "resolution" in the code since i've seen numbers like 2x2 to "middle the screen", etc.

Thanks, now i can experiment a little, or i have to redraw the entire room, but i don't think so. If you think about Thimbleweed Park's Hotel outside view.
The game is usually 320x200 it is a "lowres game".
By looking at the game you could see that the skies are clearly stretched so i believe they probably did what i am asking for. "Zoomed out" the bakground for that particular room only.
So i've learnt the hardway now that the best way to draw the rooms is to simply throw in the characters in the room you are drawing to avoid "mistakes" like this.
Ofc i'm just speculating, but the pixelated skies look normal in the other scenes of that game.

Edit: Here look: [imgzoom]https://www.mobygames.com/images/shots/l/884546-thimbleweed-park-windows-screenshot-checking-in-or-checking.jpg[/imgzoom]

Crimson Wizard

#3
Quote from: AndreasBlack on 02 Dec 2021, 12:59If you think about Thimbleweed Park's Hotel outside view.
The game is usually 320x200 it is a "lowres game".

"Thimbleweed Park" is not a low-res game, even though it seemingly uses low-res pixel sprites. The best way to notice this is to observe the game speech: the text is clearly hi-res (it's "pixels" are smaller than the "pixels" of the background).
Because the game itself is hi-res it can use scaled sprites of varying resolutions when necessary.

If you want to achieve similar effect in AGS, you'd have to setup a hi-res game and use scaled low-res graphics and zoomed rooms, etc.

AndreasBlack

Quote from: Crimson Wizard on 02 Dec 2021, 13:06
Quote from: AndreasBlack on 02 Dec 2021, 12:59If you think about Thimbleweed Park's Hotel outside view.
The game is usually 320x200 it is a "lowres game".

"Thimbleweed Park" is not a low-res game, even though it seemingly uses low-res pixel sprites. The best way to notice this is to observe the game speech: the text is clearly very hi-res.
Because the game itself is hi-res it can use scaled sprites of varying resolutions when necessary.

If you want to achieve similar effect in AGS, you'd have to setup a hi-res game and use scaled low-res graphics and zoomed rooms, etc.

Ahhh, you're right. That makes sense! So basically the "9 Verb template" in AGS is setup wrong.  (laugh) Since it is setup to be a 320x200 game, when it's really not.  :confused:
Lucky i had this discussion now and not long into the game dev.............!

Khris

Quote from: AndreasBlack on 02 Dec 2021, 13:11So basically the "9 Verb template" in AGS is setup wrong.  (laugh) Since it is setup to be a 320x200 game, when it's really not.  :confused:
It's not "wrong" in any sense, the template (like basically all of them) is set up to create a lowres game. Those usually have a native resolution of 320x200. However they are typically displayed using a 4x or 5x nearest neighbor filter.

Your avatar for instance is clearly a lowres sprite, so to me it's not clear at all which resolution they right choice for your game is.

Do you want to create a game like this:


or a game like this:

AndreasBlack

#6
Quote from: Khris on 02 Dec 2021, 19:27
Quote from: AndreasBlack on 02 Dec 2021, 13:11So basically the "9 Verb template" in AGS is setup wrong.  (laugh) Since it is setup to be a 320x200 game, when it's really not.  :confused:
It's not "wrong" in any sense, the template (like basically all of them) is set up to create a lowres game. Those usually have a native resolution of 320x200. However they are typically displayed using a 4x or 5x nearest neighbor filter.

Your avatar for instance is clearly a lowres sprite, so to me it's not clear at all which resolution they right choice for your game is.

Do you want to create a game like this:


or a game like this:


Well ofc i want the game to look like Monkey Island, Thimbleweed Park, etc in otherwords a pixelated game. And it's just ONE room or maybe two or three who the hell knows! I'm just in the planning stage. But the problem with the camera "zoom out" or in idea is that now the gui turns out to be in the same resolution as the bakground. Is there anyway to avoid that from happening? I mean i know how to "fix it" but it would be annoying to have to sit and bonce down PNG images that are 500% or 600% enlarged to look "pixelated" in the game etc etc. Do the same for all the gui's, option buttons, etc. Hence back to my logic of the template being "wrong". ha ha. So generally speaking 320x200 and occasionally some rooms bigger.

EDIT:

I mean the question is can i still have my game being 320x200 and get the "look" i don't care if the fonts in game (speech fonts ofc) are "highres" i don't. It's just the "look of the gameplay". Or do i need to bounce down every single gui and upscale them manually and then "hope" for the template creator to add that in, because i don't think it will "get saved" since i've tried to add my own gui language buttons before into this template and it won't let me. So i don't think that will work either, but i could be wrong.

eri0o

Could mockup a single game screen so it is easier to understand what you are asking?

AndreasBlack

#8
Quote from: eri0o on 06 Mar 2022, 14:05
Could mockup a single game screen so it is easier to understand what you are asking?

Ironically that's what i've been working on. But it turns out everything is a huge false alarm. I don't know why i got my GUI's f'ed up before, it seems to work perfectly fine now. PHEW!

Question actually i could ask another question. If i want to do small microchanges move the entire room bakground in increments how would i do that with the camera?
I think i asked before, but i forgot how it's done.  (roll) :-[ and by move i don't mean it moving around in a constant movement i mean being "locked in the same position" but not the original position as for when the image is imported into AGS

Snarky

AGS works very differently, graphics-wise, than the Thimbleweed Park engine. TP uses essentially 3D graphics technology, where sprites are textures that can be scaled up and down arbitrarily, which makes it easy to create "mixed-resolution" effects—some things are low-res (scaled up) and other things are more high-res (scaled up less).

In AGS, you are working with one fixed game resolution and limited support for in-engine scaling (though the Camera API opens up some possibilities), so if you want some things to be low-res and other things high-res, you have to pick the highest resolution you need, and then manually scale up all the other graphics, either by pre-scaling them before you import them, or using some rather tedious in-game methods.

There are some games that do this, precisely in order to have the UI and fonts in higher resolution than the backgrounds and characters, but for the most part people prefer to do the whole game in one resolution—both for convenience and because it is stylistically more faithful to classic 2D adventure games, and seen by many as aesthetically preferable.

AndreasBlack

Quote from: Snarky on 07 Mar 2022, 13:09
AGS works very differently, graphics-wise, than the Thimbleweed Park engine. TP uses essentially 3D graphics technology, where sprites are textures that can be scaled up and down arbitrarily, which makes it easy to create "mixed-resolution" effects—some things are low-res (scaled up) and other things are more high-res (scaled up less).

In AGS, you are working with one fixed game resolution and limited support for in-engine scaling (though the Camera API opens up some possibilities), so if you want some things to be low-res and other things high-res, you have to pick the highest resolution you need, and then manually scale up all the other graphics, either by pre-scaling them before you import them, or using some rather tedious in-game methods.

There are some games that do this, precisely in order to have the UI and fonts in higher resolution than the backgrounds and characters, but for the most part people prefer to do the whole game in one resolution—both for convenience and because it is stylistically more faithful to classic 2D adventure games, and seen by many as aesthetically preferable.

True, exactly how i thought about it after Wizards post. Btw, no answer to my question. Question: How would i think about moving the bakground to another fixed position. Say i wanted the bakground to raise 30+ Y and stay the same X wise as when originally imported.

I'm guessing it could be done. Since that could be used for like the example of the TWP the hotel cutscene where it slides down from the top of the hotel smoothly. I have the Tween module and have been using it a bit. probably what i should use for cutscene "slides" like that, but when you want it to stay in a fixed position that is not the original imported background image positioning, is what i still don't get, if it's even possible.






Snarky

You set or tween the Camera.X/Y value.

SMF spam blocked by CleanTalk