Search Unity

Unity Forma로 실시간 인터랙티브 3D 제품 컨피규레이터 제작하기

, 2월 26, 2021

성공적인 디지털 마케팅을 위해서는 고객이 어디에 있든 효과적으로 도달할 수 있어야 합니다. 마케팅 전문가를 위해 새롭게 출시된 Unity Forma를 이용하면 실시간 3D 제품 컨피규레이터를 손쉽게 제작하고 모바일 웹을 포함한 다양한 기기에 퍼블리시할 수 있습니다. Unity Forma의 무한한 가능성을 보여드리고자, 이번 포스팅에서는 웹 브라우저에서 Unity를 실행하는 WebGL 차량 컨피규레이터 데모를 소개합니다.

Unity 에디터의 확장 기능인 Unity Forma는 표준화된 프레임워크를 통해 3D 제품 데이터를 수집하고 마스터 모델을 제작하며 여러 마케팅 채널에 인터랙티브 콘텐츠와 정적 콘텐츠를 퍼블리시하도록 지원합니다. Unity Forma 공모전도 자세히 알아보고 참여해 보시기 바랍니다. 또한 유니티 웨비나 시리즈에서는 인터랙티브 3D 컨피규레이터를 제작하는 데 유용한 팁을 알아보고 궁금한 점에 대한 답변을 실시간으로 받아볼 수 있습니다.

파이프라인 문제

자동차나 럭셔리 제품과 같은 고가의 상품을 홍보하려면 여러 콘텐츠를 제작할 수 있는 파이프라인이 필요합니다. 이러한 파이프라인은 모바일 앱, 모바일 웹, 데스크톱 등 다양한 환경에서 제품 컨피규레이터가 작동하도록 지원하지만 동일한 작업을 여러 번 반복하는 결과로 이어질 수 있습니다. 파이프라인을 제작하고 유지하는 데는 많은 비용이 소모되며, 특히 제품을 자주 업데이트하는 경우 더 큰 문제가 됩니다. 결국 같은 작업을 여러 번 진행하게 되어 비용을 낭비하는 결과를 초래합니다.

Unity Forma의 Quality Profiles 기능

Unity Forma를 활용하면 동일한 프로젝트 내에서 다양한 모델 해상도, 머티리얼 표현, 그래픽스 설정을 간편하게 관리할 수 있습니다. (왼쪽: Unity에서 제작할 수 있는 최고의 렌더링 품질을 자랑하는 HDRP 프로파일. 중앙: URP 프로파일. 오른쪽: WebGL 프로파일)

Unity Forma는 매우 유용한 솔루션을 제공합니다. Unity Forma의 Quality Profiles 기능을 활용하면 제품 컨피규레이터의 다양한 모델 해상도, 머티리얼 표현, 그래픽스 설정을 관리하여 하나의 마스터 모델로 다수의 기기나 환경을 대상으로 경험을 제작할 수 있습니다.

여러 개의 프로젝트를 진행하는 대신 하나의 콘텐츠 파이프라인으로 모든 작업을 처리하여 효율성이 높아집니다. 그 결과 비용을 크게 절감할 수 있으며, 다양한 마케팅 터치포인트에서 제품의 일관성을 유지하고 보다 만족스러운 고객 경험을 제공할 수 있습니다.

Unity의 스크립터블 렌더 파이프라인을 활용하면 타겟 디바이스의 성능을 최고 수준으로 끌어올릴 수 있습니다. Unity Forma는 이 모든 요소를 하나의 프로젝트 내에서 관리합니다.

고해상도 렌더 파이프라인(HDRP)

HDRP는 Unity의 사전 구축된 스크립터블 렌더 파이프라인 중 하나로, Furioos 클라우드 스트리밍 서비스를 사용하여 PC와 웹 브라우저를 포함한 고성능 하드웨어에서 높은 성능과 정확도를 자랑하는 그래픽을 제공합니다. 여기에서 Furioos에서 실행되는 HDRP 컨피규레이터를 확인할 수 있습니다. HDRP를 통해 최고의 렌더링 품질을 얻을 수 있으며 실시간 레이트레이싱(프리뷰)과 같은 기능도 사용할 수 있습니다.

유니버설 렌더 파이프라인(URP)

URP는 사전 구축된 또 다른 스크립터블 렌더 파이프라인으로, 모바일 디바이스(Android 및 iOS)와 PC를 비롯하여 Unity에서 지원하는 모든 타겟 디바이스를 아우릅니다. URP는 HDRP를 대체하거나 포함하지 않으며, 제한된 성능만을 사용할 수 있는 플랫폼에서 조명과 셰이딩을 일부 희생하는 대신 뛰어난 그래픽과 훌륭한 실시간 성능을 제공합니다.

WebGL

최적화된 에셋을 이용하는 경우, 유니버설 렌더 파이프라인 콘텐츠를 WebGL 플랫폼에 배포하여 웹 브라우저에서 Unity의 인터랙티브 경험을 실행할 수 있습니다.

유니티는 Unity Forma 샘플 프로젝트로 AVIERA 차량 모델(Genesis Design 제공)의 인터랙티브 자동차 컨피규레이터가 포함된 WebGL 프로파일을 제작했습니다. 고도로 최적화된 이 에셋을 이용하면 Unity가 브라우저에서 직접 실행되며, 다른 WebGL 렌더러로 익스포트되지 않습니다. 특히 모바일 디바이스(iPhone 7 및 이후 버전 지원)에서 실행할 경우 최상의 경험을 할 수 있습니다.



 

WebGL 컨피규레이터 체험해 보기

 

WebGL 프로파일: 제작 과정

이 WebGL 프로파일은 Light & Shadows와의 협업을 통해 제작되었으며, 데이터 최적화 과정에서 Light & Shadows의 의견이 반영되었습니다. 아래에서 유니티의 파트너사인 Pixyz의 툴을 사용하여 프로젝트에서 이 작업을 자동화하는 방법에 대해 알아보세요. 


Light & Shadows 팀은 고품질 마케팅 콘텐츠를 손쉽게 제작할 수 있는 Unity Forma를 활용하여 업무 효율성과 속도를 크게 높이고 있습니다.

Unity Forma에서 인터랙티브 콘텐츠를 지원하려면 가능한 한 많은 3D 데이터를 준비하고 최적화하는 것이 매우 중요합니다. 이 과정을 통해 다른 플랫폼에서 사용할 수 있도록 3D 파일(예: FBX, gITF, GLB)의 크기를 줄일 수 있으며 파일이 최적화될수록 플랫폼에서 더 빠르게 로드할 수 있습니다.

Light & Shadows는 최종 사용자 경험에서 매우 중요한 이 단계에 특히 많은 노력을 쏟습니다. 파일을 최적화하면 파일 크기를 줄일 수 있을 뿐만 아니라, WebGL과 모바일 플랫폼처럼 제한된 성능으로 인해 대용량 파일을 처리할 수 없는 경우에도 품질 저하 없이 파일을 사용할 수 있습니다.

팀은 가장 먼저 시각적 렌더링을 희생하지 않고서도 프로젝트가 요구하는 사항(트라이앵글 개수가 많은 메시와 적은 메시)에 알맞은 품질로 CAD 파일을 테셀레이션했습니다. 이 과정은 업계 최고의 3D CAD 데이터 준비 솔루션인 Pixyz Studio로 진행되었으며, 그 결과 모든 3D 콘텐츠 제작 소프트웨어(3ds Max, Maya, Blender 등)에 적합한 고품질 FBX 파일을 익스포트할 수 있었습니다.

트라이앵글 개수가 많은 메시

트라이앵글 개수가 적은 메시

다음으로 3ds Max에서 파일 크기를 늘리는 불필요한 메시를 최종적으로 정리했습니다. 가능한 모든 요소에 인스턴싱을 사용했으며, 메시와 메시 속성의 동일한 사본을 생성하여 파일의 최종 크기를 줄이는 것이 목표였습니다.

예를 들어 차량의 길이를 줄여 차량 외부와 대칭인 인스턴스를 생성했습니다. 차량의 바퀴 또한 인스턴스화했는데, 바퀴의 테두리를 구성하는 메시에 다수의 트라이앵글이 필요했고 파일 크기도 컸기 때문입니다.

마지막으로, 초기 프로젝트가 HDRP로 제작되었기 때문에 URP 프로파일이 필요했습니다. 이를 위해 Unity Forma는 패턴의 이름을 지정하여 모든 머티리얼을 자동으로 할당하고 프로파일 간에 배리언트, 로직, 카메라 설정을 동일하게 유지했습니다. iOS에서 데모를 실행하기 위해서는 감마 조명 워크플로를 선택한 후 3D 아티스트가 일부 머티리얼과 환경 조명을 조정했습니다. 플랫폼별로 텍스처 해상도를 정의할 수 있는 Unity의 기능을 활용하여, 모바일 브라우저의 제한된 성능 내에서 데모를 실행할 수 있도록 낮은 해상도를 선택했습니다. 사후 효과는 사용되지 않았으며 대신 모델 일부에 오클루전 맵을 베이크했습니다.

이 WebGL 프로파일은 Unity Forma 고객과 체험판 사용자가 샘플 프로젝트에서 사용해 볼 수 있도록 곧 제공될 예정입니다. 그동안 다음을 확인해 보세요.

 

Unity Forma 체험해 보기