Monday, November 6, 2017

2d - Mega Man-style screen scrolling design


The NES classic Mega Man series uses a very specific scrolling technique that I'm having a hard time wrapping my head around implementing. Essentially, the level is divided into "screens" which are all the same size. Some of the screens smoothly scroll in to one another, creating the illusion of a wider fields of play. Some of the screens stop the camera from scrolling until the player has reached the edge of the screen, at which time a transition occurs and the next screen is shown. It is also possible for a single screen to have more than one transition, for example it has a ladder that goes up to one screen, but you could also walk forward to another screen.



How can these screen transitions be modeled?


Mega Man screen transition diagram



  • Screen 0 is the starting screen, where the player starts.

  • Screen 0-3 is horizontally smooth-scrolling and appears to the player as one continuous field of play.

  • Since there is a transition between Screen 3 and it's neighboring screens 4 and 5, the camera will not advance past the right or top edges of Screen 3 unless the player moves to that respective edge and "pushes" through to the next screen.


  • Once the player moves to either of the transition edges, user input is momentarily disabled and the camera transitions into the new area, after which user input is restored.





  • The blue screen (Screen 5) has disabled horizontal scrolling so that only vertical transitions are possible.



  • The green screen (Screen 6) has a vertical transition back to Screen 5 but also allows horizontal smooth-scrolling into Screen 7.


Edit: Implementing the transitions in terms of rooms lead me to this:


Room structure implementation diagram


The small notches with an arrow are the regions in which a transition can occur. Each region has a "direction" and lies just outside of the room's visible area. As soon as the player hits a region, a transition will be started.



Answer



It sounds like what you need is the concept of rooms as opposed to screens. Screens 1-3 would be one room, e.g. Your rooms could then be of any size and shape, or even restricted to the size of multiples of a screen.


Your camera would follow the player through a given room, up until the player gets too close to the border (half a screen width). When the player moves across the border, and into another room, you perform the transition visualization.



Each room would have a set of access points, which are mapped to access points of another room--creating the transition points.


No comments:

Post a Comment

Simple past, Present perfect Past perfect

Can you tell me which form of the following sentences is the correct one please? Imagine two friends discussing the gym... I was in a good s...