[XRCLOUD] 개인별로 동적인 공간 만들기 — CNU메타버스 마이스페이스 사례

BELIVVR
BELIVVR
Published in
6 min readApr 19, 2024

안녕하세요. 오래간만에 XRCLOUD를 이용한 기술 개발 사례를 공유드리고자 포스팅을 남깁니다.

아직 서비스용 서버에는 적용이 안된 기능으로 파트너사인 전남대학교의 메타버스에 먼저 적용이 된 기능 들입니다. 다음달까지 XRCLOUD서비스에도 적용될 기능이니 참고 바랍니다.​

이번에 소개 드릴 내용은 XRCLOUD를 이용하여 템플릿 공간을 사용자들에게 제공하고, 해당 공간을 꾸미고 사용자별로 다른 객체를 공간내에 보여주거나 클릭시 웹사이트와 연동 되는 구조를 보여주기 위한 예제입니다. 이를 통해 기존의 정보 인프라에서 정보를 가져와서 메타버스내에서 보여주거나 메타버스의 3D객체를 누르면 기존의 웹기반의 정보 인프라와 상호작용을 할 수 있는 겁니다.​

먼저 간단하게 영상을 보여드리겠습니다.

위 기술이 뭐 별거 아니네? 라고 생각할 수 있겠지만, 실제로 저러한 서비스를 구현함에 있어 XRCLOUD를 순차적으로 어떻게 사용할 수 있는지에 대해 설명을 드리겠습니다.

1. 메타버스에 동적으로 정보를 전달하여 공간내 객체를 바꾸기

  • 영상을 잘 보시면 공간 접속 URL이 잠시후에 뜨는 것을 확인하실 수 있습니다. 이는 CNU메타버시티가 XRCLOUD에게 공간접속에 필요한 URL을 받아오는데 걸리는 지연시간인데, 이때 공간접속에 필요한 URL을 요청할 때, 아바타의 정보와 공간내에 있는 객체를 동적으로 변환시키는 정보를 호출합니다.
  • 아바타 정보 전달 : 예전 포스팅에서 get방식으로 아바타를 심어 보냈다면, 이번에는 getROOM API를 호출할 때 아바타와 접속 정보를 전달 합니다. 이 URL은 시간이 지나면 만료되는 URL입니다.
  • empty frame을 이용한 동적 객체 변경 : 일전에 media frame을 통해 이미지, 3D파일을 사용자가 변경하여 공간 꾸미는 사례를 보여 드렸습니다. 이번에는 사용자가 아닌 API를 통해서만 객체를 추가, 삭제가 가능한 빌리버가 만든 신규 Spoke의 에셋으로 getRoom API호출 시, 에셋의 Name을 지정하여 해당 객체를 변경할 수 있습니다.
curl -X POST https://xrcloud.app:4000/api/v2/hubs/{Room ID} \
-H "Content-Type: application/json" \
-H "Authorization: Bearer {SystemAdminToken}" \
-d '{ "file": "https://xrcloud.app/files/7e23ec69-b064-4e4e-b9a8-e92644770b6c.glb", "objectName": "Empty Frame 1" }'

이를 통해 전남 대학교 메타버시티에는 사용자의 학업 정보에 따라 접속시에 해당 객체를 우수학업에 해당되는 메달로 변경하도록 했습니다.

2. 메타버스의 인라인뷰 페이지에 정보 전달

메타버스에 데이터를 넣는 방법을 알려드렸으니, 이번에는 메타버스 공간에서 사이드뷰를 열 때 정보를 전달하는 방법을 설명 드리겠습니다. 이를 통해 사용자별로 링크 페이지를 다르게 처리할 수 있겠죠. 대표적으로 아래처럼 마이스페이스에서 보드 클릭하면 나의 시간표가 출력됩니다.

이는 역시 생각보다 간단합니다. getRoom API에 역시 필요한 정보를 payload에 실어보내면, inline View 에셋이 페이지를 열때 payload값을 같이 실어 보내 줍니다. payload를 받는 쪽에서는 이를 기반으로 보안 처리나 유저를 식별하여 다르게 처리를 해주면 되죠. 아래는 그 예시입니다.

https://xrcloud.dev.belivvr.com:3000/api/rooms?sceneId=6e843903-a122-4edf-8aa6-11d3bc2e5c8f
⬆️는 일반적인 호출
https://xrcloud.dev.belivvr.com:3000/api/rooms?sceneId=6e843903-a122-4edf-8aa6-11d3bc2e5c8f&linkPayload=belivvr:data-test
⬆️는 inline viewer에 데이터를 넣기위한 호출

마이스페이스를 구현한 사례를 공유드리고자 포스팅을 남깁니다. 보통 마이스페이스하면 템플릿으로 공간이 주어지고 꾸미기가 가능합니다. 자. 이제 메타버스에 데이터를 주입할수도 사전에 필요한 데이터를 전달하여 원하는 페이지를 열때 전달할 수 있게 하여 웹사이트와 메타버스의 결합이 좀 더 긴밀하게 할 수 있도록 되어, XRCLOUD만의 차별적인 기능이며, 무궁무진한 응용이 가능한 기능입니다. 이를 이용하여 어떤 웹서비스던 XRCLOUD 메타버스와 자유롭게 연결 가능합니다.​

마지막으로 덕후 방꾸미는 것 보여드리고 끝내겠습니다. 예전에도 보여드렸지만, 공간내에 객체들은 pin으로 고정하여 지속적으로 남겨둘 수 있습니다. 그중 특히 media frame은 액자나 템플릿 객체로 이용하기 좋습니다.

메타버스를 만들때는 XRCLOUD가 가장 확장성이 좋습니다. 조만간 더 멋진 기능과 좋은 사례를 계속 공유하겠습니다. 본 기능은 5월중 일반 이용자들이 이용가능하게 product 서버에 머징, 배포 예정입니다.

--

--

BELIVVR
BELIVVR
Editor for

A digital romantic creating a new analog era