Trying to emulate the look of loading ZX Spectrum title screens. Help!

I am looking to replicate the style of screen loading as seen on the ZX Spectrum in Unity. Not the stripes of colors in the background. Just the title image loading.

Specifically the way it looks in this video at 50 seconds in:

I like the way it seems to load the image, top-down, from left to right, in chunks. Anyways, I am not sure how to accomplish this or what I should even search for to find the answer.

Ideally I would like to update the screen this way on each frame of the game, with the next frame “drawing” the screen overtop of the previous frame. It would also be great to be able to control the speed and amount of screen it loads per frame.

Does anyone have any tips on the best way to accomplish this? Or at least where I should be looking?

Thank you for your time!

I mean heck you could just animate a black plane to reveal the image in like two seconds but maybe you’re looking for a more fancy way to do this?

Can checkout ShaderGraph and how to make shaders.
or the animator.
or maybe use a movie file or animate the thing outside unity.

I imagine you’ll be working with the UI Images?
but could also be done in 3d space.
quite a number of options you have just have to pick one that you think looks appropriate and try it.

1 Like

I like the idea of a black plane revealing the image. This could work well. I will check out the ShaderGraph and animator as well. I am just trying to determine the most efficient way to accomplish this.

The idea I have would be exclusively in 2D. I am imagining it like the old school dungeon crawlers with each frame loading with each step the player takes, with the occasional billboard sprite for an enemy.

Thank you!

1 Like

I wonder if you could use a simple alphatest shader and just animate the threshold property at runtime. For your intro screen, you could just divide it up in to rectangles in your image editing software and make each one more transparent from top, left to bottom right.

When you use the alpha test shader, the image will appear opaque but more of the image will be shown depending on what the threshold is set to.

Edit: I’ll probably try an experiment because if that works it could be useful for a lot of other special effects.

1 Like

check also transition effects and shaders, like
Transition Blocks | Camera | Unity Asset Store *this is probably full screen effect though

other alternatives,

  • use setpixels on low resolution texture (which is on top of that image), then can make it easily random every time
1 Like

I am trying to follow what you are saying. After a quick google of “alpha test shader” I do believe this could be useful, however I have some questions about what you mean when you say “more transparent from top, left to bottom right” and “the image will appear opaque…”

If I follow the method you are suggesting, would any one part of the image appear as transparent in any way? I guess you are saying that the “opacity” of each rectangle will determine the threshold at which the rectangle becomes visible or invisible.

But how would I control when it starts rendering and when it stops? For instance, I would like for the completed image to remain on screen until there is input from the player. Then I would like for it to begin drawing the new image overtop of the old image, and again remain on screen as a whole image.

Depending on the level of customization on this, this may work perfectly. I did not see this when looking in the asset store for transitional effects earlier. Thank you so much!

Yes exactly. Alpha cutout is all or nothing. I’m thinking you could reveal more of the image over time by adjusting the threshold but the part that is visible should be opaque. Once the entire image is revealed, you could just leave the threshold where it is and the image should stay one the screen.

1 Like

That is a very interesting solution. I did not even know such a thing existed. I will attempt this method as well. Thank you very much!