새해엔 3D와 WEB 융합형 인재가 필요한 시기

3D와 Web 개발 트렌드

나는 2022년 상반기 국내 스타트업에서 프로덕트 오너로서 국내 최초 WebXR 저작도구를 런칭한 경험이 있다. 최근엔 조금 더 나은 기술을 가지고 있고 조금 더 규모가 있는 회사로 이직해 또 다른 WebXR 저작도구를 런칭시키기 위한 팀에 합류해 일하고 있다. WebXR 저작도구의 3D 저작환경을 잘 구성하기 위해 3D 제작자와 웹 개발자, UX/UI 디자이너가 서로 잘 소통할 수 있게끔 커뮤니케이션 하는 역할을 주로 나서서 맡고 있다.

2022년 6월 이전 회사 WebXR 저작도구 개발 팀장 및 P.O 시절 신제품 발표회에서 AR 트렌드 소개 및 제품 소개를 진행했다.

1년 넘게 연구했던 WebXR 저작도구 개발에 대한 노트들

요새 Web에서 3D를 개발해야 하는 상황이 많다. 내가 속한 XR 분야뿐 아니라 일반적인 커머스 플랫폼을 포함해 전반적인 상황이라 생각된다. 고객들이 설치형 앱보다 접근성이 높고 대중적인 모바일 웹 브라우저에서 펼쳐지는 3D에 점점 더 관심을 쏟고 있기 때문이다.

이런 웹 프로젝트에서는 거의 대부분 Three.js 라거나 Babylon.js 라거나 A-frame 등의 라이브러리를 개발에 사용하면 된다. 라이브러리가 있으니

쉽게 만들어낼 것 같지만 3D라는 특수성 때문에 웹과 3D가 만나는 프로젝트가 제대로 굴러가기는 쉽지 않다.

거의 대부분의 개발자들은 개발은 알아도 3d에 대해선 전혀 모르고 있는 것이 일단 문제이다. 3D 경험이 없는 대부분의 웹 개발자는 3d 제작자가 전달한 3d Asset을 어떻게 변환해야 하는지, 변환한 json데이터에서 무슨 정보를 가져와서 어떻게 조작해야 할지 감을 잡지를 못한다. 일부는 Documentation 보면 된다고 쉽게 생각하는 경향이 있는데 Documentation을 따라 할 수는 있어도 Camera, Scene, Render, PBR워크플로우, Light 세팅등 3d씬 구성에 대한 기초 개념이 없으면 3d모델을 어두운 화면에 불러오는데 그칠 뿐이고 제대로 된 실시간 렌더를 제공할 수 없다.

실제로 이전 회사에서 PO로 일 할 때 개발단에서 계속 반사나 그림자 표현을 못하고 모델이 이상하다고 하길래 내가 확인해보니 백엔드에서 glTF파일을 로드하면서 매터리얼 부분에서 pbr이 아닌 unlit으로 해놓아서 빛을 전혀 받지 못한 것이었다. 개발자는 pbr이 뭔지 unlit이 뭔지 알지를 못하니 documentation에 property로 적혀있어도 취사 선택할 수가 없었던 것이다.

웹 3d개발에서 표현은 자바스크립트로 될지라도 어쨌든 근본은 3D라 Mesh 데이터에 Material과 Geometry가 있으며 이들 각각이 어떤 프로퍼티가 있고 이것들이 결국 최종적인 렌더에서 어떻게 작용하는지는 기존 3d 아티스트들보다 더 잘 이해할 순 없다.

그렇지만 여기에도 문제가 있다. 전통적인 3d 아티스트들은 3d소프트웨어와 렌더 엔진이 제공하는 손쉬운 매터리얼 워크플로우에 너무 의존하고 있는 경향이 있다. 이들은 기본적인 PBR(Physical Based Rendering) 워크플로우를 이해하지 못하는 경우가 수두룩하며 PBR 워크플로우를 하고 있어도 렌더 플러그인이 제공하는 기능만 따르기 때문에 왜 Metallic, Roughness 가 있는지 Gloss랑 Specular와 무슨 차이인지 Ior은 뭔지 개념이 없어 자신이 PBR을 하고 있는지 인지하지도 못한다. (이는 애니메이션 영역으로 넘어가면 훨씬 심해진다)

전통적인 이미지나 CG 영상작업을 위주로 하던 3d 아티스트들은 렌더 엔진이 제공하는 기능에 맞추어 렌더러가 요구하는 octane material이나 redshift material, vray material 등을 사용한다. 커스텀 Node를 사용하더라도 마찬가지이다. 이를 웹이 받아들이는 pbr 매터리얼로 변환하려면 텍스쳐 세트를 명확히 이해하고 bake 할 줄 알아야 한다.

WebGL렌더러와 웹을 위해 최적화된 3d 파일 포맷인 glTF가 기본적으로 Metallic Roughness 채널을 가지는 PBR 매터리얼(Mesh Standard Material)을 사용하므로 개발자나 3d작업자 모두 웹브라우저에서 원하는 대로 어셋을 보여주기 위해선 PBR에 대한 이해가 절대적으로 필요하다.

그렇지만 대부분의 3d 작업자들은 다양한 웹 프로젝트나 Ar / Vr을 위한 최적화 작업에 관심이 없거나 할 줄 몰라서 개발자와 소통하지 않고 서로 책임을 미루고 있는 것 같다. 3d가 웹에서 제대로 동작하지 못하는 이유에 대해 둘 다 제대로 알지를 못하니 공부할 생각은 안 하고 서로 책임만 떠넘기는 것이다.

결국 이전에 디자이너와 개발자 사이의 커뮤니케이션 문제가 똑같이 3d 분야에서도 발생하고 있지만 이런 현상을 만날 프로젝트가 아직 국내에서 대중적이지 않아 그 문제를 아무도 인지하지 못하거나 인지하더라도 무시하고 있는 게 안타까울 따름이다.

이런 이유로 AR/VR 콘텐츠나 메타버스와 관련된 프로젝트는 디자인뿐 아니라 실무 3D워크플로우와 웹개발 능력을 스스로 갖춰 커뮤니케이션을 이끌 수 있는 프로덕트 리더 혹은 기획자가 반드시 필요하다.

기존 3D아티스트들이 유니티도 해보고 언리얼도 해보고 후디니까지 해본 경험은 있어도 아직 웹과는 친하지 않은 것 같다. 앞으로 점점 3D아티스트와 웹 개발자가 만나는 일이 점점 많아질 것이고 해외에서는 이미 흔한 일이다.

3D 아티스트들이 소프트웨어가 제공하는 쉬운 기능들 말고 파이썬이나 자바스크립트가 제공하는 웹브라우저 기반 실시간 3D 렌더를 접해본다면 분명 미래 경쟁력 있는 인재로 성장할 수 있다고 생각한다.

개발자들 사이에서는 Three.js 등 WebGL 프로젝트를 맛본 사람들이 국내에서도 이제 점점 생겨나지만 아직까지 단순 모델 하나에 기존 자바스크립트 인터렉션을 섞어본다던가 카메라 전환 애니메이션에 만족하는 수준인 것 같다. 여기서 더 나아가 3d 저작환경이나 Physics 가 들어간 애니메이션 클립을 다뤄볼 수 있다면 역시 경쟁력을 갖출 수 있다고 생각한다.

나는 3d 모델링, 캐릭터 리깅, 모션그래픽, 텍스처링과 WEB 프런트 백엔드 개발, WebAR, VR 개발을 모두 경험했지만 아직까지 작은 우물에 있기에 국내에서 3D, WEB 이 두 분야를 제대로 융합해서 프로젝트를 이끌 수 있는 사람을 적어도 내 기준에서는 만나보지 못했다. 분명 곳곳에 숨어있을 것이라 생각하고 이런 사람들이 점점 더 생겨날 것이기에 만나서 서로의 노하우를 공유하고 배울 수 있는 장이 생기길 내심 기대해 본다.

이와 관련해 개인적으로 재밌었던 일화가 있다. 작년에 인프런에 three.js 강의가 처음 올라왔는데 그 강의가 올라오자마자 곧바로 다른 강의자가 본인도 후다닥 three.js 강의를 올리는 일이 있었다. 들어보니 나름 오랫동안 강의를 준비하고 있었던 자신이 인프런에서 후발주자가 된 걸 상당히 아쉬워했다. 두 강의 모두 가장 기본적인 three.js 라이브러리 사용법 정도에 그치긴 했으나 내게는 이제 점점 국내에서도 3d와 웹개발이 서로 융합하는 일이 많아지고 기존 3D아티스트 씬이나 AI씬에서처럼 나름의 인플루언서가 경쟁적으로 생겨날 것이라는 하나의 근거로 받아들여졌다.

새해엔 VR기기가 한풀 꺾이고 메타를 필두로 AR 컨텐츠의 강세가 이어질 것이다. 디바이스에선 AR글래스가 주목받기 시작할 것이고 기존 스마트폰 체계에서는 앱보다는 WebAR이 떠오를 것이다. 다가오는 미래가 아닌 이미 현재 부터 3D와 개발의 융합형 인재들이 빛을 볼 수 있기를 기대해본다.