BNPR : Beer의 Malt 설치 방법 및 간단한 테스트

Beer란?

BEER 또는 Blender Extended Expressive Rendering은 제한이 없는 스타일을 생성 할 수 있도록 특별히 설계된 셰이더 시스템이다. 주 목적은 NPR(None Photo Realistic) 셰이더 스타일을 처리하는 것이지만, PR (Photo Realistic Rendering)은 다른 렌더링 스타일 일 뿐이므로 BEER는 PR 스타일도 생성 할 수 있다.

blendernpr.org/beer/

BEER – New Blender NPR

Blender로 npr 작업을 많이 하는 ruki의 Beer관련 트윗을 이전에 본적이 있었는데 Beer에서 쉐도우를 훨씬 잘 컨트롤 할 수 있은 것 같아보여서 관심을 가지게 되었고 한참 지나서야 간단하게나마 테스트를 해보게 되었다. 일단 쉽게 쓸 수 없을 것 같아서 손이 가지 않았었다.

I got the shadows working perfectly in BEER/Malt with a lot of help from @pragma37 and @Lightbwk (and some settings changes). Seriously exciting to see how good they are looking! High res video in comments. #b3d #blender3d #bnpr pic.twitter.com/c8WL55jaCc

— ruki (@rukikuri) December 12, 2020

Beer 디자인 개요

Beer에 대한 디자인에 대한 개요는 아래 링크의 문서에서 확인 할 수 있다. 2014년도의 글이기때문에 BI(Blender Internal Render)에 대해서 설명하고 있는데 이 부분은 현재와는 조금 다르지 않을까 생각한다. 그리고 2014년도면 꽤 오래전부터 Beer가 개발되기 시작한 것을 알 수 있다.

어쨌든 지금은 사라진 BI(Blender Internal Render)와 Cycles에는 엄격한 알고리즘에 따라서 Combined 패스가 생성이되고 이것은 두 렌더링 엔진에서 가능할 수있는 스타일제작에 제약이 주졌다. 그리고 노드 기반 세이더는 이전에 생선된 모든 데이터 채널과 사용하지 않는 데이터 채널도 전달하기 때문에 대이터 대역폭도 크다.

Beer는 어떤 셰이더를 어떤 순서로 삽입하고 어떤 블렌드 모드가 최종 결과를 생성할지 등으로 다르게 접근한다. 최종 결과는 항상 셰이더 설정이며 숨겨진 구성 요소 또는 알고리즘이 없다. 패스로 레이어가 필요한 경우이를 지정하고 이름을 지정하면 포스트 프로세스에서 자유롭게 사용할 수 있다. 이런 식으로 셰이더 트리는 더 정확한 미리보기로 항상 최소화되고 빠르게 유지된다고 한다.

아래의 이미지는 Cycles에서의 패스 결합 알고리즘과 Beer의 쉐이더 레이어 시스템이다.

아래의 이미지는 Cycles에서의 패스 결합 알고리즘과 Beer의 쉐이더 레이어 시스템입니다.

좀더 자세한 설명은 아래의 링크나 BNPR 유튜브 채널의 영상을 참고한다.

blendernpr.org/beer-design-overview-july-2014/

BEER Design Overview [July 2014] – New Blender NPR

 

Beer 설치

Beer의 설치는 유튜브 BNPR 채널의 Getting Strated with BEER/Malt() 영상을 참고하면 된다.

그리고 이 영상은 blendernpr.org/beer/ 에도 게시되어 있다.

 

 

Beer / Malt 설치방법 요약

Beer를 설치하는데 Malt는 무엇이냐? 라고 생각할 수 있는데 Beer는 아직 개발중이고 Malt는 Beer를 위한 백본 같은 것이라고 한다.

Malt는 Python 및 OpenGL로 작성된 사용자 정의 가능한 렌더링 프레임 워크다. BlenderMalt는 Malt를 Blender에 통합하는 Blender 애드온으로 코드 중심 워크 플로에 적합한 최소한의 사용자 인터페이스를 제공하고 있다.

 

설치 과정을 요약하자면 아래와 같다.

 

1. 먼저 아래의 GitHub 링크에서 사용하는 운영체제에 맞는, 윈도우즈일경우 BlenderMalt-Windowszip과 Shader-  Examples.zip을 다운로드 받는다.

github.com/bnpr/Malt/releases/tag/v1-bet

 

2. 사용하는 Blender의 아래 경로에 config폴더를 하나 만들어 놓는다.

3. Blender Edit >Prefernce에서 위의 1에서 다운받은 BlenderMalt-Windows.zip을 선택하면 아래와 같이 Render: BlenderMalt가 나타나는 것을 볼 수 있다.

 

3. 그러면 이제 Properties 에어리어의 Render Properties에서 Malt를 선택할 수 있다.

4. 그리고 오브젝트를 하나 만들고 Properties 에어리어에서 Material Properties를 선택하면 Shader Source를 등록할 수 있는 UI를 보실 수 있다. 폴더 모양 아이콘을 누르고 1.번에서 다운받은 Shader-Examples를 찾아주면 된다.(당연하겠지만 사전에 압축을 풀어준다.)

 

 

5. 테스트 삼아서 쉐이더 중에서 basic_gradient.mesh.glsl을 선택해준다.

그럼 아래와 같이 이전에 Shader Editor에서 볼 수 있었던 익숙한 ColorRamp노드와 유사한 인터페이스를 Material Properties에서 확인할 수 있다. 그리고 diffuse_gradient와 specular_gradient를 조정하면 아래와 같이 근사한 Cel Shading이 된다.

 

 

6. 위와 같이 했는데 그냥 검게만 나온다면 라이트가 멀리 있어서 그렇다. Light를 선택하고 Object Properties에서 Radius의 범위를 크게 하거나 아니면 라이트를 좀 더 가깝게 이동시킨다.

 

 

Malt에서 GLSL 사용법

그렇다면 Malt에서 GLSL은 어떻게 사용하면 될까? 그냥 Vertex와 Fragment 쉐이더기 때문에 그냥 GLSL하듯이 사용하면 된다. 그리고 영상으로는 BNPR 유튜브 채널에 Malt에서 GLSL을 사용하는 것에 대한 튜토리얼과 malt3d.com의 From Nodes To Code를 참고하면 된다. 특히 From Node To Code가 처음 시작할때 참고하기 더 좋은 것 같다.

 

 

malt3d.com의 From Node To Code

From Node To Code에서는 우리가 익숙하게 사용하고 있는 Shader Editor에서의 Node등을 예로 들어서 설명해서 코드를 모르는 디자이너도 직관적으로 이해할 수 있다.

 

https://malt3d.com/?fbclid=IwAR32gLKP3dpQm6TzMQEeykt6ye8euaOCEPDLnijSs3B306DTeWSX5apzDHo#/docs/From-Nodes-To-Code/From-Nodes-To-Code

위의 문서의 문서에서 중요한 부분은 처음 시작할때 *.blend 파일과 동일한 디렉토리에 VSCode 워크 스페이스가 자동으로 설정된다는 것이다. 별도의 디렉토리를 만들고 blender에서 만든 작업을 한 번 저장 해준다음 이후 그곳에서 VSCode로 *.mesh.glsl 확장자로 쉐이더를 만들어주면 된다.

 

Malt에서 VSCode로 GLSL 작성

VSCode에서 Microsoft C/C++ 익스텐션을 설치면 신텍스 하이라이팅이나 인텔리센스가 잘 되는 듯 하다.

Did you know #malt3d has VSCode integration? #bnpr pic.twitter.com/AVjVIOj06Z

— Miguel Pozo (@pragma37) February 6, 2021

Malt 기본 설정

기본적으로 Malt는 뷰포트에서 고품질 설정으로 실행됩니다. 만약에 오래되거나 저가형 PC일 경우 이를 잘 처리 할 수 없게된다. 이를 해결하기 위해 Properties 에리어 > Scene Properties > Malt Properties에서 몇 가지 설정을 낮출 수 있다.

 

Malt Properties

Malt의 속성에 대한 좀 더 자세한 설명은 아래의 링크를 참고한다.

bnpr.gitbook.io/beer-malt-wiki/tips/speed-up-malt

Speed up Malt

그림자등의 품질이 떨어진다고 생각이 된다면 초기에 이 설정을 했었는지를 확인해보면 된다. 기본으로는 하이 퀄리티로 되어있다. 그런데 퍼포먼스 테스트를 한다고 조절하고 잊어버릴 수 있다.

 

Gradient, Texture, Outline을 적용한 Malt 쉐이더 테스트

다운받은 Shader-Examples를 참고해서 Ambient값, Texture 인풋, Diffuse/Specular gradient 그리고 Outline(Simple)을 모두 포함한 쉐이더를 작성해봄.

glsl 코드는 아래와 같다.

#include "Pipelines/NPR_Pipeline.glsl"

// 앰비언트 컬러, 그냥 적당히 값을 줌
uniform vec3 ambient_color = vec3(0.5,0.5,0.5);

// 텍스쳐링을 위한 UV 채널 정보와 텍스쳐 등을 등록할 수 있는 uniform 변수
uniform int uv_channel;
uniform sampler2D color_texture;

// Shader Editor의 ColorRamp에서 볼 수 있는 gradient Ui를 통해서 값을 받을 수 있는 Uniform 변수
uniform sampler1D diffuse_gradient;
uniform sampler1D specular_gradient;
uniform float roughness = 0.5;

// 아웃 라인에 대한 속성들의 값을 UI로 부터 받을 수 있는 uniform 변수
uniform vec3 line_color = vec3(0.0,0.0,0.0);
uniform float  line_width = 1.0;
uniform float line_depth_threshold = 0.5;
uniform float line_normal_threshold = 1.0; 

// 이부분은 그냥 Fregment 쉐이더임.
void COMMON_PIXEL_SHADER(Surface S, inout PixelOutput PO)
{
	// get_diffuse()는 라이팅을 통한 결과를 받는 내장 함수, 여기에 ambient컬러를 더함.
    vec3 light_color = get_diffuse() + ambient_color;

	// uv채널에 따른 텍스쳐 코디네이트 설정
    vec2 texture_coordinates = S.uv[uv_channel];

	// texture를 적용
    vec4 surface_color = texture(color_texture, texture_coordinates);
    
	// cel 쉐이딩을 위한 그래디언트 컬러 적용
    vec3 gradientColor = get_diffuse_gradient(diffuse_gradient);
    
    // 기존의 그래디언트 컬러에 스펙큘러 그래디언트 적용
    gradientColor += get_specular_gradient(specular_gradient, roughness);

	// 결과는 이 모든것을 곱함
    vec3 result = surface_color.rgb * light_color * gradientColor;

	// 라인은 float값이고 여기에 get_line_simple이라는 내장 함수가 존재함
    // 여기에 uniform으로 선언된 변수들을 할당
    float line = get_line_simple(line_width, line_depth_threshold, line_normal_threshold);
	
    // result를 mix라는 내장 함수를 통해서 위에서 계산된 diffuse값과 아웃라인 값을 적용.
    result = mix(result, line_color, line);

	// 출력 Pixel Out은 vec4라서 아래와 같이 사용.
    PO.color.rgb = result;
}

tstory의 코드블록에서 신텍스 하일라이트에 아쉽게도 glsl은 없다. 임시로 c++로 표시

 

위의 쉐이더를 통해서 Material Properties에서 표출 되는 UI

 

Custom Malt GLSL in Material Properties

위의 쉐이더를 테스트한 영상은 아래와 같다.

 

 

SadowMaps Sun Resolution을 2048로 셋팅했을때와 64로 셋팅 했을때의 쉐도우 퀄리티의 차이를 알 수 있다.

4096으로 설정했을때는 매우 무거워서 fps가 떨어진다.

 

 

Beer / Malt와 EEVEE에서의 그림자와 아웃라인 비교

쉐도우맵은 둘다 2048이다. EEVEE에서의 아웃라인은 Solidify Modifier를 사용한 Inverted Hull 방식으로 작업을 했다. Malt에서는 기본적인 get_line_simpe() 함수를 이용했다. 그럼에도 불구하고 꽤 Inner Lines가 표현되는 것 같다.

테스트를 위해서 모델링은 표현이 비교적 복잡한 모델링인 blendsap사이트의 Barrett M82 와 Baroque table 로 진행했다. 그리고 기본적으로 만화적인 표현이 가능한지 궁금해서 Ramp Shading은 White와 Grey로 진행했다.

EEVEE의 Shader Editor에서의 ColorRamp와 Malt의 SimpleGradient는 모두 램프세이더라고 생각된다. 그리고 Ramp Shading을 활용한 NPR적 표현은 예전부터 많이 사용되는 방식이다. 실시간 에서의 사용은 Unity Shader and Effects Cookbook의 Creating a ramp texture to control diffuse shading 부분을 보면 바로 이해할 수 있다.

Blender에서는 이 부분의 float ramp = tex2D(_RampTex, float2(hLambert)).rgb에서 _RampTex 부분을 포토샵같은 별도의 디자인툴의 도움 없이 ColorRamp를 통해서 만들 수 있고(대부분의 Maya같은 DCC툴이 이 기능을 가지고 있다.)

Malt에서는 uniform sampler1D diffuse_gradient 등으로 선언하면 UI에 Gradient 바가 생기기고 이것을 컨트롤 하면된다. 그리고 Unity Shader and Effects의 Creating a ramp texture to control diffuse shading 부분에서도 언급되어 있지만 The Valve White Paper on Team Fortress 2 Lighting and shading available에 실시간에서의 이런 테크닉에 대해서 자세히 설명이 되어있다.

 

BEER / Malt 와 EEVEE에서의 NPR 비교 

 

결론

Beer / Malt에서 쉐이딩은 glsl로 해야한다. Blender로 glsl 연습할수 있는 좋은 도구이다.(2.7x 버전에서는 Python 으로 GLSL을 래핑해서 썼어야 했다. 이후 마땅한 것을 찾을 수 없었다.)

미리 만들어져있는 몇가지 편리한 함수들이 있다.(소스 코드를 살펴봐서 어떤 것이 있는지 찾아보면 재미있을듯)

쉐도우가 깔끔하다.(하지막 역시 소프트쉐도우를 위해서 샘플링하는 부분이 있고 그에따른 지연이 있다.)

아웃라인도 깔끔하게 떨어진다. 굳이 EEVEE에서처럼 Solidifier를 이용해서 Inverted Hull을 만들 필요가 없다.

하지만 아직 불안정하고 가끔씩 Blender가 셧다운 되거나 UI가 깨지거나 하는일이 발생한다.

그리고 최근에서야 Malt의 공식적인 개발이 종료가 되었다.

어서 더 개발이되어서 포스트 프로세싱 부분도 추가가 되었으면 하는 바람이다.