MichaelSinsbeck / platformer

A ninja platformer written in LÖVE
7 stars 0 forks source link

Screen transition #99

Closed michalove closed 8 years ago

michalove commented 10 years ago

We already discussed this in the past. https://github.com/michalove/platformer/issues/36

One playtester said, the transition looks cheap. And another one said, that we should use the little ninja that is already on screen.

The following idea came to my mind: In every screen (almost) there is one ninja. How about, using him for the transition. Whenever a screen is changed, the ninja fades to black color and grows until he covers the screen. Then backwards he shrinks again and moves to the new position in the new screen.

If find this quiet elegant, because we have one ninja in each screen. And also it would help finding the player on screen after a level starts.

Germanunkol commented 10 years ago

True, I'm not happy witth the transition yet, either. However, I think we should wait until the menu background is implemented. Then we can see what looks good. If we use bandanas as the background, for example, we can consider making some transition with them (pulling the bandanas up to reveal a different setting behind them, for example... sort of like a curtain.

michalove commented 10 years ago

Okay.

michalove commented 10 years ago

How about this idea for the transition: The current menu background is a landscape with three layers. If the user selects an option, the whole screen moves to the right (the content moves left), as if it was scrolling in a level. A bit further to the right, there is the new bamboo box with option... And if "Start game" is selected, the camera moves up into the sky until we get to the world map.

Germanunkol commented 10 years ago

Yes. I like that. Settings could be below the ground (everything moves up) About the world map: To me, it would make more sense if the camera zoomed out instead of moving up. I've made a comment in issue #165 about the details.

Germanunkol commented 9 years ago

I'm trying to figure out how to move the parallax background in the menu... right now it's just moving to the left all the time, in the menu. How/Where do you choose a location for it? Or do I just call update() with a negative value?

michalove commented 9 years ago

The current implementation always moves the background at a constant velocity: local dx = -velocity * dt The only exception is in-game. In this case the movement is determined by the camera movement, see parallax.lua lines 18-26.

If you want to implement a proper parallax scrolling for the menu, then you might consider having a menu-camera (don't need an extra file, just have an x- and y-coordinate in menu.lua or somewhere) and read out the change in x-coordinates in parallax.lua.

Then you can remove the line local dx = -velocity * dt alltogether.

Does that make sense?

Germanunkol commented 9 years ago

Thanks. I missed the line "dx = Camera.dx" - now I understand.

I chose to leave your code as it is, though, and instead added a Parallax:setPosition( pos ) function, which sets the position directly. As you suggested, the menu now has a value which holds the position of the parallax background.

I added the transition to the panelMenu branch. Can you tell me what you think? Right now the only submenu which is sort of implemented is the userlevel-download menu, so you'll have to choose that in order to see the effect. The movement itself can be modified - right now I'm using a simple interpolation function (utility.interpolateCos) for the slide-in and slide-out of the panels and for the slide of the camera. We could use a spline instead, maybe with a little "overshoot" (go there and swing back).

michalove commented 9 years ago

I like the transition. Looks very polished already.

Can we try one thing? I would like to see how it looks, if we "attach" the panels to the background. Currently the panel first moves to the bottom and then the background pans over to the new position. How about the background starts moving immediately and the panel moves into the same direction, as if it is also a physical object in the background-world.

We could then give each option a different direction: To play the game, move up, for options move left, for userlevels move right and for the level editor move down (until everything is dark blue).

Germanunkol commented 9 years ago

I tried to do what you suggested. I think it looks good. What do you think?

If you like it I'll clean up the code (I only commented out the slide effects - I'll remove them to make everything readable again).

michalove commented 9 years ago

I like it, too.

We could maybe leave the sliding effect for the very beginning when the game starts. Besides that we should leave it like it is now.

Germanunkol commented 9 years ago

So, this camera-sliding works rather well for the menu. But what effect do you want

The simplest thing would probably be to use the fade-to-black-and-back effect. I never really liked the large ninja flying through the picture...

michalove commented 9 years ago

Lets go for the fade-to-black transition. The flying ninja got some bad feedback, when we tested the game in January.

We need to figure out one more thing: How do we access the options-menu from in-game. We can add one more option to the pause-menu, but can we have a sliding screen there? I think not, because the background is fixed (the current in-game view). So, what shall we do here?