Make a object move side to side with tilt



Today I am going to show you how to make an object move to side to side with it looking realistic. This is another one rule code, and is pretty straight forward. If you can understand how to do things from just the pictures, go ahead. Feel free to play around with the code as well, it's always good changing things around so you can learn!

  1. Lets start with creating a new project and adding a emoji to the drawing board. Do this by tapping the + at the top by the 'play' button. Double tap on the text and switch to the emoji keyboard. If you do not have to emoji keyboard, and do not know how to get it, go to this link (hopscotch forum topic). I am going to choose a car for the demonstration, but you can use any character/emoji/text you like. Then add a new rule for 'when project is started.'


  2. Now lets get into the code. Start by adding the block 'turn' under the category 'Movement'. Using the calculator, add -90 to the box. This will mean that when the project is started, the character will turn negative (-) 90 degrees. After you have added that, add a 'repeat forever' block in after the 'turn' block, which is under the category 'Control Flow'.

3. Time for the main part of this, the epic tilting code! (not that that epic but ok). Start by adding the block 'Set Angle', which is under the category 'Movement'. Put this block inside the repeat forever block.

Now add to that block the 'purple addition (+)' box, which is found under the calculator when you tap on the space. Tap in the first box, and go over to tap 'values' above the calculator. Move using the arrows until you see the iPad's values. Now drag or tap the 'tilt left %' value so it is in the first box. And in that second box in the addition purple box, add -90. Note: The direction that you want your object to be facing will matter on how much you add to the tilt left %.

Next after you have done that, add the block 'change X by', which is also found under the 'movement' category. Make sure this is also in the 'repeat forever' block. In the 'change X by' block, add the division purple calculator block. Add to that the 'tilt right %' value, with that being divided by 1.

Now you should have:

  • block that turns your character -90 degrees
  • repeat forever block with 2 blocks inside;
  • set angle from bottoms of device in degrees block that has 'tilt left % + -90'
  • change X by block that has 'tilt right % divided by 1'

Now that we have completed the code (that's it!), it is time to test it out.

You could use this code in many projects, such as a game that requires the character to be titled from side to side. For instance, I use this code for my 'Airport Runner' project for the van, so you can dodge the planes.

Have fun coding, hope this helps! :smiley:

  • ColeDJ/BestesColesNZ


Awesome tutorial @ColeDJ! Great use of bold formatting, screenshots and step-by-step instructions :smiley:

I just have two tips:

  • maybe breaking the big paragraph into smaller ones helps to make it easier to follow. I do like the bullet points you put underneath it to summarise it though!

  • and here is a tutorial on how to put links in your posts using texts so you don't have to put long URLs, if you find this way more useful

Those are just my suggestions and I really like the tutorials you're making!


@t1_hopscotch Thanks for the tips! I'll be sure to take these in mind. :grinning: