Living Museum of Learning

Where real moments become exhibits
← Prev Next →
The Third Stick Pointing at Your Nose

The Third Stick Pointing at Your Nose

How Enning, Tianjing, a whiteboard, and a “gun tip” finally made the invisible Z-axis visible

Enning had already begun exploring 3D.

The day before, she had tried 3D coordinates in Desmos. Today, we were going to bring that same spatial world into p5.js.

But before touching the computer, I deliberately stopped.

I asked Enning to draw the X-Y-Z coordinate system on the whiteboard.

X was easy.

Y was easy.

Then came Z.

How do you draw a third direction on a flat piece of paper?

I tried explaining that the Z-axis points out of the plane toward us. I tried again.

Nothing.

The words were not getting through.

I eventually reached the point of admitting defeat:

“Could you find anyone at home so we can discuss together?”

I needed help.

Tianjing came.

I asked her to look at the problem.

Her first response was almost perfect:

“No, I don't get it.”

😂

For a moment, I had two sisters and one impossible third dimension.

Then something clicked for Tianjing.

She looked at the imagined third stick from directly in front and realized:

“Oh, yes. It looks like a point when we stare at its tip.”

There it was.

The missing mental model.

I immediately called her back:

“Tianjing, Tianjing!”

Enning informed me:

“She left.”

😂

So Tianjing was invited back.

I asked her:

“Could you explain the space position of this 3rd stick pointing to our nose to your sister?”

This time, Enning listened to her sister.

And then:

“Ah, I see it now.”

Only after Enning understood the “stick pointing toward our nose, like the tip of a gun” idea did I allow her to draw the slanted Z-axis on the whiteboard.

This order mattered.

The slanted line was no longer a strange convention that she had been asked to memorize.

It was now a picture of something she could imagine physically.

Then we moved to p5.js.

I had her draw the same X-Y-Z system in a real 3D canvas.

We used a deliberately simple visual language:

X = red
Y = green
Z = blue

We didn't even need arrowheads or the letters X, Y, and Z.

Red, green, blue already told us the identity of the three axes in the correct order.

Then came the moment that made the whole struggle worthwhile.

When Enning looked directly along the Z-axis, the “missing line” was not missing at all.

It appeared as a dot.

She dragged the 3D canvas.

The dot became a line.

The hidden dimension revealed itself simply by changing the viewpoint.

The whiteboard explanation, the physical “gun tip” analogy, and the computer visualization suddenly became the same idea.

The Desmos Joke

There was another little detail that almost made me laugh to tears.

The previous day, Enning had experimented with 3D X, Y, and Z in Desmos.

So when she created today's p5.js project, she named it:

desmos

I had to admit:

“OK, that's not a bad name actually.”

😂

It wasn't just a random project name.

Desmos had apparently become part of the mental landscape of her new 3D world.

Another Door: Color

And then another connection appeared.

A few days earlier, Enning had said:

“I want yellow but I don't know how.”

At the time, my brain didn't go to the obvious solution.

I told her:

“Maybe removing blue can get something close.”

Today, we found the exact tool she needed: an online color picker that turns a chosen color into its RGB values.

Suddenly color was no longer something mysterious that the computer somehow “had.”

She could choose a color, read its RGB numbers, and put those numbers into her program.

And this connected beautifully with the coordinate system she had just learned:

X → red
Y → green
Z → blue

Geometry, coordinates, RGB, programming, and visual design were beginning to meet in one little 3D playground.

The New Friends

Then we filled the world with shapes.

A sphere.

A box.

A cone.

A cylinder.

A torus.

Each one could be moved with translate().

Each could have a different color.

And with orbitControl(), Enning could grab the whole world and look around it.

The lesson was no longer merely about learning five p5.js functions.

She had discovered that she could create a little three-dimensional universe and move herself around inside it.

Before the class ended, I said:

“Let me tell you the homework...”

Enning immediately:

“OK, OK.”

But she wasn't really waiting for me to finish.

She was already picking colors from the online palette we had found together minutes earlier.

I was explaining the second half of the homework.

She was already mentally doing it.

😂

The most important thing Enning learned today was not torus(), sphere(), translate(), or orbitControl().

It was that something can be real even when it doesn't look the way you expect from one viewpoint.

A 200-unit Z-axis can look like a dot.

Rotate the world, and the same object becomes a line.

The object didn't change.

Her viewpoint changed.

She also experienced something equally important:

A difficult concept does not have to be conquered immediately.

Sometimes you stay confused.

You try another explanation.

You ask another person.

Someone else is confused too.

That person suddenly sees it.

They explain it differently.

And eventually:

“Ah, I see it now.”

That “Ah ha” is worth waiting for.

The Homework

I eventually gave her two assignments:

HW1: Figure out the two parameters of torus().

Not “here is what they mean.”

Figure it out.

Change the numbers. Observe. Experiment. Reverse-engineer the shape.

HW2: Build something with our new friends — all the shapes we met today.

No prescribed picture.

No step-by-step recipe.

Just:

Go play.

Enning replied almost immediately.

One “ok.”

Then another OK 👌.

😂

Doors

Door 1 — See the Invisible
A Z-axis can be a line, a slant, or a dot depending on where you look from.

Door 2 — Make the Numbers Come Alive
RGB turns a color from something she wants into something she can construct and control.

Door 3 — Play Beyond the Assignment
Once the shapes became “our new friends,” homework stopped feeling like an obligation and started feeling like an invitation.

Reflection

There was a time when I would have been impatient.

Five years ago, I might have explained the Z-axis again and again, wondering why a seemingly simple idea wasn't getting through.

Today, I could wait.

I could let the confusion sit there.

I could bring Tianjing into the room.

I could let Tianjing say, “No, I don't get it.”

I could wait for her to see it.

I could send her back to explain it to her older sister.

And I could wait again.

Eventually, Enning said:

“Ah, I see it now.”

That sentence was the real lesson.

The third axis was not the only thing that emerged today.

Patience did too.

And then, almost immediately, came the reward:

“The 3D world is so rich.”

Homework assigned.

Two OKs received.

And somewhere inside that 600 × 600 canvas, Enning was already playing.