3D Tutorial: Hopscotch Logo!


Hello there! @Huggingfluffybear and I decided to work together to make a 3D Hopscotch logo. This is meant to be a follow up to MagmaPOP's 3D Tutorial: Basics

After discussing how to make the logo, we will create a tutorial for it! Anyone is free to join in if they like!

Ok, let's start with a 3D black box!

First make an invisible text item and add code.

When Game Starts:

Ability called Black Box

Then open the ability and add a set position block. Make the X iDevice's Width divided by 2 to centre the text on screen.

Drag an add block, then a subtract block and finally a divide block into each other like this:

Put the iDevice's height into the first divide block and 2 into the other:

Put 180 into the next subtract block:

The black box will be 360 pixels high so we want 180 under the centre (-180) and 180 above the centre. It will gradually go up so we need a value that changes:

Add a new value called Height (or whatever you wanna call it) and put it into the add block! It should all look like this (ignore the Check Once If)

Ok, so you are probably wondering what the Check Once If block is doing there. I took these screenshots after I finished coding not while I was doing it.
So add a Check Once If block and make it less than (<)

Put the new Height (or whatever) value that you made on the left and 360 on the right

Great job Hops! Now we need to make the actual block visible and it needs to rise so:

Put a set text block and set the text to ten of these: █ block things. Copy and paste these ten here:

Make the colour whatever you want! The Hopscotch logo has a black background so I will use black!

Good job! Just a few more steps to go! Don't give up now!

Add an increase value block and make the value your new Height (or whatever) value and increase it by 4:

Then make a clone:

And add a repeat forever block:

Check Once If inside of the repeat forever block:

Is equal to: =

Height (or whatever value) value on the left:

And 360 on the right:

And finally inside of it: Turn 1 degree:

Great! You can now close up that rule!

There are two or three steps to go!

Add a new When: Object is Cloned:

And drag your black box ability inside:

Congratulations Hops! You have made a 3D box! Using one text box! Now add a background and give yourself a pat on the back! :smile::smile::smile::smile::smile:

Alright everyone! We have made our box, but where's the logo? We want to have this inside of the black:

Ok, so we are going to begin by making the black box ability into a Hopscotch Logo ability, hopefully I've not only been teaching you about 3D in Hopscotch, but also navigating through the new update!

Press and hold on the box in the block bar:

A menu will come up:

Select Rename:

Type in Hopscotch Logo:

And press on the green tick!

Great Job! You just learned how to rename Ablilties! The same applies for values.

Now open up the ability:

Drag the set text block out of the Check Once If block:

And replace it with a Check If Else block:

Make it < (less than)

The first block will be your height value and the second one will be 60:

Now drag the set text block into the new Check If Else block:

In the else section, put another Check If Else block, less than as usual:

On the left put your value, and on the right put 150:

Now put a new set text block into the Check If Else block and write:

Keep the colour black! Ok, so let me take a minute to explain what's going on. As I said earlier, the box is 360 pixels high, the Hopscotch Logo is made up of different colours and shapes so we have to create it a few pixels at a time. If you were to press play now, 150 pixels would display and you would see the start of a H beginning to form. We will continue to use different heights, colours and shapes to create the whole Hopscotch logo.

Ok, in the else section, put yet another Check If Else block, less than once again!

Put height on the left and 180 on the right:

Put a set text block inside and write the following:

Keep the colour black!

Now in the else section guess what?! Yup, you guessed it! A Check If Else block with less than:

This time put height on the left and 210 on the right:

Put another set text block inside and write what is in the picture below:

Alright! In the else section put yet another Check If Else block that is less than, 3D is a very repetitive process!

Now put your value on the left and 300 on the right, so close to 360!

Set text to this:

Last step! In the else section, copy and paste the text block from the beginning (the ten boxes).

Close up all of the rules and hit play!

Congratulations Hops! You're all one step closer to becoming a professional 3D coder like @MagmaPOP!



Hey everyone! I'd just like to thank you for reading and hopefully following my tutorial! I hope that you can use or apply this to other 3D objects! That's all for now everyone! Keep hopping and scotching and coding and... I really need to find a new way to end these posts! :yum::yum::yum::grimacing::grimacing::grimacing:

3D Tutorial: Basics
Super Sweg Kid Fighter [Game Completed]
My First Time On The HS Forum!

But why did you make a new topic?

3D Tutorial: Basics

Because we are going to be discussing how to do it before actually making a tutorial


Add in the topic that you and @Huggingfluffybear should make a tutorial so everyone know it!


In the name or the first post?


First post! Also in the name if you want!


How's that?

Must be 20 characters


Before when I come to this topic I think that the topic don't mean something.


Yup! This makes more sense now.




So do you have any ideas for a 3D H?


Just a H?


We'll start with the H bit then we can move on


It might be hard fitting the whole thing into our code!


Maybe... Try to do it like MagmaPOP's 3D logo!


Wait, did. MagmaPOP already make one?


Yeah... Sorry for not saying it. I think that you know it. Sorry


Just went on Hopscotch and saw MagmaPOP's logo


It's ok, we can start by figuring out how he did that and create new stuff from there


Ok so let's start with a black box