Shader

shader-dev는 ShaderToy 스타일의 실시간 비주얼을 위한 실용적인 GLSL 셰이더 스킬입니다. 이 shader-dev 스킬을 사용하면 레이 마칭, SDF 장면, 조명, 파티클, 유체 모션, 후처리, UI 디자인용 shader-dev까지 일반적인 프롬프트보다 훨씬 적은 시행착오로 만들거나 디버깅할 수 있습니다.

threejs-shaders는 GLSL, ShaderMaterial, uniforms, 정점 변형, 프래그먼트 효과를 사용해 Three.js 셰이더를 작성하는 실용 가이드입니다. 작동하는 셰이더 기준점이 필요하거나, 머티리얼 선택을 더 분명히 하고 싶거나, 일반적인 프롬프트보다 덜 헤매고 싶을 때 프런트엔드 개발에 활용하세요.

threejs-materials는 메시 재질을 선택, 설정, 문제 해결하는 데 쓰는 Three.js 재질 스킬입니다. 사실적인 PBR, 조명 없는 플랫 셰이딩, 툰 스타일과 디버그 뷰, 텍스처 기반 스타일링, 커스텀 셰이더에 활용할 수 있습니다. 더 빠르고 일관된 재질 결정을 필요로 하는 프런트엔드 개발팀에 특히 유용합니다.

Frontend Development용 threejs-postprocessing 스킬: EffectComposer 파이프라인, bloom, depth of field, blur, color grading, 그리고 커스텀 screen-space pass를 추가할 수 있습니다. 이 가이드를 사용해 렌더 체인을 설정하고, 효과를 조정하며, 기존 Three.js 씬에 composer 렌더링을 연결하세요.

threejs-lighting은 Frontend 개발을 위한 실용적인 Three.js 조명 스킬입니다. 어떤 조명 유형을 선택할지, 그림자를 어떻게 설정할지, 환경 조명을 어떻게 더할지, 그리고 장면이 너무 평면적으로 보이거나, 지나치게 어둡거나, 과노출될 때 어떻게 바로잡을지 도와줍니다. 더 빠르고 일관된 장면 조명이 필요할 때 threejs-lighting 가이드를 활용하세요.

makepad-2.0-shaders는 Makepad 2.0 셰이더 코드를 작성하고 디버깅하기 위한 Frontend Development 스킬입니다. pixel: fn() 및 vertex: fn() 블록, Sdf2d 도형, 커스텀 위젯 드로잉, premultiplied alpha, 그리고 실용적인 설치·사용 가이드를 다룰 때 이 makepad-2.0-shaders 스킬을 사용하세요.