Skip to main content

UV Manipulation ✂️

Think of the UV like the coordinates of each pixel on the screen. So, when we manipulate the UV, we are changing the shape and position of the screen (for instance, by shaking it).

Bender​

This warps the screen inwards by forming curves at both edges of the screen (left or right, or top and bottom).

  • Style: Choose whether to bend the screen horizontally or vertically.
  • Power: How much the screen should bend inwards.

Movement​

Simple controls to move the screen around. Kind of like a shake, but you gotta do the work (lol).

  • Movement X: Negative values move the screen left, while positive values move it right.
  • Movement Y: Negative values move the screen up, while positive values move it down.

Clamp​

Stops the screen at a certain point. Normally this is (0, 0) to (1, 1), but lowering it makes the "screen-tearing" effect start sooner.

  • Right: The right edge of the screen.
  • Left: The left edge of the screen.
  • Top: The top edge of the screen.
  • Bottom: The bottom edge of the screen.

Coordinates​

2D planes are called Cartesian coordinates. This effect allows you to "translate" those coordinates to what they would be in different spaces.

  • Cartesian -> Polar: Converts the screen's coordinates to polar coordinates.
  • Polar -> Cartesian: Converts the screen's coordinates to cartesian coordinates.
  • Cartesian -> Cylindrical: Converts the screen's coordinates to cylindrical coordinates.
  • Cylindrical -> Cartesian: Converts the screen's coordinates to cartesian coordinates.
  • Cartesian -> Toroidal: Converts the screen's coordinates to toroidal coordinates.
  • Z: The Z coordinate of the screen (since, when converting, there is only an X and Y coordinate passed).

Dither​

Spread the screen pixels out in a grid pattern. A sort of quick-and-dirty noise or blur.

  • Style: The size of the grid. Smaller grids will be more noticable, generally, with lower strengths.
  • X: How much the grid should be offset in the X direction.
  • Y: How much the grid should be offset in the Y direction.

Kaleidoscope​

Repeats a portion of the screen in a circular pattern - like sticking your eye into one of those kaleidoscope toys.

  • Segments: How many segments the screen should be divided into.
  • Angle: What point the screen should be rotated around.

Mirror​

Reflect part of the screen back onto the other side.

  • Top: Control if, and where, the divide for the top screen and it's reflection (on the bottom) should be.
  • Bottom: Control if, and where, the divide for the bottom screen and it's reflection (on the top) should be.
  • Left: Control if, and where, the divide for the left screen and it's reflection (on the right) should be.
  • Right: Control if, and where, the divide for the right screen and it's reflection (on the left) should be.

Scroll​

Automatically move the screen in a certain direction, repeating itself.

  • X: How fast it should scroll in the X direction. Set to 0 to disable.
  • Y: How fast it should scroll in the Y direction. Set to 0 to disable.

Shake (And Earthquake)​

tip

When animating strengths (or most effects in general), you do not animate the speed - instead, animate the power. This is because the speed is combined with the current time provided by Unity, which will jump up/down with new inputs and not scale linearly.

Shake, well, shakes the screen. But there are different ways to accomplish this! Earthquake adds blurred copies of the screen shaking as well (and is optional).

  • Style: How the screen should shake.
    • Bumpy: The screen shakes with random noise added to it, making it less repetitive (but still somewhat smooth).
    • Smooth: The screen shakes in a smooth, predictable way.
    • Rough: The screen is not smooth at all, and is very jittery.
    • Circular: The screen shakes in a circular pattern, like rotating around the centre. Best used with a high speed and low power.
    • Laggy: The screen shakes in a laggy way, like a bad connection. It's a bit like Rough but the shake is paused based on the speed.
  • Power X, Power Y: How much the screen should shake in the X and Y directions respectively.
  • Speed X, Speed Y: How fast the screen should shake in the X and Y directions respectively.
  • Earthquake: If enabled, the blurred copies of the screen will shake rather than the screen itself.
    • Earthquake Power: How much the blurred copies of the screen should overlay the original screen.

Slicer​

Split the screen into four pieces and control the size and offset of each.

  • X Division: Where the horizontal split should occur.
  • Y Division: Where the vertical split should occur.
  • X One: The offset of the first horizontal slice.
  • Y One: The offset of the first vertical slice.
  • X Two: The offset of the second horizontal slice.
  • Y Two: The offset of the second vertical slice.

Melt​

Melts the screen, kind of like a glitch or if you were to use liquify in Photoshop.

  • Style: Control what factors are used to determine how melted each portion of the screen is.
    • Luminance: The brightness of each pixel. This is the most "bendy" or most natural looking.
    • Random Luminance: The brightness of each pixel with a random offset added.
    • Random: A random value for each pixel.
  • Scale: How many rows the melt should be split into.
  • Power Low, Power High: Mapping what a minimum value pixel (determined by style, for example, in the case of Luminance a minimum value pixel would be completely black) offsets the screen to, and what a maximum value pixel offsets the screen to. Think of it like "the screen must be pushed this much, but can go up to that much."
  • Seed: The seed of the random values for Random Luminance and Random.

Mirror Shatter​

Break the screen into small, polygon fragments and offset each one individually. Like a shattered mirror!

  • Style: The shape of the mirror's fragments.
    • Fragments: A bunch of tiny pieces spread out across the screen with no centre or direction.
    • Middle: Shards stemming from the centre of the screen in a radial pattern.
  • Power X: How much the screen should be offset horizontally in each fragment.
  • Power Y: How much the screen should be offset vertically in each fragment.
  • Scale: How many fragments the screen should be split into.

Ring Rotation​

Forms repeating rings originating from the centre of the screen that control the rotation of the screen.

  • Style: How the rings control the rotation of the screen.
    • Random: Each of the rings have a random rotation offset.
    • Inner to Outer: The inner rings rotate less than the outer rings.
    • Outer to Inner: The outer rings rotate less than the inner rings.

Refraction​

Moves the screen based on the colours of the screen.

  • Style: How the colours of the screen control the movement of the screen.
    • Axis: Offset the screen on the X and Y axis.
    • Rotation: Rotate the screen based on the colours of the screen.
  • Power X, Power Y: How much the screen should be offset in the X and Y directions respectively.
  • Speed: How fast the screen should be offset. Only applicable to Rotation.
  • Angle: The angle of the offset. Only applicable to Rotation.

Pixelation​

Make the screen blocky and low-resolution with various styles.

  • Style: Controls what shape the pixelation should be.
    • Square: A classic pixelation effect.
    • Triangle: A triangular pixelation effect.
    • Bezel: Four triangles that form a square.
    • Hexagon: A hexagonal pixelation effect.
    • Polar: Using polar coordinates to determine the pixelation.
  • Power X, Power Y: How much the screen should be pixelated in the X and Y directions respectively. A lower value (which is further right on the slider) means a higher pixelation.

Pixel Shifter​

Shift rows of the screen in different directions based on various inputs.

  • Style: How the rows of the screen should be shifted.
    • Modelo: Shift based on alternating rows.
    • Random: Shift based on random values.
    • Colour: Shift based on the colours of the screen.
    • Luminance: Shift based on the brightness of the screen.
  • Power X, Power Y: How much the screen should be shifted in the X and Y directions respectively.
  • Size X, Size Y: How many rows the screen should be split into.
  • Angle: The angle of the shift.
  • Seed: The seed of the random values for Random.

Scanline​

Produces moving distorted lines across the screen, like an old TV.

  • Power: How much the screen should be distorted on the scanline(s).
  • Style: How the scanline(s) should be distorted.
    • Warp: Pushes the screen on a curve, so that the distortion "blends" into the screen.
    • Block: Pushes the entire area of the scanline(s) at a constant value.
  • Direction: The direction of the scanline(s).
    • Horizontal: The scanline(s) move horizontally.
    • Vertical: The scanline(s) move vertically.
  • Amount: How many scanlines should be produced (One, Two, Three, or Four).
  • Speed: How fast the scanline(s) should move.
  • Size: How big the scanline(s) should be.
  • Position: The position of the scanline(s) (for manual movement).
  • Angle: The angle of the scanline(s) in case Horizontal and Vertical are not enough.

Shuffle​

This effect is similar to Pixel Shifter, but instead of shifting rows, it shuffles the whole screen in multiple directions.

  • Style: How the screen should be shuffled.

Skew​

Like a 2D Rotation but on a customisable axis. This is similar to skew in Photoshop.

  • Power: How much the screen should be skewed.
  • Axis: The origin of where the skew takes place.

Spherize​

Turn the screen into a sphere.

  • Power: How much the screen should be warped into a sphere. Positive values will warp the screen outwards, while negative values will warp the screen inwards.

Transformation​

These are basic transformations of the screen. Sort of like Movement but with more control.

  • Slant Top Left: The slant of the top left corner of the screen.
  • Slant Top Right: The slant of the top right corner of the screen.
  • Slant Bottom Left: The slant of the bottom left corner of the screen.
  • Slant Bottom Right: The slant of the bottom right corner of the screen.
  • Flip X: Flip the screen on the X axis.
  • Flip Y: Flip the screen on the Y axis.
  • Stretch X: Stretch the screen on the X axis.
  • Stretch Y: Stretch the screen on the Y axis.

Twisted Corridor​

Repeats the screen in a spiral pattern - kind of like a trippy tunnel.

  • Power: How much the screen should be twisted.
  • Corridors: How much the screen should be repeated.

Recursion​

Repeat the screen in different, controllable patterns.

  • Style: The pattern which the screen should be repeated.
    • Escher: The screen is repeated in a way that looks like the famous artist Escher's work.
    • Tri-Split Horizontal: Repeat the screen three times with horizontal slices (so, technically, vertical splits. It's easier to see in practice!).
    • Tri-Split Vertical: Similar to Tri-Split Horizontal, but with vertical repititions (which would be horizontal splits - again, just play with it).
    • Left Bottom Regression: Repeat the screen infinitely towards the bottom left.
    • Infinite Zoom: Repeat the screen infinitely and evenly.
    • Tunnel: Warps the screen around in a cone tunnel-like shape.
    • Centre Regression: Repeat the screen infinitely towards the centre.
    • Ravine: Repeat the screen infinitely towards the centre, but start repeating indepdently from each corner of the screen.
    • Pyramid: Repeat the screen infinitely outwards from the centre.
  • Power: How much the repeated screens should blend in with the original screen.
  • Scale: How many repeated screens there should be.
  • Inverse X, Inverse Y: Inverse directions of the repetition. Used for the Tunnel style.
Recursion Example (Tri-Split Horizontal)

Tri-Split Horizontal Recursion

TwoD Rotation​

Rotate the screen in 2D space.

  • Power: How much the screen should be rotated.
  • Speed: If you want to automatically rotate the screen back and forth, set this value to anything other than 0.

ThreeD Rotation​

Make the rotation look better!

I suggest setting Rendering 🛸 -> Off-Screen Pixels to Colour, that way, anything that is not the screen won't be stretched or repeated but will instead be a sort-of "void" of just a colour.

  • Power X, Power Y, and Power Z: Power X and Power Y function the same as they would in a 2D plane. However, Power Z treats the 2D plane as a 3D plane, so it will let you "flip" the screen forward/backwards.
  • Zoom: How much the screen should be zoomed in/out.
  • Shift X, Shift Y: Adjust the plane in 3D space left/right and up/down.

ThreeD Pan​

Similar to ThreeD Rotation, but it pans the screen around the user's camera in a 3D space.

  • Flip Correction: Try and adjust the screen when it's rotated around (ex. if you flip it, always keep it facing the right way).
  • Y, Z: Y lets you pan the camera horizontally, while Z lets you pan the camera vertically.
  • Zoom: How much the screen should be zoomed in/out.

OnlyScreens​

Similar to Recursion but in more structured patterns and with smoother transitions.

  • Style: How the screen should be repeated.
    • Quadrant: Four screens in each corner of the screen.
    • Checkers: Two screens offset vertically slightly.
    • Chess: Two screens, one in the top left, and one in the bottom right.
    • Dual Horizontal Spread: Two screens side-by-side.
    • Dual Vertical Spread: Two screens beside each other that move in opposite directions vertically.
    • Stack Horizontal Spread: Splits the screen into two halves and moves them in opposite directions.
    • Stack Vertical Spread: Splits the screen into two halves and moves them in opposite directions.
  • Power: How much the repeated screens should blend in with the original screen.
  • Scale: How big/small the repeated screens should be.
  • Spacing: How far apart the repeated screens should be.

Spinterception​

Overlay another copy of the screen on top of the original screen and control the rotation of both.

  • Top Zoom: How large the overlayed screen should be.
  • Bottom Zoom: How large the screen underneath the overlayed screen should be.
  • Top Angle: The rotation of the overlayed screen.
  • Bottom Angle: The rotation of the screen underneath.

Quadrant Zoom​

Zoom each quadrant of the screen (top left, top right, bottom left, bottom right) independently from each other.

  • Top Left Zoom: How much the top left quadrant should be zoomed in/out.
  • Top Right Zoom: How much the top right quadrant should be zoomed in/out.
  • Bottom Left Zoom: How much the bottom left quadrant should be zoomed in/out.
  • Bottom Right Zoom: How much the bottom right quadrant should be zoomed in/out.

Swivel​

Swivel is a unique effect that transitions the screen from one place to another - sort of like the screen "swivels" in positions. While it is easiest just to see it in action, you can imagine it like the screen is zooming out, rotating on a hinge, and then zooming back in, all while moving in the desired direction. Very iMovie/Windows Movie Maker-esque effect.. whether that is good or bad is up to you!

  • Style: Choose where the screen swivels to.
    • Top Right: Swivel to the top right corner of the screen.
    • Top Left: Swivel to the top left corner of the screen.
    • Bottom Right: Swivel to the bottom right corner of the screen.
    • Bottom Left: Swivel to the bottom left corner of the screen.
  • Swivel: How far along in the animation from the starting position (initial screen) to the destination (essentially, the original screen again, but after going through the swivel) the effect is. 0 and 2 both will look like a "normal" screen while anything inbetween will be part of the swivel effect's animation timeline.
  • X Hinge, Y Hinge: Where on the screen the screen should "hinge" at in the animation, kind of like the halfway point between the original and destination position.
  • Speed: If you want the screen to automatically hinge in a loop, you can turn up the speed! Leave this to 0 if you are manually animating it.

Distaer​

Tear the screen apart vertically or horizontally. It's sort of like a simple version of a pixel-sorting algorithm or data moshing.

  • Style: Vertical or Horizontal - decides which way the screen should tear.
  • Power: How far the screen should tear.
  • Amount: How much of the screen should tear.
Preview Video

Thanos​

Make the screen fly away into pieces like if that one character from that one movie did the one thing!

  • Thanos Mode: Determine what the screen disintegrates into - like what is left after the screen disintegrates.
    • Colour: The screen will become a single colour (ex. black) as it disintegrates.
    • Overlay: The screen will use the image provided in the Overlay module as it disintegrates.
  • Curve Control: How the slider for disintegrating the screen should scale.
    • Linear: It moves evenly throughout the power slider.
    • Exponential: The disintegrate effect uses a curve for the power slider.
  • Disintegrate: The power slider - how much the screen should be disintegrated. If you want to animate the effect, this is what you want to animate.
  • Curve Peak: As the name implies, it's the peak value that the curve has. Helps control how the curve looks in terms of animation. While it's best to play around with it to meet your needs, the simplest way to think of it is Lower Value = Faster Disintegration and Higher Value = Longer Disintegration.
  • Fragments: How many pieces the screen breaks into. I suggest a pretty high number, like >= 200, to make it look like noise rather than individual pieces of glasses - but I figured someone else may want the latter.
  • Uniformity: How much the disintegrate effects the screen throughout the animation. A lower value will start warping and start making the screen instantly disintegrated at early processes in the animation, while a higher value will wait for it to fly away more before warping the screen. Again - play around with it. I am so sorry for how bad I am at explaining, lol.