본문으로 건너뛰기
cccskills
무료GitHub에 공개

shader-isf-ffgl

Shader formats for VJ and live-visual hosts - ISF (GLSL plus JSON metadata, which Resolume reads directly) and FFGL (FreeFrameGL, a C++ plugin ABI). What each one is, what the port renames, and exactly what this row can and cannot produce.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

설치 방법 보기

포함된 파일(1)

  • SKILL.md6.3 KB

SKILL.md(원문)

설치하기 전에 에이전트에게 전달되는 지시 내용을 확인할 수 있습니다.

ISF and FFGL

Two formats, two very different things. Getting them mixed up wastes a day.

ISFFFGL
what it isa shader file format: GLSL + a JSON blocka C++ plugin ABI: a compiled .dll/.so/.bundle
what you writeone .fs file (or an .fs with the JSON prepended)C++ against the FFGL SDK
what the host loadsthe shaderthe binary
can this row make oneyes, completea scaffold only - never a build

ISF: the shader format

ISF is "GLSL with inputs declared". The host parses a JSON block, builds the controls, and calls main() with uniforms set. Two shapes exist: the JSON as a leading comment block in the same file, or a separate .json. This row emits both (target=isf gives <name>.fs and <name>.json).

The uniforms ISF itself provides:

nametypemeaning
RENDERSIZEvec2render target size in pixels
TIMEfloatseconds
TIMEDELTAfloatseconds since the last frame
FRAMEINDEXintframe counter
PASSINDEXintindex of this pass
inputImagesampler2Dthe incoming image
isf_FragNormCoordvec2normalised coordinate, 0..1

And the entry point is void main() writing gl_FragColor - not mainImage. That is the whole port from a Shadertoy-style source:

/* ISF 2 shader */
#version 100
precision highp float;
uniform vec2 RENDERSIZE;
uniform float TIME;
uniform sampler2D inputImage;

void mainImage(out vec4 fragColor, in vec2 fragCoord) {
  vec2 uv = fragCoord / RENDERSIZE;
  fragColor = vec4(uv.x, uv.y, 0.5 + 0.5 * sin(TIME), 1.0);
}

void main() {
  vec4 color = vec4(0.0, 0.0, 0.0, 1.0);
  mainImage(color, gl_FragCoord.xy);
  gl_FragColor = color;
}

Notice what did not change: the maths, the functions, the precision statement. A port is a rename of the entry point and the uniforms, and it is worth doing by hand the first time so you know what the tool did.

The JSON metadata, smallest useful form:

{
  "DESCRIPTION": "Colour ramp with a pulse",
  "ISFVSN": "2",
  "INPUTS": [
    { "NAME": "inputImage", "TYPE": "image" },
    { "NAME": "speed", "TYPE": "float", "MIN": 0.0, "MAX": 4.0, "DEFAULT": 1.0, "LABEL": "Speed" }
  ]
}

TYPE is float, bool, long, color, point2D, image, audio or event. MIN/MAX/DEFAULT become the control's range; LABEL is what a person sees. A float input becomes a uniform float speed; in the shader - the NAME and the uniform name are the same, which is why ISF names are conventionally lower case and have no u_ prefix.

Hosts read inputImage as the input pass and composite the output. If your shader ignores inputImage it is a generator rather than an effect: declare it anyway and say so in the description, or omit it and accept that some hosts will not offer it as an effect.

What shader_target target=isf does to your source

  • renames iResolution -> RENDERSIZE, iTime -> TIME, iTimeDelta -> TIMEDELTA, iFrame -> FRAMEINDEX, iMouse -> MOUSE
  • adds void main() that calls mainImage and writes gl_FragColor
  • declares the uniforms ISF provides, plus one per @param
  • emits MOUSE only when the source used iMouse - and it is not an ISF standard input, so the note says to drop it or keep it in your JSON
  • writes the .json with one INPUT per @param

MOUSE is the honest weak spot: ISF has no standard pointer input. Some hosts expose one as point2D; if yours does not, delete the uniform and the code that reads it rather than shipping a shader that samples an unset uniform.

FFGL: the plugin ABI

FFGL (FreeFrameGL) is a C++ plugin interface: the host loads a shared library and calls methods on a CFFGLPlugin. The shader is embedded in the C++ as a string, compiled at InitGL, and drawn in ProcessOpenGL. There is no shader file to hand anyone.

So shader_target target=ffgl emits a scaffold: the GLSL verbatim as a raw string literal, one comment line per uniform, the entry points declared as TODOs, and a checklist in the header. It is not buildable, and it says so in its first line, because:

  • the FFGL SDK is not vendored here (it is C++, and this package ships no C++);
  • FFGL 1.x and 2.x have different method signatures, so any signature written for you would be wrong for somebody;
  • compiling a plugin needs that machine's compiler, SDK and OpenGL headers - none of which a harness plugin can assume.

What the scaffold gives you is the part that is hard: the shader, its uniform map, and the order of operations.

Choosing

  • Resolume, VDMX, or any host that reads shader files -> ISF. It is one file, no compiler, and it can be edited live in the host.
  • A plugin that ships inside someone's app, or needs C++ side effects (audio input, MIDI, multiple passes it controls itself) -> FFGL, and budget for the SDK.
  • A website or an installation you control -> neither: emit target=web and run it in a browser you already have.

Checklist before handing a shader to a host

  1. It compiles as es100. ISF and most FFGL hosts are ES 1.00-era: any #version 300 es construct has to be rewritten (out -> gl_FragColor, in/out varyings -> varying, texture() -> texture2D()).
  2. precision highp float; is there.
  3. Every input is declared in the JSON with a range that makes sense, and the shader's uniform name matches the JSON NAME exactly.
  4. No iChannel0-style Shadertoy leftovers: an ISF host supplies inputImage, and an FFGL host supplies nothing unless you bind it.
  5. It runs at the host's resolution. Test at 1920x1080 at least; a VJ host at 4K will find every step you did not count.
  6. It runs on that machine's GPU. This row compiles with ANGLE/SwiftShader, which is a real GLSL compiler but not the user's driver: a margin-of-error shader can pass here and fail in the host.

리뷰

아직 리뷰가 없습니다. 사용해 본 소감을 남겨 주세요.

댓글

로그인 없이 쓸 수 있습니다. 사용 후기, 질문, 작동하지 않은 환경 등을 편하게 남겨 주세요.

아직 댓글이 없습니다. 첫 댓글을 남겨 보세요.

보내면 바로 공개됩니다. 이메일 주소나 전화번호 같은 개인 정보는 쓰지 마세요. URL은 2개까지입니다.

0 / 1,000자

이 양식은 reCAPTCHA로 보호되며 Google 개인정보처리방침 및 서비스 약관이 적용됩니다.

같은 저장소의 스킬

Author an editorial HTML+SVG diagram with the Diagram Design kit - choose the visual type, read its reference, start from an example, and satisfy the safety and accessibility contract that diagram_write({kind:"html"}) enforces.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

vecnode/vn-code102026년 10월 20일 업데이트

Control this machine's Docker or Podman engine through the docker_* tools - read the engine's state first, list containers and images, inspect one, tail its logs, pull an image and start it, then stop, restart or remove what you started. Covers the engine that is asleep behind Docker Desktop and the exact call for each verb, the confirm rule removals obey, and the flags the tools deliberately do not have.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

vecnode/vn-code102026년 10월 20일 업데이트

Drive ffmpeg through the media_run tool as an argv array - remux instead of re-encode, map streams explicitly, trim at keyframes, scale and crop, extract audio and frames, and build GIFs, contact sheets and concatenations. Covers the flags this pack injects, reading a failure from its exit code and last log lines, and the version-dependent spellings to hedge.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

vecnode/vn-code102026년 10월 20일 업데이트

Read a media file's real structure with ffprobe through media_run - the JSON invocation and how to read it, what every family of field means, how to count frames, sample without decoding everything, detect HDR and interlacing, and diagnose a missing duration, a stream with no frames or a container that lies. Covers when media_probe's own report is already enough.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

vecnode/vn-code102026년 10월 20일 업데이트

Writing a fragment shader that looks like something - the full-screen triangle, uv space, signed distance fields, noise and fbm, domain warping, raymarching budgets, tone mapping and banding. Every example compiles. Read this when the task is "make it look good", not "make it compile".

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

vecnode/vn-code102026년 10월 20일 업데이트

Use when the user wants to design, redesign, shape, critique, audit, polish, simplify, harden, animate, or otherwise improve a frontend interface: websites, landing pages, dashboards, product UI, components, forms, settings, onboarding, empty states, and native iOS or Android screens. Handles UX review, hierarchy, layout, typography, color, motion, UX copy, accessibility, responsive behavior, edge cases, and capturing or documenting design systems (DESIGN.md, tokens). Also for making bland UI bolder, loud UI quieter, or ambitious visual effects. Not for backend-only or non-UI tasks.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

vecnode/vn-code102026년 10월 20일 업데이트

vecnode의 스킬 모두 보기

이 스킬의 문제 신고