Uborder shaders

Hi! I love how fast Uborder is!! I just have one question: Does Uborder generate the bezel? Or just it’s reflection over a “real” bezel of the overlay?

1 Like

Nope, it’s use bezel from the BORDER image that defined in uborder.slangp. This is why it’s really fast.

The reflection is generated by uborder though, we can set the reflection area manually in shader parameters.

1 Like

Nice! As already answered, it doesn’t create the bezel. The reflection is added over the border (background). so, the border must include an inner and well behaved bezel inside it for the reflections work as expected. If it doesn’t, I recommend use just the uborder preset without the reflections.

Besides, if you search carefully, you’ll find many free available overlays that already have bezels.

Other than that, you can just load a bezeless background on Mega Bezel using some of its presets that create the bezel and save a screenshot with that bezel already adjusted to your background and use with uborder.

I don’t know the speed hit of creating its own bezel via shader. It should go to TODO list…

1 Like

Yes! And I think I´ve found the best source for that: @Duimon have create these bezels for Potato Mega Bezel, so they are perfect for Uborder.

I actually suggest you to add it to the first post, as an alternative to Orionsangel´s pack.

1 Like

Thanks for the link, I didn’t know it. There are so many overlays out there. This one from @Duimon looks very complete, so many systems…

2 Likes

Yes, very complete indeed. I hope someone do the same for vertical (9:16) TVs. My goal is build a vertical set using your shader and the overlays from here.

1 Like

I did say the CRT shaders looks pretty good on handheld games, however after playing it for an hour I think I still prefer the sharp look of LCD screen. So, I decided to port dot shader so it can be used with Uborder. Fortunately it’s not as hard as I expect, although it still took me several hours to did it. Anyway, here is the result:

Obviously it doesn’t have any curvature, but now I have bezel and reflection, which is nice :sunglasses:.

As comparison, here is how it looks like on CRT shader:

5 Likes

Nice. If you don’t mind, I’d like to insert it in the next content-shaders pack release. I can even test if curvature would work with these shaders (as an option, of course!).

2 Likes

Sure, I’ve put it here in Pastebin. It’s my first time modifying shader so please go easy on it :sweat_smile:

3 Likes

Update 24-12-01:

  • Update content_shaders_pack to include: crt-gdv-mini, dot (thanks to @acrophobic) and lcd-grid-v2 for handhelds;
  • I made a change in organization. Now the presets folder is no more inside uborder folder. The borders_pack must be installed in ‘shaders/uborder_packs’ Retroarch root directory;
  • Update borders_pack to include Duimon-Mega-Bezel-Potato compatible presets.

So, now the presets folder is no more inside uborder. The borders_pack must be installed inside ‘shaders/uborder_packs’ Retroarch root directory.

Some screenshots:

8 Likes

Some experiments with stained screens:

kof98-241204-194230 kof98-241204-193958 kof98-241204-193947 kof98-241204-193921

4 Likes

Your new shader is very cool, and much needed.

I like these TV borders in your screenshots, is there a pack for them or something?

2 Likes

Thanks. I have some random TVs I’ve been collecting on the net for tests. I didn’t released as a pack because they have brands and I don’t know if I should be promoting it.

But, if you’re interested in these findings, I just uploaded here. Get it while available.

I like this in particular, because it gives the atmosphere to some games:

Silent-Hill-USA-241204-221305 Silent-Hill-USA-241204-221246 Silent-Hill-USA-241204-221113 Silent-Hill-USA-241204-221052 Silent-Hill-USA-241204-221040 Silent-Hill-USA-241204-221020 Silent-Hill-USA-241204-220947

5 Likes

I was trying to set up some vertical uborder presets but to make it work I have to turn on vertical mode in fbneo core’s options, is there another way, within the shader, to rotate the image?

2 Likes

In the next version I’ll change the method. For now, in fact, you need to turn Vertical Mode ON on core options. I’ll change that to read the uniform Rotation and auto rotate according to that.

5 Likes

Another showcase from Android. This time I didn’t use the “FULL” aspect ratio which messed up the view in portrait orientation. Instead here I use core provided aspect ratio with integer scaling, combined with bezel that seamlessly connects to the overlay. This way it works on landscape mode:

landscape-unicorn

And it works as well in portrait orientation:

3 Likes

New release: Uborder-v0.0.3

What’s new:

  • Reflections code rewritten to include new operations like corner, warp, screen stain alpha transparencies, etc;
  • Auto rotation for vertical games based on Rotation uniform.
  • Downsampling presets that uses @guest.r g-sharp2_resampler for games running at High Internal Resolution (2x, 3x and 4x included);
  • New Spooky TV textures/presets: Silent-Hill (with screen stain transparencies);
  • Spooky Tv presets now has reflections;
  • Borders and Contents packs updated.

Screens:

mspacman-241208-120958 mspacman-241208-120941 centiped-241208-120602 centiped-241208-120548 1943-241208-115626 1943-241208-115545 dkong-241208-115338 dkong-241208-115326 dkong-241208-115311 arkanoid-241208-115018 arkanoid-241208-114948

8 Likes

TUTORIAL UBORDER - Creating Your Own Preset: The Easy Method

With the latest release, it’s a great time to explain how to use some parameters to create your own custom preset featuring the background of your choice.

This tutorial is designed to be simple. We’ll start by using a pre-existing, well-aligned border created by Duimon. It’s already centered, with bezels and with frontal and symmetrical view. Our main task will be adjusting the frame and reflections to match the border. Let’s begin!

Steps

1. Choose Your Border

From the Duimon-Mega-Bezel-Potato pack, I’ve chosen a Neo Geo AES background as an example. Copy this border into the uborder_packs/Spooky TVs/border folder:

te01

te02

2. Duplicate and Rename the Preset

Inside the uborder_packs/Spooky TVs folder, copy the Spooky TVs.slangp preset and rename it appropriately for your new border:

te04 - preset renamed

3. Open the Preset

Open your newly renamed preset. You’ll see several parameters, set to work with the original spooky.jpg border:

4. Update the Border Parameter

Edit the BORDER parameter to point to your new Neo Geo border:

te05 - border image modified

5. Load and Test the Preset

Launch Retroarch, load a test screen (e.g., the 240p test pattern), and apply the preset. You’ll notice that the image and reflections are misaligned:

This is where many people struggle and give up. Let’s fix it!

6. Enable Reflection Adjustment View

Activate the Reflection Adjust View parameter. This will display the reflection bars, making them easier to align:

Here, you’ll see most of the reflection bars are hidden behind the frame.

7. Make Reflections Visible

Adjust the reflection parameters (e.g., width, height, center, and thickness) to make the bars visible. In this case, the bars end up centralized because we’re using a well-designed background from Duimon:

8. Adjust the Frame and Curvature

Next, tweak the FRAME and GEOM'S CURVATURE parameters to fit the frame within the border’s screen. The red-highlighted parameters in the image below are the ones to modify:

9. Align Reflection Bars with the Bezel

Now, adjust the reflection parameters (highlighted in red below) to position the reflection bars next to the frame:

10. Preview the Final Reflections

Disable Reflection Adjust View to see the final reflections. You can increase the reflection strength parameter to make them more prominent. The result should look like this:

11. Save and Update the Preset

Save your progress as a simple preset. Then, copy the updated parameters from the simple preset into your original preset. Be sure NOT to delete the original parameters—just update them with the new values:

12. Finalize Your Preset

Finally, round off any parameters as needed. Retroarch occasionally introduces rounding inconsistencies, so this step ensures a cleaner preset:

Conclusion

That’s it! When you load the original preset, the border and reflections should now align perfectly. This method works best with well-designed borders, such as those by Duimon. For random TV images or misaligned backgrounds, additional tweaks may be necessary.

Enjoy creating your custom presets! If you have questions, feel free to ask. :blush:

4 Likes

Just tried and I couldn’t make it work.

I did the update from online updater and copied over borders_pack-24-12-08 & content_shaders_pack-24-12-08

1 Like

Which game? Which preset? Core?

This is a feature that needs more tests. I made it work with some arcade games on FB Neo only.

1 Like