(Template no longer needed)
m (Fixed 1 SB guideline, capitalized)
 
(42 intermediate revisions by 23 users not shown)
Line 1: Line 1:
{{Wiki Standards}}
+
{{featured|November|2017}}
 +
A platformer is a [[simulation]] of actual physics that take place in real life. Objects fall, move, slide, jump, and bounce, and a platformer associates those properties into a [[Game Projects|game]] in which one controls a character and tries to move it toward a goal.
  
==Making the platformer sprite==
+
== Creating the Platformer Sprite ==
To start off, make the platformer sprite, the sprite that you control and play as in the [[Game Projects|game]]. You could try making a black dot or something like some platformers do. You could try to do a person walk cycle for the platformer, but that may be harder. Along with that, make two variables called "XVel" and "Gravity" and set them to "for this sprite only", and add the following script to the sprite:
+
 
 +
The platformer [[sprite]] is the [[Wikipedia:Avatar (computing)|avatar]] controlled by the player. Its appearance can affect gameplay slightly, depending on the angles and size of its [[Costumes]]. For example, a character shouldn't be saved from a fall because the brim of her hat snagged on the edge of a cliff. Sprites that are animated by lots of costume changes are even more tricky, as a changing costume might get pulled inside the ground and get stuck.
 +
 
 +
 
 +
Below is an example of a simple script for a platformer sprite. It uses two [[variable]]s:
 +
 
 +
# "X velocity" stores a value representing the sprite's horizontal speed. It was set as a local variable by checking the option "For this sprite only" in the creation [[dialog]]. This means (i) the variable can only be changed by scripts in the same sprite, (ii) the variable name does not needlessly clutter the variable pane of other sprites, and (iii) the same variable name may be used in other sprites without causing conflicts.
 +
# "Gravity" stores a value reflecting the strength of the sprite's tendency to fall. In this example it is set as a negative number because moving a sprite ''downwards'' requires making the value of its [[Y position]] smaller. "Gravity" need not be set as a local variable; a realistic game would subject all its characters to the same gravitational force.<ref>https://en.wikipedia.org/wiki/Galileo's_Leaning_Tower_of_Pisa_experiment</ref>
 
<scratchblocks>
 
<scratchblocks>
when gf clicked
+
when green flag clicked
set [Gravity v] to [insert strength of gravity here]
+
set [Gravity v] to [-5]
 
forever
 
forever
  if <key [left arrow v] pressed?>
+
  if <key [left arrow v] pressed?> then // Using "else" saves processing later If's unnecessary.
    set [XVel v] to [-4]
+
    set [X velocity v] to [-4]
 +
  else
 +
    if <key [right arrow v] pressed?> then
 +
      set [X velocity v] to [4]
 +
    else
 +
      set [X velocity v] to [0] // No arrow keys means no movement.
 +
    end
 
   end
 
   end
   if <key [right arrow v] pressed?>
+
   if <not <touching [Ground Sprite v] ?>> then // Sprite falls till touching ground.
    set [XVel v] to [4]
+
    change y by (Gravity)
 
   end
 
   end
   if <<not <key [left arrow v] pressed?>> and <not <key [right arrow v] pressed?>>>
+
   change x by (X velocity)
    set [XVel v] to [0]
+
end
  end
 
  if <not <touching [ground sprite v]>>
 
    change y by (Gravity)
 
  end
 
  change x by (XVel)
 
 
</scratchblocks>
 
</scratchblocks>
  
==Making Levels==
+
== Making Levels ==
===Simple===
 
Colors would be involved at this part. Lets say that black is the main color the sprite stands on, red makes the sprite go back to the beginning of the level when it touches it, and touching yellow will bring the sprite to the next level.
 
 
 
[[File:Level.gif]]
 
 
 
However, yellow doesn't have to always be square, and red doesn't always have to be a basic line. They can be any kind of strange shape like yellow (Level goal) can be some line and red (Obstacle) could be something like a circle or square.
 
  
[[File:Alt Level.gif]]
+
Colors can be used in a platform for detection of the end of a level or an object which sends one back to the beginning of the level. For this tutorial, assume the following:
  
Levels can look like this! That's what makes platformers popular on [[Scratch]].
+
* The character sprite performing the physics is named "Player"
 +
* Black is the color of the platform, or ground and walls, in which the character cannot pass through
 +
* Red is the color that sends one back to the beginning of the level they are on
 +
* Yellow is the color which must be reached to move on to the next level
 +
* Backgrounds are used as levels instead of sprites
 +
* [[Scrolling]] is not incorporated
  
 +
[[File:Level.png]]
  
 +
The shapes do not need to be geometric, but can be organic, meaning an unordinary, inconsistent structure. There can be curvature to the various colors and platforms, which can be used to create diverse, numerous levels. The following image displays an example of some organic shapes being used:
  
When you're done making all your levels, add the following script to the Player sprite:
+
[[File:Alt Level.png]]
<scratchblocks>
 
when gf clicked
 
forever
 
  if <touching color [#FF0000]?>
 
    go to x:(-180) y:(-47)
 
  end
 
  if <touching color [#FFFF00]?>
 
    broadcast [New level v]
 
    go to x:(-180) y:(-47)
 
  end
 
</scratchblocks>
 
 
 
And add the following scripts to the Levels sprite/background:
 
<scratchblocks>
 
when gf clicked
 
switch to costume [Level 1 v]
 
</scratchblocks>
 
<scratchblocks>
 
when I receive [New level v]
 
next costume
 
</scratchblocks>
 
  
Finally, add this script to the Player sprite:
+
When the levels are finished, add the following script to the "Player" sprite:
 
<scratchblocks>
 
<scratchblocks>
 
when gf clicked
 
when gf clicked
 
forever
 
forever
  if <([costume # v] of [Levels v]) = [insert number of levels here]>
+
if <touching color [#FF0000]?> then // if in contact with the color red
    hide
+
go to x:(-180) y:(-47) // relocate to the start
   end
+
end
 +
if <touching color [#FFFF00]?> then // if at the end of a level
 +
go to x:(-180) y:(-47) // relocate to the start
 +
switch backdrop to [next backdrop v]   // next level
 +
end
 
</scratchblocks>
 
</scratchblocks>
 +
The scripts within the "forever" loop can be merged with the larger physics script shown farther above. Merging the scripts reduces the amount of [[Conditional Argument|conditions]] being checked at once and can possibly make the project more uniform and orderly, meaning the "Player" makes each movement and ''then'' checks for the conditions instead of the conditions possibly being checked ''during'' the sprite's movement.
  
===Advanced===
+
{{note|A condition is a statement that is checked for a true/false response. In the example above, when the sprite checks if it's touching a color, it's checking a condition.}}
When doing platformers, variables are usually present. These varaibles can range from Lives Left to Deaths or Seconds Survived to Coins Collected. The basic name used in simple platformers for variables is Score. To incorporate variables into your platformer, you can use the following script:
 
<scratchblocks>
 
when gf clicked
 
forever
 
  if <touching color [#FF0000]?>
 
    go to x:(-180) y:(-47)
 
    change [Deaths v] by (1)
 
  end
 
  if <touching color [#FFFF00]?>
 
    broadcast [New level v]
 
    go to x:(-180) y:(-47)
 
  end
 
</scratchblocks>
 
  
And for the broadcast received:
+
Then add the following script to any sprite:
 
<scratchblocks>
 
<scratchblocks>
 
when gf clicked
 
when gf clicked
switch to costume [Level 1 v]
+
switch backdrop to [Level 1 v] // begin with the first level
set [Level v] to [1]
 
 
 
when I receive [New level v]
 
next costume
 
change [Level v] by (1)
 
 
</scratchblocks>
 
</scratchblocks>
 
+
Lastly, add the following script to the "Player" sprite:
or if you want to incorporate Lives
 
 
 
 
<scratchblocks>
 
<scratchblocks>
 
when gf clicked
 
when gf clicked
forever
+
show
  if <touching color [#FF0000]?>
+
wait until <([backdrop # v] of [Stage v]) = (amount of backdrops)> // wait until the last level is reached
    go to x:(-180) y:(-47)
+
stop [all v]
    change [Lives v] by (-1)
 
  end
 
  if <touching color [#FFFF00]?>
 
    broadcast [New level v]
 
    go to x:(-180) y:(-47)
 
  end
 
 
</scratchblocks>
 
</scratchblocks>
  
for the [[sprite]]'s [[script]].
+
==Making the Win Background==
 
 
==Making The Win Background==
 
 
Last of all, comes the win background. After finishing all the levels in the platformer, something would come up that says something like "You Win!". Put it as the last costume in the sprite/background. It can be some text in a basic white background saying "You win" or the art can be complex.
 
Last of all, comes the win background. After finishing all the levels in the platformer, something would come up that says something like "You Win!". Put it as the last costume in the sprite/background. It can be some text in a basic white background saying "You win" or the art can be complex.
  
 
<gallery>
 
<gallery>
File:Simple You Win.gif|A basic You Win background with just some black text and a white background.
+
File:Simple You Win.png|A basic You Win background with just some black text and a white background
File:Complex You Win.png|A You Win background with complex art.
+
File:Complex You Win.png|A You Win background with complex art
 
</gallery>
 
</gallery>
  
==External Links==
+
==See Also==
[http://beta.scratch.mit.edu/projects/2051410/ Tutorial]
+
* [[Advanced Platformer Physics]] {{-}} a tutorial on how to make a more realistic platformer
 +
 
 +
==References==
 +
<references/>
  
[[Category:Scratch Program Tutorials]]
+
[[Category:Scripting Tutorials|Make a Basic Platformer]]
[[Category:How To Pages]]
+
[[Category:Game Design Tutorials|Basic Platformer]]

Latest revision as of 19:09, 14 July 2019

A platformer is a simulation of actual physics that take place in real life. Objects fall, move, slide, jump, and bounce, and a platformer associates those properties into a game in which one controls a character and tries to move it toward a goal.

Creating the Platformer Sprite

The platformer sprite is the avatar controlled by the player. Its appearance can affect gameplay slightly, depending on the angles and size of its Costumes. For example, a character shouldn't be saved from a fall because the brim of her hat snagged on the edge of a cliff. Sprites that are animated by lots of costume changes are even more tricky, as a changing costume might get pulled inside the ground and get stuck.


Below is an example of a simple script for a platformer sprite. It uses two variables:

  1. "X velocity" stores a value representing the sprite's horizontal speed. It was set as a local variable by checking the option "For this sprite only" in the creation dialog. This means (i) the variable can only be changed by scripts in the same sprite, (ii) the variable name does not needlessly clutter the variable pane of other sprites, and (iii) the same variable name may be used in other sprites without causing conflicts.
  2. "Gravity" stores a value reflecting the strength of the sprite's tendency to fall. In this example it is set as a negative number because moving a sprite downwards requires making the value of its Y position smaller. "Gravity" need not be set as a local variable; a realistic game would subject all its characters to the same gravitational force.[1]
when green flag clicked
set [Gravity v] to [-5]
forever
   if <key [left arrow v] pressed?> then // Using "else" saves processing later If's unnecessary.
     set [X velocity v] to [-4]
  else
     if <key [right arrow v] pressed?> then
       set [X velocity v] to [4]
    else
       set [X velocity v] to [0] // No arrow keys means no movement.
    end
  end
  if <not <touching [Ground Sprite v] ?>> then // Sprite falls till touching ground.
     change y by (Gravity)
  end
  change x by (X velocity)
end

Making Levels

Colors can be used in a platform for detection of the end of a level or an object which sends one back to the beginning of the level. For this tutorial, assume the following:

  • The character sprite performing the physics is named "Player"
  • Black is the color of the platform, or ground and walls, in which the character cannot pass through
  • Red is the color that sends one back to the beginning of the level they are on
  • Yellow is the color which must be reached to move on to the next level
  • Backgrounds are used as levels instead of sprites
  • Scrolling is not incorporated

Level.png

The shapes do not need to be geometric, but can be organic, meaning an unordinary, inconsistent structure. There can be curvature to the various colors and platforms, which can be used to create diverse, numerous levels. The following image displays an example of some organic shapes being used:

Alt Level.png

When the levels are finished, add the following script to the "Player" sprite:

when gf clicked
forever
if <touching color [#FF0000]?> then // if in contact with the color red
go to x:(-180) y:(-47) // relocate to the start
end
if <touching color [#FFFF00]?> then // if at the end of a level
go to x:(-180) y:(-47) // relocate to the start
switch backdrop to [next backdrop v]   // next level
end

The scripts within the "forever" loop can be merged with the larger physics script shown farther above. Merging the scripts reduces the amount of conditions being checked at once and can possibly make the project more uniform and orderly, meaning the "Player" makes each movement and then checks for the conditions instead of the conditions possibly being checked during the sprite's movement.

Note Note: A condition is a statement that is checked for a true/false response. In the example above, when the sprite checks if it's touching a color, it's checking a condition.

Then add the following script to any sprite:

when gf clicked
switch backdrop to [Level 1 v] // begin with the first level

Lastly, add the following script to the "Player" sprite:

when gf clicked
show
wait until <([backdrop # v] of [Stage v]) = (amount of backdrops)> // wait until the last level is reached
stop [all v]

Making the Win Background

Last of all, comes the win background. After finishing all the levels in the platformer, something would come up that says something like "You Win!". Put it as the last costume in the sprite/background. It can be some text in a basic white background saying "You win" or the art can be complex.

See Also

References

  1. https://en.wikipedia.org/wiki/Galileo's_Leaning_Tower_of_Pisa_experiment