"Remaking LOOP HERO's CRT Effect" is a video published by Acerola that explains the process of recreating the CRT shader effect found in the game Loop Hero. The video breaks down the individual components of the effect and demonstrates how to achieve them using UV coordinates, warping, vignetting, and sine and cosine wave manipulation.
The first step in the analysis is identifying the main components of the effect. The CRT shader effect in Loop Hero consists of spherically warped corners, accentuated rows of pixels, and straight CRT lines. The effect is achieved using a post-processing technique that manipulates the UV coordinates of the final render of the game.
To create the warped corners, the video demonstrates how to use a cubic function that takes in linear UV coordinates and outputs spherically warped UV coordinates. This is achieved by converting the UV coordinate range to -1 to 1, creating an offset value to control warping, and then converting the range back to 0 to 1 for proper texture sampling. A curvature value of 10 is used to match the warping in Loop Hero.
Next, the video explains how to create a vignette effect to obscure the hard edge cutoffs caused by the warping. This is done by centering the warped UV coordinates, inverting their values, and using a smooth step function to create a gradient around the border of the screen. The vignette width is set to 30 to closely resemble the original effect in Loop Hero.
The CRT line visuals are achieved by multiplying the vertical UV coordinate by the screen height, feeding it into a sine wave, and multiplying the final color by the resulting value. The video reveals that the pattern repeats every three lines, with the brightness oscillating, indicating the use of a sine wave. To match the original effect, the sine wave frequency is doubled.
The video then delves into the color corrections, identifying the use of cosine waves in addition to sine waves. The cosine wave operates on the red and blue channels, while the sine wave operates on the green channel. The sine wave has a higher amplitude than the cosine wave. The color channels are multiplied by their respective trig values to achieve the desired effect.
In conclusion, the video provides a detailed breakdown of the process of recreating the CRT shader effect from Loop Hero. The recreation is compared side by side with the original effect, showing minor differences. The recreated effect is applied to a game jam project, demonstrating its aesthetic improvement. The video showcases the enjoyment of reverse engineering effects and encourages viewers to share their thoughts on this case study style content.
