Advanced CRT Shader for GameMaker
A downloadable asset pack
~SittingDuck's CRT Shader for GameMaker~
NEW UPDATE 2024-11-29:
- Added the ability to capture user-specified draw events and include them on the CRT screen, fixing the GUI sizing issue some users were reporting.
- Ensured that all blending operations are now gamma-correct, improving color accuracy and playing more nicely with HDR.
- Took phosphor masks back to the drawing board and came up with a much more flexible solution requiring fewer textures.
- Added beam dynamics, adjusting the size and shape of scanlines depending on the energy of the beam.
- Reworked the reflective screen border, allowing users to customize its size and material properties.
A robust and flexible CRT shader that aims to be scalable and easy to implement.
Out of the box features include:
| Scanlines | Curvature | RGB phosphor emulation | Bezel reflections | Automatic resolution and aspect ratio handling | Interlacing | Integer scaling | Halation, glow, and bleeding effects | Support for portrait (TATE) mode | Support for bezel overlays
To implement with your existing game, place a preset object in the first room of your game or create & destroy one via code in your game's menu. Ensure that your game's aspect ratio matches that of the preset object. That's it!
Advanced use:
All parameters of the shader are addressable from any object just by referencing the crt object. For example: "crt.glow_amount += 0.1". Just make sure to update the shader uniforms afterward with "crt.update_uniforms()"
Learn to use effects that retro game developers used with CRT TVs in mind; exploit interlacing, blending, or phosphor glow for your game's benefit!
Detailed documentation and a working example project are included to quickly get your project up and running!
Purchase
In order to download this asset pack you must purchase it at or above the minimum price of $1.99 USD. You will get access to the following files:
Development log
- 2.0 Update for Advanced CRT Shader49 days ago
Comments
Log in with itch.io to leave a comment.
Does this shader work well with the HTML5 export?
I'm considering getting this. Will it work with a 480x270 resolution?
The shader will work with any resolution you specify. In the variable definitions of the crt object, just set game_width, game_height, and screen_aspect_ratio to whatever is appropriate for your game.
Hello, I'm a huge fan of the shader! I have one issue I'm struggling to figure out. Using the 480i preset, I get a minor reflection on the borders of the image. I have set border_width to 0 and border_brightness to 0, played around with a bunch of other settings and can't work out how to remove this. I haven't tried any other presets as my game was 640x480 originally. Thank you in advance if you can help me!
I just took a look, and it seems that the screen edge antialiasing is responsible for that 1 or 2 content-pixel reflection. For a quick fix, just change line 134 of shd_crt from this:
Into this:
Hope this helps! I'll most likely fix this in the download at some point in the near future.
This worked, thank you!
I wanted to let you know I was unable to get the preset to work across multiple rooms initially. It only wanted to work in the room the preset was actively in. I added a Room Start event to the preset that just reruns the creation code whenever I change rooms, and it works now. Could this create problems in the future?
Hello, firstly good job on this shader, it looks brilliant. Quick question, my game support window / screen resizing. When I resize the screen from a different aspect ratio the shader doesn't look great (I get banding or stripes). Can you suggest a way around that so the shader renders properly. Thanks.
Hi, thanks for using my asset! If you want to be able to resize your game window, you’ll need to resize the GUI surface; GameMaker doesn’t do this for you except at the start of the game. In either a step event or the resize event, you’ll just need to check if the window dimensions are different from the GUI surface size, and if so, call display_set_gui_size(), and grab the window dimensions with window_get_width() and window_get_height().
Just downloaded and the effect looks great, but I'm having an issue. If I place any other object in the game besides the preset I get this error:
___________________________________________
############################################################################################
ERROR in action number 1
of Draw Event for object crt:
Variable <unknown_object>.gui_user_event(100040, 1) not set before reading it.
at gml_Script_anon@3326@gml_Object_crt_Create_0 (line 64) - event_perform(gui_user_event[0], gui_user_event[1]);
############################################################################################
gml_Script_anon@3326@gml_Object_crt_Create_0 (line 64)
gml_Object_crt_Draw_75 (line 4) - crt_apply()
Just uploaded a quick patch to fix the one line of code that was causing this! Just an oversight in a with() clause where I forgot to reference crt.gui_user_event instead of gui_user_event.
Thanks for the asset, the shader looks amazing! Do you have any suggestions for getting the shader to work on only a specific surface? For example, in my game I want to have the camera zoom into a TV in the room and have the scanlines only show up on the TV screen (the content of which is being drawn to a surface).
Thank you for trying my asset! I would suggest taking a look at the "Draw GUI" events for the CRT object, where you'll see that the rendering is wrapped up in a single function call. If you call this function while your surface is the current target, the CRT screen will be drawn directly to your surface instead of the GUI surface. You'll need to ensure that crt.output_width and crt.output_height match the size of your surface, and I'd also recommend disabling the phosphor mask if your surface will be zooming or stretching around the screen.
so I was having issues with get_mouse_coords() and just wanted to share my solution for this. even though I had my view, viewport, camera, and crt settings all set to a window width of 540, for some reason, window_get_width() would return a value of 514. so I replaced the code in get_mouse_coords() to use the actual window dimensions. this isn't pixel perfect, but it is very close & functional:
var u = display_mouse_get_x() / window_get_width();
var v = display_mouse_get_y() / window_get_height();
Hi. I've bought this shader today and it looks amazing, exactly what I wanted. However, I have a problem: when the shader is in the game, some text in the draw GUI events of other objects does not show up. How can I fix this?
look like i'm not alone having a problem with the GUI being smaller than normal... here a screenshot to illustrate the problem:
as you can see, the game is messed up, it should looked like this without crt:
update: i managed to make it work by removing "resize_window()" variable in room_start but one problem: my game use the aspect ratio of 16:10 instead of 4:3 or 16:9, it might be a good idea to split the aspect ratio variable into 2 variable on the height and width. example: if it's 16:10, it will be aspect_ratio_width: 16 and aspect_ratio_height: 10. what do you think?
Hi - really cool shader and can be picked up by a monkey like me that has barely any idea what theyre doing
Quick question (may be obvious but idk) can this be applied to a few elements on screen rather than everything on screen? Can this be applied only to the UI for example?
Thanks :)
Hello! I really love the shader, thank you for creating it :) However, I have the same problem as Mewsturbo_喵斯塔卜 - everything that's drawn in hte draw GUI event (which I draw on the application surface) is displayed too small. Is there an easy way to draw it, keeping the original size, without having to scale every element manually?
Cheers!
Hi! Love this tool very much. I had issues using this with HTML though and had no idea how to fix it for a while.
Tracked the issue down to the variable; flip_rgb_layout being used as an int while it is a bool. This is normally okay for gamemaker's compiler as it converts it automatically, but when it is converted to javascript it throws an exception.
Changing the bool to a regular integer value seems to fix the issue.
Just a little heads up for anyone wanting to use it with HTML :)
Hello, thank you for your product! I quickly mastered most of the methods of using the plug-in, but there is a fatal problem that has not yet been solved. That is, after using this plug-in, my project no longer draws the content of the GUI. I don’t know what happened? I just draw the content in the GUI event of my GUI object
Hello,
Thank you for trying my asset!
This asset hijacks the application surface to use as the basis of the simulated CRT screen. If you want your HUD to appear on top of the CRT screen, then you'll need to draw it after the CRT object calls crt_apply() in the Draw GUI End event. Alternatively, if you want the HUD to be included inside the CRT screen, then you'll want to draw it directly to the application surface in the Draw GUI event using surface_set_target(application_surface) followed by surface_reset_target().
Thank you for your answer. I can now draw my UI information (I want the HUD to be included inside the CRT screen). However, they are very small, which seems to be because they follow the UI size required by the CRT. Is there any way to keep my UI information at the original size of 320*180? Thank you again!
Hi, sorry is there a way to turn off/on the shader within the game by code ?
I tried destroying the instance and doing shader_reset() but get a black screen only, semes other things need to be reset.
Well I ended up doing couple of things to fake this, set some values to 0 like curvature,scanlines intensity and set an empty/transparent image for the phosphor texture mask.
Still I have to restart the room before some changes apply (like the curvature) but kind of makes the trick. If there's a better way to toggle on/off the shader please let me know.
Hello,
Thank you for trying my asset!
Whenever you change any of the CRT object's settings at runtime, you'll need to have it call the function "update_uniforms()" to see the changes reflected in-game.
To disable the effect at runtime, If deleting the CRT object causes issues, you could also choose to disable it by setting its "shader" variable to shd_raw. This shader is more or less a passthrough shader that only handles aspect ratio and optionally curvature (which you could disable for a raw pixel art look).
I hope this helps!
Thank you !! will give it a try !
I was excited to try this but I'm running into some issues.
The description mentions documentation and an example project, but the only file I see for download is the yymps. Where are they?
In addition, when I try to import the yymps, GameMaker freezes and stops responding to input. That might just be a problem on my end because I'm not currently on the latest version of GM, I'm a bit behind on updates. Could that cause a crash on import or is something off with the itch download?
Thanks for your help.
EDIT: The game version was the culprit and I see the documentation and example inside the yymps :)
Awesome shader ! I was thinking about using something alike and found yours, probably a bit overpowered for my humble game, but couldn't resist to use it. Thank you !
Sorry if doesnt look actually good in my game (I've not a "trained sight" for CRT art, or art at all, but the curvature effect is something I wanted to have)
I used a diff preset, it looks a bit better, thanks again !
Got this on the marketplace. It’s the best GMS crt shader I’ve used for sure!