Skills / Community / postmo-shader
๐ŸŒ Community Awaiting Review

postmo-shader

Write a shader for Postmo, the browser editor for looping motion posters, and check it compiles, loops and looks right before handing it over. Use when asked for a Postmo shader, a looping GLSL background or effect for Postmo, or to fix one.

# Writing a Postmo shader Postmo takes the body of a GLSL ES 3.00 fragment shader. Params and colours declared in comments become sliders and swatches in its inspector. The user pastes the code into Postmo, or drops the .glsl file onto its canvas. ## Workflow 1. List what the picture is made of and pick at most 10 params that change it most (the rest are constants). Name colours by their role. 2. Write the shader (rules below, functions in reference.md, examples in examples/). 3. Check it from this folder: `node bin/check.mjs my-shader.glsl` (once: `npm install`). It compiles the code

workflow rest

When to use

Community skill by ningzh-design. Source: https://github.com/ningzh-design/postmo-shader

Examples

Workflow

1. List what the picture is made of and pick at most 10 params that change it most

Rules

- Write the body of a GLSL ES 3.00 fragment shader: no #version, no precision, no main() inputs of your own.

What Postmo gives your code

Uniforms: vec2 uRes (layer px) ยท float uPhase (0โ€“1 per loop) ยท float uTime (s) ยท float uDuration (s) ยท

Added to wishlist