웹에서 파티클을 쉽게 적용할 수 있는 툴이 있어서 소개하려고 한다. Three NebulaA WebGL based 3D particle system engine for ThreeJsthree-nebula.org  GitHub - creativelifeform/three-nebula: WebGL based particle system engine for three.jsWebGL based particle system engine for three.js. Contribute to creativelifeform/three-nebula development by creating an account on GitHub.github.com  MIT License라 자유롭게 사용 가능하고 코드를 몰라도 직관적인 UI로..

Three.js 기반에 사용될 glb포맷 모델링과 이펙트 만들어야 하는 입장에서, Blender와 NodeToy는 아주 중요한 역할을 하고 있다.  웬만한 이펙트 작업은 Blender에서 Govie Tool을 이용한 파티클 애니메이션으로 이루어지지만 블렌더에서 glb 포맷으로 지원되지 않는 제한 사항이 많이 있다.  블렌더에서 glb로 넘어가지 않는 효과는 Fresnel 효과가 있다.프레넬 효과는 여러모로 가끔씩 쓰이는데 View Direction에 따라 다른 효과를 낼 수 있다. 이전 글에서는 유니티에서 만든적이 있다. [Unity] URP 셰이더 프레넬 셰이더(Fresnel Shader)프레넬(Fresnel) 효과는 게임에서 배경과 캐릭터의 분리나 강조를 위해 또는 선택되었을 때 프레넬 효과를 과장하..

유니티의 WebGL과 Three.js는 둘 다 웹을 타겟으로 하는 그래픽 툴이다.Three.js특징 및 장점- JavaScript 라이브러리, GLSL을 사용한다.- 웹 브라우저에서 3D 애니메이션을 빌드하는 데에 좋다.- MIT 라이센스로 오픈 소스이다.- WebXR을 지원한다.- 복잡한 애니메이션을 쉽게 만든다.- 브라우저 Plugin이 필요 없다.- 다양한 브라우저를 지원한다.- git을 통한 수 많은 사람들이 개발에 참여한다.-JavaScript로 작성된 라이브러리는 플러그인 필요 없이 WebGL과 원활하게 작동한다. 단점- 효과적인 사용을 위해서 JavaScript와 3D 수학에 대한 이해가 필요하다.    Unity WebGL 빌드와 비교Unity WebGL- HTML5, JavaScript,..

NodeToy는 threejs 웹 또는 React 웹에 쓰이는 웹용 셰이더 툴이다.  NodeToy | Create and share shader graphs with the worldFamiliar with GLSL / HLSL or tools such as ShaderToy? Whether you're a seasoned coder or just getting started, the Custom Expression Node has everything you need to bring your most ambitious ideas to life. With its powerful shader code editor, it is the penodetoy.co NodeToy에 가입하고 새로운 프로젝트를 만들면,..