Virtual Measuring Tape

To show people how to measure stuff

A client asked for some specific animation elements in some videos, and one of those elements was a tape measure being hooked on the end of a board and drawn out, as a person would do with a real measuring tape to mark a board.

Ok, that's not really that big of a deal, but I'm going to have to do this numerous times, and I don't want to be handling all of that manually every time. For a case like this, it's worth investing a bit of work on the front end to make this part of the project much easier and faster later on.

For those of you not familiar with Unreal Engine, this post might sound like complete gibberish, but maybe it can introduce you to some things you've never seen or heard of, and hopefully that can be of some interest. Let's get started.

The Plan

There's no way I was going to model and animate a tape rolling up inside the body of a tape measure. An important thing to remember with 3d visualization is that if you can't see it, it doesn't matter. The only thing we see of the tape portion of a measure tape is when it's drawn out straight, right? The rest of the time, we just don't see it at all. That's the hint for the solution. When it goes "in" the measure tape body, just make it invisible.

I found a handy tutorial for this part of the functionality and then carried that over into my project. Here's the short version: there's a box that makes invisible any material that uses a certain material function. That becomes the magic box the tape will disappear into. That's probably confusing right now, but hopefully it will become more...transparent later on.

The Model

I modeled up a reasonable likeness of a Craftsman 25' measure tape body in SketchUp. I'm not partial to Craftsman. I just found a picture of it and figured it would work. It's about as accurate as it needs to be for the purpose (which isn't very accurate). This is not proper modeling and texturing for game development, but since this isn't for a game, it doesn't need to be, so it isn't worth the time to do it "correctly." Doing it "correctly" means proper topology on the modeling geometry, and unwrapped UVs for minimal materials.

The tape portion is just a 25' long, slightly curved piece with the metal tab on the end. The texturing for the tape was a bit more involved since I had to make the texture, and it had to be applied to the tape using projection mapping with a 1" offset every 24". It ended up working quite well though, and it condenses the texture into a much smaller, square texture, which is properly done.

We have a measure tape body, and a 25' long straight tape. What now?

The Blueprint

In Unreal Engine 5 (UE5), there's a certain type of file called a Blueprint (BP). At the simplest level, you can think of these kind of like miniature programs within the program. The plan is to create a BP for our measure tape that will combine the two 3d models (body and tape), the magic invisible box, and a bit of functionality that will make it easier to control and animate.

The first step is to get the models into UE5 and set up the materials. Here's what I got after setting up a few basic materials.

Ok, let's make the BP. Rather than creating a new one, we're going to start with the BP created by the tutorial I mentioned earlier. We need all the programming for the invisibility box in there, so that's going to become our measure tape BP.

Inside the BP, I added two static meshes, one for the measure body, and one for the tape. Counterintuitively, I made sure the measure body is a child of the tape, not the other way around. This way, I can place the BP where I want it in the world (which is to place the metal tab of the tape where I want it), and then the body will move away from the tape while the tape stays in place.

Let's get this thing working. For this project, I need this whole system to operate in the editor, not in game, so I'm going to do all the coding in Construction Script rather than the Event Graph.

We only need one variable for this, which is a float variable that will represent how far the tape is extended out of the body. This variable needs to be set to public so I can access it from the details panel in the editor. It also needs to be exposed to cinematics so I can animate it in sequencer later.

Rather than go through this node by node, here's the construction script:

And here's basically what's happening: get the world location of the invisibility cube and the measure tape body. Add the amount of the TapeExtension variable to the X axis of the invisibility cube. Then, do all the same stuff to the measure tape body so it moves along with the invisibility cube. The rest of the math is conversion from cm to inches, and so our tape extrusion variable is positive instead of negative. After all that is done, run the macro for the invisibility box (that's the last node).

Now, we can drop the measure tape BP into the world and test it. In the details panel, I have a field where I can input a length in inches, and the measure tape body will slide backward that amount! Very slick. This is also very easy to animate now since that same variable is exposed to cinematics.

That's it! I've been doing more UE5 development recently with more projects on the way. This was a fun and successful little project, and I look forward to using it to create instructional videos for my client.

Should have a new woodworking video coming next week!