Whiteboard Blueprint


I created this Whiteboard as a learning experience, just to see if it could be done.
It’s being released to the public to learn and adapt for yourselves.

Three things to note before you download.
First, i am not 100% sure this is the best way of doing this, basically we’re spawning a decal on every tick so it may or may not be viable, performance wise.
The second, I couldn’t find a way of deleting the decals after spawning them, which means that I did not add an eraser.
And lastly there seems to be a feature built in the engine which deletes all decals if there are too many, you will notice this happen after a white of using it, would be nice if an Unreal Developer could chime in with anymore info on that matter.

So anyway, enjoy!
Don’t forget, if you find better ways of doing this, please share it with this thread.

*As always, this model and blueprint was done by myself and you are free to use it in your own project, commercial or otherwise.
*


Download = https://drive.google.com/file/d/0BwcqVritglcbdlJZUWpQNk01OEE/edit?usp=sharing

Nice! I created my own drawing system and ran into the decal issues too!

Thank you very much!

This is really cool! I like your ‘out of the box’ thinking. Do you think this could be implemented in a game? So, the player could run up to the board, write something and run off again?

Cheers

Jay.

Fantastic job Divinitize! Worked great when I tried it out the other day. Keep up the great work and hope to see more of your projects in the future!

Yep, you should just be able to right click on the whiteboard folder and hit migrate, choose your projects content folder and you’re good to go.
You can then just drag out the whiteboard blueprint and place it where you want, however be wary of the spawn decal nodes transform, you might need to change the rotation of the spawned decals if using it on a different axis compared to mine.

@Divinitize - I have some code you may find interesting, for making a UTexture2D out of a color data buffer.

If you want it I can clean it up and send it over, it should be possible to create a more robust whiteboard using it by simply keeping around a buffer of your color data and updating the texture each time the user changes the data in the buffer. Then it’s just a matter of setting the texture onto a dynamic material instance (to be used by the whiteboard mesh).

I appreciate the offer, however i am not familar with c++ in any way, but if you want to post it here anyway im sure somone will find some use for it.
Thanks.

You could use it as a Blueprint node quite easily, actually, though my code would need some changes, as you’d probably want to use an array of FColors in Blueprint. Anyway, I’ll make some changes to it so it’d be easier to use in Blueprint, test it out and upload it somewhere here. Should be useful for a lot of purposes :slight_smile:

Whoa - this is super cool!

thanks for sharing it :slight_smile:

I’d be interested in seeing your code.

Oh Man thanks a bunch for this whiteboard project.
This get me started to make Tire mark on the ground.
I’ll obviously set the decal lifespan to be limited for the tire track :slight_smile:

Thanks for the project!

Sure! Another user requested it as well. The way of doing it I mentioned in my last post isn’t as good as the method I came up with (which uses a render command to actually update the texture, which means its outside the game thread and shouldn’t cause any hanging there).

Currently this is untested, so let me know if you run into problems and I’ll do what I can to fix them (more info to debug the better), though it should work.

I’ll be adding this code to my TextureFromDisk plugin repo, as well as passing it off to if he’d like to include it in his BP library (which is better maintained across versions than my plugin repo), but I’ll share it here just to get it out quickly.

The first thing is to add this function to your code:

A new, community-hosted Unreal Engine Wiki - Announcements - Epic Developer Community Forums (UpdateTextureRegions is what you want)

Next, here’s the declaration for the Blueprint node function:


	
        /** Updates a UTexture2D* from an FColor array.
	* Update texture from color data.
	* @param ColorData		Array of FColors to update this texture with. Array is assumed to be the same dimensions as texture, otherwise this call will fail.
	* @param Texture		Texture to update.
	*/
	UFUNCTION(BlueprintCallable, Category = "TextureFromDisk")
	static void UpdateTextureFromColorData(TArray<FColor>& ColorData, UTexture2D* Texture);


And the definition:



void UTextureFromDiskFunctionLibrary::UpdateTextureFromColorData(TArray<FColor>& ColorData, UTexture2D* Texture)
{
	// Sanity checks.
	if (!Texture)
		return;

	if (ColorData.Num() <= 0)
		return;

	// Update region.
	FUpdateTextureRegion2D *region = new FUpdateTextureRegion2D(0, 0, 0, 0, Texture->GetSurfaceWidth(), Texture->GetSurfaceHeight());

	// Call the render command.
	UpdateTextureRegions(Texture, 0, 1, region, Texture->GetSurfaceWidth() * 4, 4, (uint8*)ColorData.GetTypedData(), false);
}

You’ll want to get a blank texture of whatever size you need set up first, along with a material. Then you’ll need an array of FColors, which should be sized the same as the number of pixels in your Texture2D (width * height = number of elements).

When your user clicks or what not, update the FColors at the correct X/Y locations. Then call the Blueprint node there and pass in the color array and Texture.

Right now it’s set up to update the entire texture at once, due to the warning mentioned on the wiki page for the Dynamic Textures code. I haven’t tested whether or not it actually works with sub regions correctly, but it should be easy to extend to do that.

Edit: Right now the way it’s set up it will leak the FUpdateTexture2D - so you may want to change UpdateTextureRegions to free the FUpdateTextureRegion2D but NOT the SrcData pointer, because that refers to your TArray of FColors, which you don’t want freed.

To fix that, change this in UpdateTextureRegions


	
	if (bFreeData)
	{
		FMemory::Free(RegionData->Regions);
		FMemory::Free(RegionData->SrcData);
	}


to this:



	if (bFreeData)
	{
		FMemory::Free(RegionData->Regions);
	}


If you change this, make sure to change the last parameter for UpdateTextureRegions to be true, so it will actually free the FUpdateTextureRegion2D.

i just tested it.
pretty cool idea and implementation!

Thanks for sharing!

Reminds me of Duke nukem forever in a good way. :smiley:

Sorry I had too.

1 Like

This is a cool idea that can have many implementations. Thank you for posting.

Maybe some of you can help me out with my attempt to implement this. My particular project in mind, instead of a whiteboard consists of a glassboard. I’d like to make an animation of a (hand) finger rubbing across a foggy glass wall, (like you were in the shower and writing on the glass walls). Then after some time elapses it slowly fades back to being foggy. On top of that central interface (essentially a glassboard), I’d like to add the rubbing sound and finally, an actual video in the background of something that would revealed only in portions where the fog is cleared.

I’d like to type in text and let the tip of the finger follow the natural way the letters would be made on the wall and for this to be an interactive animation where a player does it himself anyway he wants. It would be like one of those whiteboard promo videos essentially, but glass, fog, and finger. I searched them online and found some decent looking software to customize, but it’s not what I want for my needs.

My background is in Blender, but most limited to modeling/industrial design. I’m currently doing tutorials in Unity for 2D/3D gaming. I have no experience in Unreal Engine, but I really like Unreal’s user interface. I have Unreal on my list after I testing out Unity. So there’s two parts to my project. 1. the board and 2. adding sound and video. Do you think my best route to go is in Blender, Unreal, or some other video editing software out there or a combo? Would this whiteboard script be a good place to start (well after I did all my basic tuturials of Unreal of course).

Thanks for any input, I really would appreciate it and come back with updates if I’m able to make this project.

The Duke nukeem example above video, that game was made in Unreal4?

It was made in Unreal 3 but the same concept should apply for Unreal 4. :slight_smile:

I played around with the concept but resorted to simple transitions instead. Of course using unreal engine for a slideshow demo video wasn’t really a great idea to begin with, if I had implemented this feature it would take too long anyway. It’s definitely a cool feature. Anyway, here’s the video I made if anyone is interested.