Want to make awesome 3D things in Hopscotch? Share 3D projects you have made, ask questions about how to code 3D objects to move, and more!
Photo above of my 3D moving object!
Photo above of my 3D moving object!
9 Likes
@MagmaPOP Does anyone know how MagmaPOP made the 3D creeper? I guess I could look through tons of code but I was just wondering.
2 Likes
There is a cool guide here! 
5 Likes
“3D” can mean a few different things. I am curious what others have in mind, when they speak of “3D” effects in Hopscotch. A really basic question is whether we’re talking about…
(1) How things look.
In some situations, just choosing the right puffy, cartoon-shaded emoji may be enough to get the 3D effect we want. Or, maybe, making sure one thing sits in front of or behind another gets us that effect. In other situations, I’ve seen how shading, alone, can give a cool “depth” illusion. The “3D” picture might not even move, but it looks great. Like they say, “Whatever works!” Right?
(2) How things move and scale.
In other situations, we might want things to move around and grow or shrink, as if they were really 3D objects sticking in and out of the screen. This is a strategy that has objects that stick out or emerge toward the viewer, relative to the flat screen, “brought to the front” and scaled a bit larger than things that stick into or recede into the screen. When it’s done just right, it can give a cool sense of flying through tunnels and over landscapes, through clouds, etc.
There is also the effect of “parallax” that makes “near” and “distant” objects move more or move less - up and down, left and right - on the screen when a control is pressed or the iThingy is tilted around. If slightly-larger objects that have been “brought to front” seem to sweep across the screen a bit more than the smaller objects that are “in the back” in Hopscotch, it really can seem like there’s a whole “3D” world in there! I have enjoyed playing with these kinds of “3D” hacks, though they are, at the end of the day, just illusions, like the first set. There’s nothing truly “3D” going on. Still, I say again, “Whatever works.”
(3) How things are defined and rendered.
The last situation is the hardest, the most realistic and, I think, the coolest. This is a situation where you actually define and display objects using three spatial coordinates. Objects, and every part of them, are given a location in “x” and “y” and “z”, relative to the viewer. When objects move, rotate or scale in size, it is only because the actual “x” and “y” and “z” locations of each point have changed relative to the observer or because the observer’s location or perspective or viewing angle has actually changed. Usually, this method requires sophisticated programming or working in a powerful “rendering” environment (like, for example, “Blender”). It needs a decent computer with a nice graphics card and so forth.
To take things fully to the next “dimension”, we can show different images to our left and right eyes, using special glasses or things like “Occulus Rift” or “HoloLens”. These tools’ sophisticated hardware and software can make us feel like we’re really “inside” the “3D” space of what we’re seeing. Today, that’s not part of Hopscotch, but… who knows? “Someday…” Right?
Within limits, we can do all three of these in Hopscotch (though the last one tends to be slow). Figuring out your own way might be fun. It has been for me. I’ve described (above) some ways I’ve tried it. But I am still testing-out ideas. And, quite different from anything I’ve tried, several users on Hopscotch have done a very nice job of getting beautiful “3D” effects. So, which way would you like to do “3D” in Hopscotch?
3 Likes
I would say 3D in Hopscotch are shapes/avatars/backgrounds with three dimensions. A circle would be 2D, but a cube would be 3D. A cube might be a good example of something we could do in Hopscotch. We could try to make dice. If it was swiped left, right, up and down, it would show a number like a real dice, while looking like this:
(Die picture from a Google search
)It would have shading and have three dimensions. I think that would be a good “3D in Hopscotch” project.
3 Likes
I half made a game where trees scale from 0 to 180% in size as you move forwards/back and move left/right at different speeds depending on the size to give the illusion of 3d depth. The problem i have is trees farther away appear in front of trees close and the trees move quickly in jerky movements when close instead of smooth moves as i want. oio you are smart and probably know how to code this: i wanted the trees to move around the player when turning and not just sliding sideways left/right when trying to turn left/right.
I find this the hardest thing to code. This would be like a 3d depth type of sine/cos.
2 Likes
What is your game called? Do you have the same username in-game? Did you post it or is it still a draft?
In draft. I may post it and someone else can continue working on it.
I didn’t like the fact i could only move forwards/back strafe left/right.
I wanted to be able to turn/twist from a 1st person perspective.
Maybe tomorrow night i’ll publish and place a link here.
I was thinking that if you publish it oio or maybe me (or anyone) might be able to read the code easier and fix it. Just write a little note when we open the game though.
1 Like
just checked. More like 2 hours of work is gone.
Can’t publish the scraps left. sorry.
What?! How did it happen?
Who Knows. A week before any monoploy collab i was making a sort of monopoly/catburglar game and the colored cards i made to have messages just disappeared after a day from the draft but everything else was still there. Hopscotch still has allot of glitches unfortunately.
It might be nice to see your tree project.
The far-away-tress-moving-in-front-of-nearer-trees problem has a lot to do with the order in which the trees are created or cloned or with whether you’ve “sent” them to “front” or to “back” in the right order. Also, unless each point on the tree is, itself, a separate object, there is little hope of being able to view it from any angle we might like. We’re stuck with fixed shapes.
It’s the same for the “dice” problem, illustrated above by @AwesomeJediE. See, we know how to make a fully rotating cube with corners and edges; but the problem there is going to be the dots. Unless I re-draw each dot as a background object, I have no idea how to show it from anything other than straight-on. In other words, I can do the sides of the dice, but I don’t think I can make Hopscotch display the (circular) dots from an oblique angle, turning them, essentially into ellipses. Can we just draw the whole thing? Yes, we can. We can do that on the background, but it’ll be painfully slow and not much bang for your buck.
While I can show stacks of characters that look smaller, in the distance, and larger, up close, or even piles of leaves and flowers and geometric shapes stacked on top of each other and moving about differently, depending on how “far away” they are, trying to show any single, extended object in convincing “3D” in Hopscotch… is a tall order.
2 Likes
When I try to look at the code it always lags for me 
Tomorrow is the last chance to compete! Then we will vote here.
Hey, I’m doing a 3D game based on depth and perspective, but I can’t manage to make the movement in the Z (depth), I already did some as the turning but still needs some correction, if someone can help me, here is the link of the game; https://c.gethopscotch.com/p/zw0yuiv30
THX!!