Getting Started

Letsee WebAR SDK 소개

Letsee WebAR SDK는 모바일 AR 애플리케이션을 웹에서 쉽고 빠르게 구현할 수 있도록 해 줍니다. WebGL 기반의 3D 콘텐츠와 작동 가능한 HTML 요소를 이용하여 사물, 환경과 현실감 있게 인터랙션 하는 AR 경험을 편리하게 만들 수 있습니다.

요구사항

Letsee WebAR SDK가 실행되려면 다음과 같은 기능이 지원되는 모바일 브라우저가 필요합니다.

주의사항: Letsee WebAR SDK의 실행은 **https** 를 통해서만 가능합니다. 이것은 브라우저가 카메라에 접근하기 위해 필요합니다.

위 내용들은 다음과 같은 iOS와 Android 장치에 적용됩니다.

샘플 프로젝트 다운로드

간단히 따라해볼 수 있는 샘플 프로젝트는 아래의 Letsee 공개 GitHub 저장소에서 찾을 수 있습니다.

letsee/webar-tutorials-example

인증키

Letsee WebAR SDK 를 이용하여 AR contents 를 제작 및 배포하여 AR contents 를 서비스하기 위해선 프로젝트를 사용하기 위한 인증키를 발급받아야 합니다.

Letsee for Developers 사이트에 가입, 로그인한 후 프로젝트를 생성하면 프로젝트 별로 인증키를 발급받을 수 있습니다.

Letsee for Developers

웹 프로젝트에 인증키를 추가하여 SDK engine 로드

Letsee for Developers 사이트에서 프로젝트를 생성하여 발급된 인증키를 사용하여 Web AR SDK 를 로드합니다. 로드 시에는 등록된 도메인을 체크하기 때문에 반드시 웹 컨텐츠가 해당 도메인에서 실행되어야 합니다. SDK 스크립트가 로드 된 후에는 ready 콜백함수를 등록하여 엔진이 준비가 된 상황에서 AR contents 의 기능이 동작될 수 있도록 해야합니다. 위의 샘플 프로젝트에는 SDK 로드 후, 컨텐츠 동작을 위한 콜백함수를 등록하는 방법이 예시되어 있습니다.

<script src="<https://developer.letsee.io/api/webar?key=YOUR_APP_KEY>"></script>

<script>
	letsee.ready(callback);
	letsee.init({ trackerType: '사용할 트래커 타입(image | marker | qrcode)'};
	letsee.onTrackStart((e) => {
		// tracking 시작 시, 동작시킬 callback 함수의 내용 기술
	});
  letsee.onTrackMove((e) => {
    // tracking 진행 중, 동작시킬 callback 함수의 내용 기술
	});
  letsee.onTrackEnd((e) => {
	  // tracking 완료 후, 동작시킬 callback 함수의 내용 기술
  });
	const callback = () => {
		letsee.start(); 
		// 엔진 준비가 완료된 후, AR mode 가 동작될 수 있도록 하기 위해 반드시 start() 메서드를 실행한다.
	};
</script>