Letsee WebAR SDK

렛시 WebAR SDK는 웹 기반 증강현실을 위한 자바스크립트 라이브러리입니다. 간편하게 설계된 ARWebApp 규격은 일반적인 HTML5 기반의 웹 페이지들을 CSS, JavaScript 만으로 편리하게 AR 콘텐츠로 만들 수 있도록 해주어, 표준 웹 기술을 지원하는 현대의 모바일 웹 브라우저에서 네이티브 앱 설치 없이 쉽고 빠르게 증강현실 애플리케이션 구현을 실현합니다.

릴리스 노트 (Release Notes)

Letsee WebAR SDK v1.1.2 Released - 2021.03.05

Letsee is proud to announce the release of version 1.1.1 of WebAR SDK. The notable features as initial release include:

  • v1.1.2

    • 배포일 : 2021.03.05
    • wasm 버전 : v1.2.17
    • XRElement 제어를 위한 유저 인터페이스 추가
      • createXRElement : HTMLElement나 DOM string을 입력받아 XRElement 객체를 생성.
      • bindXRElement : XRElement를 Entity와 연결
      • unbindXRElement : Entity와 XRElement간의 연결을 해제
      • getXRElementById : id 선택자로 XRElement 조회
      • getXRElementByClassName : class 선택자로 XRElement 목록을 조회
      • getAllXRElements : 모든 XRElement들의 목록을 반환.
      • removeXRElement : XRElement를 삭제
      • removeAllXRElement : 모든 XRElement 목록을 삭제
    • Target Manager로 생성한 JSON Descriptor 호환
      • Letsee Developer의 Target Manager로 생성한 KeyPoints 기반의 JSON Descriptor 타입을 통하여 이미지를 학습시킬 수 있도록 인터페이스 확장
      • Insight.addTarget()에서 Insight.addExtractedTarget()로 네이밍 변경
      • 기존에 사용했던 Image 기반의 Json Descriptor도 사용할수 있도록 유지
      • JSON Descriptor 형식을 분석하여 어떤 타입(Keypoints 또는 Image)의 Descriptor인지 판단 후 해당 형식에 맞게 이미지를 학습시킬 수 있도록 설계
    • blob을 통한 insight-worker.js, insight-worker.wasm 경로 변경
      • SDK 이용시 insight-worker.js, insight-worker.wasm이 항상 같은 web 경로상에 존재하여야 하는 문제 해결
      • insight-worker.js, insight-worker.wasm의 경로를 blob을 통해 로컬로 다운로드하여 해당 blob 경로를 insight.init() 호출 시 해당 경로를 넘겨주어 insight 내부에서 치환될 수 있도록 wasm코드 및 insight.init() 인터페이스 수정
    • webpack 빌드 환경 구성 변경
      • webpack.dev.js, webpack-prod.js : Insight.init시 전달되는 AUTH_URL 추가
      • webpack.stage.js : SDK Webpack 빌드 후, insight.wasm, insight.js, insight.wasm, insight-worker.js, insight-worker.wasm, letsee.js 파일을 S3 버킷으로 upload 할수 있도록 환경 구성
  • v1.1.1

    • 배포일 : 2021.01.13
    • wasm 버전 : v1.2.11
    • Engine Pause & Resume 기능 추가
      • letsee.pause()가 호출되면 XRElement와 Three의 Scene과 Mesh 객체들의 Parent인 Entity의 pose matrix값을 마지막 위치에 대한 pose matrix로 값 대입.
      • Tracking이 진행되더라도 Entity의 PoseMatrix는 변화하지 않도록 수정. 이때, VideoRenderer는 계속 동작하기 때문에 백그라운드 비디오는 계속 돌고 Tracking만 되지 않음.
      • 만약 Pause기능을 사용할 때 마지막 Entity의 위치로 고정하는 것이 아니라 원하는 위치로 Entity를 입력하고 싶으면 letsee.pause()를 사용할 때 Param으로 pose matrix를 넘겨줄 수 있도록 확장성 구현.
  • v1.1.0

    • 배포일 : 2020.12.04
    • wasm 버전 : v1.2.11
    • 3D Raycasting을 위한 effectiveWidth, effectiveHeight를 ThreeRenderer property로 설정하여 쓸 수 있도록 구현
    • 각각의 Renderer에 스크린 정책 적용
    • Renderer의 Orientation이 일어날 때 Screen이 깨지는 에러 fix
    • ThreeRenderer, HTMLRenderer 동시 증강 시 한쪽 렌더러만 동작하는 에러 해결.
    • 외부에 별도로 동작하는 LetseeControl로 내부 ThreeRenderer로 다시 전환 (webpack 빌드시 wasm이 2번 호출되는 에러 발생 때문)
    • index.js에 addTHREE, addTarget, onTrackStart, onTrackMove, onTrackEnd 함수 생성
      • addTHREE : Three.js를 인자로 받아서 ThreeRenderer 관련 변수 반환 (renderer, camera, scene, update)
      • addTarget : 타겟 이미지 경로를 주입 후 해당 Target이미지에 대한 Entity 반환
      • onTrackStart, onTrackMove, onTrackEnd : TrackEvent 발생 시 유저가 등록할 수 있는 콜백 인터페이스 => 추후 LifeCycleManager로 관리
    • uri.js를 이용하여 Entity의 uri경로의 절대경로를 얻어오는 getAbsolutePath 로직을 재사용성이 좋도록 수정.