Remember, if you don't understand the concepts behind 3D programming, don't worry about it! You will first need to learn a lot of complex math stuff before you can dig right into 3D.

GENERAL 3D CONCEPTS

define go to x: (x pos) y: (y pos) z: (z pos)
set [x difference v] to ((x pos) - (my x position))
set [y difference v] to ((y pos) - (my y position))
set [z difference v] to ((z pos) - (my z position))
set [X position on screen v] to ((ViewMultiplier) * ((x difference) / (z difference)))
set [Y position on screen v] to ((ViewMultiplier) * ((y difference) / (z difference)))

set size to ((SizeMultiplier) * ((ViewMultiplier) / (z difference)))
set pen size to ((SizeMultiplier) * ((ViewMultiplier) / (z difference)))

• 3D Spinning Starfield by ProdigyZeta7
  
• Pi Invaders by ProdigyZeta7
  
• 3D Shape Runner 2 by ProdigyZeta7
  
• Slingshot Engine by ProdigyZeta7
  
• Full 16 Frame Walk Cycle by griffpatch
  
• 3D Ripples by GreenConsole
  

define direction (part1) , (part2) //This calculates the direction to a point as if it were on the screen
if <(part2) = [0]> then //if the point is only on the x-axis
  if <(part1) < [0]> then //if the point is to the left of the x-axis
    point in direction (-90 v)
  else
    point in direction (90 v)
  end
else
  point in direction ([atan v] of ((part1) / (part2)) //Use trigonometry to find the direction
  if <(part2) < [0]> then //if the point is below the x-axis, then face the other way
    turn cw (180) degrees
  end
end

define length (part1) , (part2)
set [length v] to ([sqrt v] of (((part1) * (part1)) + ((part2) * (part2)))) //uses the distance formula

define go to x: (x pos) y: (y pos) z: (z pos)
direction (x pos) , (z pos)  //direction to the point in the XZ plane
length (x pos) , (z pos) //distance to the point in the XZ plane
set [Screen X v] to ((length) * ([sin v] of ((direction) + (horizontal angle))))
set [Screen Z v] to ((length) * ([cos v] of ((direction) + (horizontal angle))))
direction (y pos) , (Screen Z) //direction to the point in the new YZ plane
length (y pos) , (Screen Z) //distance to the point in the new YZ plane
set [Screen Y v] to ((length) * ([sin v] of ((direction) + (vertical angle))))
set [Screen Z v] to ((length) * ([cos v] of ((direction) + (vertical angle))))
go to x: (Screen X) y: (Screen Y)

• Warp Field 3D by ProdigyZeta7
  
• 3D Balls in Cube by ProdigyZeta7
  
• Playable 3D Rubik's Cube by boaz4
  
• 3D Human Wireframe! by boaz4
  
• 3D Soccer Ball by boaz4
  
• Point-Based 3D Filled Cube by TiberiumFusion
  
• 3D Block Renderer 1.1 by CodeLegend
  

define calculate transformation matrix (horiz) (vert)
set [Xaxis.x v] to ([cos v] of (horiz)
set [Xaxis.y v] to [0]
set [Xaxis.z v] to ((-1) * ([sin v] of (horiz)))
set [Yaxis.x v] to ((-1) * (([sin v] of (horiz)) * ([sin v] of (vert)))
set [Yaxis.y v] to ([cos v] of (vert)
set [Yaxis.z v] to ((-1) * (([cos v] of (horiz)) * ([sin v] of (vert)))
set [Zaxis.x v] to (([sin v] of (horiz)) * ([cos v] of (vert))
set [Zaxis.y v] to ([sin v] of (vert)
set [Zaxis.z v] to (([cos v] of (horiz)) * ([cos v] of (vert))

define transform point x:(x) y:(y) z:(z) //Apply transformation matrix to point
set [new x v] to (((x) * (Xaxis.x)) + (((y) * (Yaxis.x)) + ((z) * (Zaxis.x))))
set [new y v] to (((x) * (Xaxis.y)) + (((y) * (Yaxis.y)) + ((z) * (Zaxis.y))))
set [new z v] to (((x) * (Xaxis.z)) + (((y) * (Yaxis.z)) + ((z) * (Zaxis.z))))

• Rendering surfaces @Jamohyperturbpro's triangle filling script is the fastest there is.
  
• Sorting surfaces Research which sorting algorithm works best for you: bubble sort, insertion sort, merge sort, selection sort…
  
• Clipping Without eliminating points behind the camera, rendering looks inverted and very awkward. Make sure you render only points whose transformed coordinates are in front of the camera and are within view.
  
• Speed DadOfMrLog said that the fewer blocks and variables you use, the faster your program works. Sometimes recalculating something can be faster than storing it to a variable and reading it when performing operations.
  
• Easy to Use While 3D projects are complex on the inside, they should not be complex on the outside. Figure out which controls work best for the program (arrow keys or WASD?) and always indicate if any other controls are used that could benefit the user (e.g. press L to reduce lag).
  

• http://scratch.mit.edu/studios/252458
  
• http://scratch.mit.edu/studios/201680
  
• http://scratch.mit.edu/studios/535837
  
• http://scratch.mit.edu/studios/347956
  
• http://scratch.mit.edu/studios/392688/
  

ALTERNATIVE 3D CONCEPTS

• 3D Maze Escape by CrazyLegs66
  
• 3D RayCaster by tylerbata
  
• 3D-LANDSCAPE by tylerbata
  
• 3D Maze by griffpatch
  
• Textured 3D RayCaster by eRKSToCK
  
• 3D raycasting maze by PianoApprentice
  

• 3D Object Physics by ProdigyZeta7
  
• Ocean Simulator by ProdigyZeta7
  
• O by DCPU-16
  
• Kart Collision Test by DCPU-16
  
• Polygon Soup by DCPU-16
  

ProdigyZeta7 wrote:

Bump. So glad I found this gem again. It's definitely one of my best posts.

I'm wondering if I should move this to Advanced Topics.

ProdigyZeta7 wrote:

Bump. So glad I found this gem again. It's definitely one of my best posts.

I'm wondering if I should move this to Advanced Topics.

<[chicken] = [life]>

<<<> and < >> and < >>

Generalbiff_ wrote:

…how would I texture this? https://scratch.mit.edu/projects/67361480/ I've been trying since I released it which I think was about 1 year and 2 days ago in fact please help.

Gelatin-o wrote:

how do you get z positions?

<key [O] pressed?>
<key [M] pressed?>
<key [G] pressed?>

Eruptor2009 wrote:

<key [O] pressed?>
<key [M] pressed?>
<key [G] pressed?>

ProdigyZeta7 wrote:

Remember, if you don't understand the concepts behind 3D programming, don't worry about it! You will first need to learn a lot of complex math stuff before you can dig right into 3D.

For your benefit, I have compiled the ultimate list of great sources for learning 3D programming in Scratch. Depending on what type of 3D you're going for, you will want to research the algorithms for transforming points, plotting on screen, and other fundamental concepts. If you still don't know how something is done, take a look at the examples provided with every category.

GENERAL 3D CONCEPTS

Parallax Scrolling (Pseudo-3D)
A great way to introduce 3D concepts is to start with pseudo-3D. This is the easiest form of 3D because it requires no trigonometry: only a few common operations and 3D is accomplished! However, the severe disadvantage of this is that you are unable to view the camera in a direction other than straight forward.

So here's how parallax 3D works:

define go to x: (x pos) y: (y pos) z: (z pos)
set [x difference v] to ((x pos) - (my x position))
set [y difference v] to ((y pos) - (my y position))
set [z difference v] to ((z pos) - (my z position))
set [X position on screen v] to ((ViewMultiplier) * ((x difference) / (z difference)))
set [Y position on screen v] to ((ViewMultiplier) * ((y difference) / (z difference)))

And here's how you would make objects appear bigger as they get closer or smaller as they get farther away:

set size to ((SizeMultiplier) * ((ViewMultiplier) / (z difference)))
set pen size to ((SizeMultiplier) * ((ViewMultiplier) / (z difference)))

It works because as you move left objects move right and vice versa, and as you forward objects get closer and vice versa. The ViewMultiplier variable can be any positive number: This tells how “zoomed” in you are, so a good value would be 240 (to match the farthest x coordinate). This would work best if you wanted to make a background that scrolls ‘slower’ than the rest of the environment to give it that feeling of depth.

Here are some notable examples of parallax scrolling and pseudo-3D:

• 3D Spinning Starfield by ProdigyZeta7
  
• Pi Invaders by ProdigyZeta7
  
• 3D Shape Runner 2 by ProdigyZeta7
  
• Slingshot Engine by ProdigyZeta7
  
• Full 16 Frame Walk Cycle by griffpatch
  
• 3D Ripples by GreenConsole
  

Orbital 3D
The most common 3D projects you see probably go under this category. It's called orbital because the points, not the camera, appear to revolve around a central spot. This is more advanced than pseudo-3D because of the trigonometry involved, but once you learn, understand, and master it your comprehension of other 3D methods become much clearer and stronger.

So to begin, I want you to take a look at sine, cosine, and tangent, to realize what we're going to do. @boaz4 has created an excellent tutorial on the subject, and the following code will be based on his.

define direction (part1) , (part2) //This calculates the direction to a point as if it were on the screen
if <(part2) = [0]> then //if the point is only on the x-axis
  if <(part1) < [0]> then //if the point is to the left of the x-axis
    point in direction (-90 v)
  else
    point in direction (90 v)
  end
else
  point in direction ([atan v] of ((part1) / (part2)) //Use trigonometry to find the direction
  if <(part2) < [0]> then //if the point is below the x-axis, then face the other way
    turn cw (180) degrees
  end
end

define length (part1) , (part2)
set [length v] to ([sqrt v] of (((part1) * (part1)) + ((part2) * (part2)))) //uses the distance formula

define go to x: (x pos) y: (y pos) z: (z pos)
direction (x pos) , (z pos)  //direction to the point in the XZ plane
length (x pos) , (z pos) //distance to the point in the XZ plane
set [Screen X v] to ((length) * ([sin v] of ((direction) + (horizontal angle))))
set [Screen Z v] to ((length) * ([cos v] of ((direction) + (horizontal angle))))
direction (y pos) , (Screen Z) //direction to the point in the new YZ plane
length (y pos) , (Screen Z) //distance to the point in the new YZ plane
set [Screen Y v] to ((length) * ([sin v] of ((direction) + (vertical angle))))
set [Screen Z v] to ((length) * ([cos v] of ((direction) + (vertical angle))))
go to x: (Screen X) y: (Screen Y)

“Horizontal angle” and “Vertical angle” are the rotations applied to the point. In that script the points retain their original coordinates, instead of updating their position to the new coordinates as demonstrated by boaz4.

And for those who need it, a smorgasbord of examples!

• Warp Field 3D by ProdigyZeta7
  
• 3D Balls in Cube by ProdigyZeta7
  
• Playable 3D Rubik's Cube by boaz4
  
• 3D Human Wireframe! by boaz4
  
• 3D Soccer Ball by boaz4
  
• Point-Based 3D Filled Cube by TiberiumFusion
  
• 3D Block Renderer 1.1 by CodeLegend
  

Transformation 3D
If you are really wanting to delve into the advanced kind of 3D, this is the subject. I call it transformation 3D because it relies on a transformation matrix which makes rotating objects and the camera possible.

In Scratch, the rotation matrix varies among those who use it. I'll be showing my version of 3D:

define calculate transformation matrix (horiz) (vert)
set [Xaxis.x v] to ([cos v] of (horiz)
set [Xaxis.y v] to [0]
set [Xaxis.z v] to ((-1) * ([sin v] of (horiz)))
set [Yaxis.x v] to ((-1) * (([sin v] of (horiz)) * ([sin v] of (vert)))
set [Yaxis.y v] to ([cos v] of (vert)
set [Yaxis.z v] to ((-1) * (([cos v] of (horiz)) * ([sin v] of (vert)))
set [Zaxis.x v] to (([sin v] of (horiz)) * ([cos v] of (vert))
set [Zaxis.y v] to ([sin v] of (vert)
set [Zaxis.z v] to (([cos v] of (horiz)) * ([cos v] of (vert))

define transform point x:(x) y:(y) z:(z) //Apply transformation matrix to point
set [new x v] to (((x) * (Xaxis.x)) + (((y) * (Yaxis.x)) + ((z) * (Zaxis.x))))
set [new y v] to (((x) * (Xaxis.y)) + (((y) * (Yaxis.y)) + ((z) * (Zaxis.y))))
set [new z v] to (((x) * (Xaxis.z)) + (((y) * (Yaxis.z)) + ((z) * (Zaxis.z))))

However, one challenge you should keep in mind is that this transformation matrix works for the camera, but when rotating objects the angles should be reversed to compensate for the irregularity with the matrix.


In all cases of 3D, there are challenges you should be aware of:

• Rendering surfaces @Jamohyperturbpro's triangle filling script is the fastest there is.
  
• Sorting surfaces Research which sorting algorithm works best for you: bubble sort, insertion sort, merge sort, selection sort…
  
• Clipping Without eliminating points behind the camera, rendering looks inverted and very awkward. Make sure you render only points whose transformed coordinates are in front of the camera and are within view.
  
• Speed DadOfMrLog said that the fewer blocks and variables you use, the faster your program works. Sometimes recalculating something can be faster than storing it to a variable and reading it when performing operations.
  
• Easy to Use While 3D projects are complex on the inside, they should not be complex on the outside. Figure out which controls work best for the program (arrow keys or WASD?) and always indicate if any other controls are used that could benefit the user (e.g. press L to reduce lag).
  

These studios contain 3D projects of all sorts that I think you will benefit from:

• http://scratch.mit.edu/studios/252458
  
• http://scratch.mit.edu/studios/201680
  
• http://scratch.mit.edu/studios/535837
  
• http://scratch.mit.edu/studios/347956
  
• http://scratch.mit.edu/studios/392688/
  

ALTERNATIVE 3D CONCEPTS

Ray casting
Ray casting is a fast method of drawing the environment using a 2D grid and what is known as the Digital Differential Analyzer. It plots vertical strips along each x position, and the size of each strip represents the distance to a wall or object when facing that direction. Ray-casting is essentially casting a ray until you've hit a wall. The disadvantages of using ray-casting is that you can only rotate left and right, and that overhangs are usually impossible because of the limitations of 2D grids (however, griffpatch has shown that overhangs are possible!). I don't feel like reinventing the wheel, so if you would like to see a more in-depth look at ray-casting techniques and its implementation in computer code, see this awesome document.

Here are some excellent examples of ray casting on Scratch:

• 3D Maze Escape by CrazyLegs66
  
• 3D RayCaster by tylerbata
  
• 3D-LANDSCAPE by tylerbata
  
• 3D Maze by griffpatch
  
• Textured 3D RayCaster by eRKSToCK
  
• 3D raycasting maze by PianoApprentice
  

Ray tracing
Don't get this mixed up with ray casting. Ray tracing is a slow technique, but makes incredibly realistic and detailed scenes. For every pixel on the screen, the program “shoots” a ray into the world of objects and determines where the closest intersection occurs, if there is one. The ray is then reflected off the object at the intersection and again “shoots” into the scene. This is repeated for a set amount of times or until the ray doesn't hit an object, and depending on what objects it hits a color is assigned to that pixel. The detail of ray-tracing depends on many factors: phong, diffuse, and ambient lighting; radiosity, reflection, and refraction; resolution, field of view, and limits to additional ray-tracings. Because Scratch is not as powerful as other languages, ray tracing is extremely slow, and is not recommended if you aren't patient about it.

For a step-by-step introduction to ray tracing, @Canthiar has done an awesome job of making a studio for ray tracing tutorials.

And if you are curious, I'm creating a powerful recursive ray tracer as well.


3D Physics
For some, making physics simulations in 3D is awesome, but it requires extensive knowledge of the subject. A handful of Scratchers, including myself, have successfully made physics simulations in 3D. However, this has some major impact in performance such that in addition to transforming and rendering the points there is the issue of allocating just enough processing power to complete the physics calculations in the same frame. It is a good idea to include physics to really impress people, but not if you're looking for a speedy performance.

These are a select few examples of physics and collision in 3D:

• 3D Object Physics by ProdigyZeta7
  
• Ocean Simulator by ProdigyZeta7
  
• O by DCPU-16
  
• Kart Collision Test by DCPU-16
  
• Polygon Soup by DCPU-16
  

Well that wraps up the lesson on 3D. If you have any questions or concerns about issues I didn't cover yet, please let me know and I will add to this post.