Dev Diary #24: Press Start to Begin

start screen 1

Cally’s Caves 4 development is proceeding at a furious pace, and we recently had a chance to revamp the way our start screen works.  Our first game’s start screen was simply a logo on a black screen, and with each successive game in the Cally series, we want to improve every aspect of the game.  In this dev diary, we will outline the method we used to create the Cally’s Caves 4 start screen.

Cally’s Caves 3 introduced a “scrolling level” style start screen:

cc3 logo scroll.gif

To achieve this, we:

  • created a long horizontal level
  • left both far ends of the level blank with just a floor and ceiling
  • had the camera auto-pan across the level, and seamlessly transition back to the start of the level once it scrolled all the way across.

We were very happy with this start screen at the time, as it added a visual flair to the start screen that our prior games didnt have.  Looking back now, however, having a smooth scrolling room conveyed that our game was running at 30fps on the first screen.

start2.JPG

We wanted the Cally’s Caves 4 start screen to be a showcase of all of the zones in the game, and somehow pan or fade between each zone, to give our start screen more variety and polish.  We wanted to showcase the zones, but transitioning between rooms could cause some issues with performance depending on what device the game is playing on, so we had to figure out a way to do it all in one room.  The best way we could accomplish that was by using a visual transition.

start3

Cally’s Caves 4’s start screen utilizes a fade-out transition to allow us to add more variety to the start sceen.  It also gives us a chance to cover some stuff up behind the scenes.  The fadeout transition is set to a depth of 0 in Gamemaker, so it covers up everything happening behind it.  We set up a vertical scrolling room with a number of “levels” to focus on as the camera pans down.

start4.JPG

In the room editor, each level of the start screen level looks the same, but we change the tiles’ appearance in the creation code for each level.  We also draw a new background for each level, and the fade-out transiton covers the changeover.  If the fadeout object wasn’t visible, you would see the backgrounds instantly changing from one to the next, and see that the bottoms of the levels aren’t actually fully built.

The final touch for the start screen is drawing in some characters.  In Cally’s Caves 4, when you first start the game, only Cally is visible in the first zone, however as you progress through the game, more characters will be drawn on screen, until almost everyone is represented (as you can see in the video below).  Things will also change a little bit after the player has completed the regular game and unlocked the new game plus mode.

Here is the beta start screen (please note some of the art and backgrounds are placeholders):

What do you think? Let us know, or hit us up on twitter if you want access to our testflight beta @callyscaves.

Advertisements

5 thoughts on “Dev Diary #24: Press Start to Begin

  1. Hi, I’m not good in English but, if I understand right, the start screen is very good, this start screen will show characters, “worlds” and a good introduction of the game. God job, I get very happy when I see than you are working hard in this project, don’t hurry up, take the time than you need to make an amazing project. Thanks

  2. Hey, since I’m new to this reading blogs, is there a way to subscribe so I can get notifications once something is posted here? I absolutely loved the previous games and can’t wait to see more progress being made on the 4th one.

    Love from Sweden! 🙂

  3. Hey, since I’m new to reading blogs I would like to know if it’s possible to subscribe to this blog so I can get a notification once something happens? I absolutely loved the previous games and can’t wait until the 4th version of Cally’s Caves gets released. I’m hyped for this!

    Love from Sweden! 🙂

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s