KR20240044847A - 확장된 현실을 만들기 위한 시스템 및 방법 - Google Patents

Abstract

확장된 현실을 만들기 위한 시스템 및 방법은 HTML5 웹 환경 기반 VR 및 AR 인터랙션 코딩 서비스 관련 웹 페이지, 프로그램 또는 시뮬레이션을 이용하여 AR 콘텐츠, VR 콘텐츠, 3D 콘텐츠, 360도 콘텐츠를 출력하도록 구성되며, 한 명 이상의 사용자가 입력을 제공할 수 있도록 하며, 네트워크(103)에 연결된 하나 이상의 사용자 입력 터미널(101), 하나 이상의 사용자에게 하나 이상의 대화형 콘텐츠 서비스를 제공하도록 구성된 서버(104) 및 네트워크(103)를 통해 서버(104)에 접속하고, 웹 브라우저(114)에서 스크립트를 실행하여 제작된 AR 콘텐츠 또는 VR 콘텐츠를 서버(104)에 업로드하도록 구성된 하나 이상의 출력 요청 단말(102)을 포함한다.

Description

확장된 현실을 만들기 위한 시스템 및 방법{A SYSTEM AND A METHOD FOR CREATING EXTENDED REALITY}

본 발명은 확장된 현실을 만들기 위한 시스템 및 방법에 관한 것으로, 보다 상세하게는 확장 현실을 위한 WebXR 환경 기반의 3D, AR 및 VR 인터랙티브 코딩 플랫폼에 관한 것이다.

배경 설명은 본 발명을 이해하는 데 유용할 수 있는 정보를 포함한다. 여기에 제공된 정보가 선행 기술이거나 현재 청구된 발명과 관련이 있거나 구체적으로 또는 묵시적으로 참조된 모든 출판물이 선행 기술이라는 것은 인정하지 않는다.

웹 기술은 컴퓨터/장치가 마크업 언어를 사용하여 인터넷을 통해 통신하는 방식을 말한다. 웹 브라우저는 마크업 언어를 디코딩하고 랩톱/데스크톱/모바일/웨어러블/헤드마운트/워크스테이션 중 하나의 디스플레이 장치에 정보를 렌더링하는데 사용된다. 웹 브라우저는 인터넷에서 텍스트, 데이터, 그림, 애니메이션 및 비디오를 표시하는 프로그램으로 정의할 수 있다. World Wide Web(WWW)의 URL(Uniform Resource Locator)은 웹브라우저에서 제공하는 소프트웨어 인터페이스를 사용하여 액세스할 수 있다.

웹 기술은 다음 섹션으로 분류할 수 있다.

a) World Wide Web(WWW): World Wide Web은 웹브라우저, HTML(Hypertext Markup Language) 및 HTTP(Hypertext Transfer Protocol)와 같은 여러 기술을 기반으로 한다.

b) 웹브라우저: 웹브라우저는 www(World Wide Web)을 탐색하기 위한 응용 소프트웨어입니다. 서버와 클라이언트 간의 인터페이스를 제공하고 웹 문서 및 서비스에 대한 요청을 서버에 제공한다.

웹서버는 사용자의 네트워크 요청을 처리하고 웹페이지를 생성하는 파일을 제공하는 프로그램이다. 이 교환은 HTTP(Hypertext Transfer Protocol)를 사용하여 이루어진다. 또한 웹 페이지는 World Wide Web에 연결되어 인터넷에 연결된 모든 사용자가 웹브라우저를 통해 볼 수 있는 디지털문서이다.

증강 현실은 현실 세계 위에 가상 객체를 "증강"하는 반면, 가상 현실은 가상 세계의 실제 상황에 있는 것처럼 사용자에게 경험을 제공하는 컴퓨터 생성 가상 환경을 제공한다. 기술로서 가상 현실은 사용자를 완전히 컴퓨터화된 환경에 두는 반면 증강 현실은 실제 환경에 정보를 직접 등록하는 것을 목표로 한다. 가상/증강 현실을 구성하는 세부 기술에는 디스플레이 기술, 인터랙션 기술, 추적 기술 및 영상 처리 기술이 있다. 또한 증강 현실에는 주로 손으로 조작하는 모바일 장치 AR 안경이 포함된다. 다양한 가상현실 및 증강현실 제품이 출시되면서 업계의 시장 규모가 커지고 있다.

비주얼 기반 인터페이스는 명령어가 주로 블록으로 표현되는 환경 내에서의 프로그래밍을 포함한다. 시각적 프로그래밍 언어는 블록 기반 코딩, 블록 양식, 그래픽 프로그래밍이라고도 한다. 블록 기반 프로그래밍 언어의 예로는 Scratch, Modkit, Robotc Graphical 등이 있다. 블록은 프로그램 논리에 속하는 선언 및 명령문을 지정하는 하나 이상의 명령으로 구성된다. 대부분의 블록 기반 프로그래밍 언어에서 블록은 프로그램의 의도를 완성하기 위해 다른 블록 내에 포함될 수 있다. 블록은 제어 구조가 생성되고, 변수가 시작되고, 애니메이션이 제공될 수 있고, 블록으로 다중 장면을 생성할 수 있는 구조적 프로그래밍의 기본이다. 목표는 시각적 인터페이스를 사용하여 어린 학습자가 프로그램을 만들기 위해 편집기 작업 공간에 블록을 끌어다 놓는 기능을 사용하여 프로그래밍 논리를 향상시킬 수 있도록 하는 것이다. 본 발명의 실시예는 쉬운 논리적 코딩 블록으로 복잡한 구문 또는 의미를 기억하지 않고 컴퓨터 과학 개념을 이해하는 데 있어 현재 진입 장벽을 제거한다.

특정 이용 가능한 기술은 이종 시스템의 혼합 현실 소프트웨어 애플리케이션을 위한 스크립팅 프레임워크 및 구현을 위한 방법 및 시스템을 개시한다. 이러한 방법 또는 시스템은 스크립팅 프레임워크의 서버 측 인스턴스에서 이기종 플랫폼에서 실행되는 혼합 현실 소프트웨어 응용 프로그램을 만들고 스크립팅 프레임워크의 서버 측 인스턴스를 사용하여 혼합 현실 소프트웨어 응용 프로그램의 변경 사항을 관리한다. 또한 스크립팅 프레임워크의 클라이언트 측 인스턴스를 사용하는 혼합 현실 소프트웨어 응용 프로그램의 변경 사항; 혼합 현실 소프트웨어 애플리케이션은 혼합 현실 장치에서 대화식으로 실행될 수 있다.

다른 이용 가능한 기술은 동적 드롭아웃 루틴 및/또는 순환 학습률 루틴을 사용하여 적대적 공격에 대해 증가된 견고성을 갖는 훈련된 신경망을 생성하기 위한 시스템, 방법 및 비일시적 컴퓨터 판독 가능 매체를 개시한다.

현재, 기존에는 증강 현실 콘텐츠를 제공할 때 인터랙션을 가능하게 하는 기술을 가지고 있다. 사용자와 가상객체 간의 상호작용에 따라 발생하는 이벤트를 인식하고, 가상객체의 정보를 인식하여 스마트기기로 전송한다. 스마트 장치는 가상 객체에 대한 사용자 입력을 증강 현실 장치에 적용합니다. 변형된 가상 객체의 정보를 기반으로 기 저장된 가상 객체를 전송 및 렌더링하여 증강 현실을 구현하는 구성과, 학습자가 마커/마커리스를 사용하여 가상 콘텐츠를 조작할 수 있도록 마커 기반 사용자 인터랙션을 지원하는 구성이 개시된다. 그러나 기존 기술은 어린이에게 친숙한 3D 설계 및 코딩 인터페이스를 제공하지 않는다.

2D 제작 도구는 많이 있지만 2D가 아닌 3D 교육을 위한 원스톱 솔루션을 제공하는 3D 도구는 없다.

또한, AR/VR 사용자가 인터랙티브 및 몰입형 콘텐츠를 경험하기 위해서는 각각의 애플리케이션 스토어에서 콘텐츠를 다운로드해야 한다. 이는 사용자 장치 스토리지에 부담을 줄 뿐만 아니라 요청에 따라 리소스를 다운로드하기 위해 양호한 인터넷 연결이 필요하다. 메모리나 저장 장치의 용량이 지속적으로 줄어들면 사용자는 단순히 관심 중심의 불필요한 응용 프로그램을 삭제한다.

따라서, 사용자의 컴퓨팅 자원에 의존하지 않는 AR 및 VR 인터랙티브 콘텐츠 기술이 요구된다. 또한 교육 영역에서 소비에 대한 관점의 변화도 필요하다. 행동으로 배우는 것은 교육의 초기 단계에서 학생에게 동기를 부여하여 새롭고 다른 것을 만들고 혁신할 수 있는 권한을 부여한다. 이 교육 학습 플랫폼을 통해 학생은 프로그래밍 기술뿐만 아니라 3D/AR/VR에서 장면을 디자인할 수 있다.

대화형 AR/VR/3D 콘텐츠를 생성하는 것은 특히 다중 장치(예: 스마트폰, 랩톱, 스마트 TV) 및 단일 사용자 하드웨어 인터페이스(예: 헤드 장착 디스플레이 또는 HMD)이다.

기존 작업 및 연구는 프로그래밍 및 디자인에 대한 사전 지식과 숙달이 필요한 CAD 도면, Unity 3D 및 Unreal과 같은 3D 전문 소프트웨어의 사용에 중점을 두고 있다. 이 때문에 교육용 사용자 프로그래밍의 대부분은 고급 엔지니어링 학생들과 함께 한다. 그러나 연구에 따르면 어린 학습자는 복잡한 개념, 내용 및 창의적 기술에 대한 인지적 이해를 향상시키는데 소프트웨어 개발 및 프로그래밍 경험이 도움이 된다.

이와 관련하여 Unity3D 방식은 3D 모델을 생성하는데 소요되는 시간을 획기적으로 단축시키는 새로운 방식이지만, 사용자의 프로그래밍 능력이 많이 요구되는 단점이 있다.

따라서 본 개시는 AR 및 VR 콘텐츠를 생성하기 위한 시간을 단축하기 위한 시스템 및 방법을 제공하는 것을 목적으로 한다.

또한, 본 개시는 숙련된 프로그래머를 필요로 하지 않고 경제적으로 실행 가능한 AR 및 VR 콘텐츠를 생성하기 위한 시스템 및 방법을 제공하는 것을 목적으로 한다.

다시 말해서, 본 개시는 대화형 시뮬레이션을 생성하기 위한 프로그래밍 구문 및 의미보다 논리적 및 분석적 기술을 더 강조하는 시스템 및 방법을 제공하는 것을 목적으로 한다.

본 발명의 또 다른 목적은 사용자가 자신만의 AR 및 VR 인터랙티브 콘텐츠를 생성할 수 있도록 하는 동시에 임베디드 링크 및 QR 코드를 통해 자신의 창작물을 전 세계의 다른 학습자와 경험하고 공유할 수 있도록 함으로써, 시스템이 유용성과 사용 용이성에 대한 사용자의 요구를 충족하고 기술에 대한 수용을 촉진할 수 있도록 한다.

본 발명의 또 다른 목적은 학생들이 그룹 작업을 통해 협력하여 AR 및 VR 애플리케이션을 생성 및 설계할 수 있는 플랫폼을 제공하는 것이다.

이 요약은 본 발명의 상세한 설명에서 추가로 설명되는 단순화된 형식으로 개념의 선택을 소개하기 위해 제공된다. 이 요약은 본 발명의 핵심 또는 본질적인 발명 개념을 식별하기 위한 것이 아니며, 본 발명의 범위를 결정하기 위한 것도 아니다.

본 개시의 일 실시예에 따르면, 확장 현실을 생성하기 위한 시스템이 개시된다. 이 시스템은 그래픽 코딩 인터페이스가 있는 HTML5 웹 환경을 기반으로 하는 WebXR 기반 VR 및 AR 대화형 콘텐츠를 제공하고, 네트워크에 연결된 하나 이상의 사용자 입력 터미널을 포함하며, 사용자 입력 터미널은 하나 이상의 사용자가 입력을 제공할 수 있도록 하고 다음과 같이 구성된다.

HTML5 웹 환경 기반 VR 및 AR 인터랙션 코딩 서비스 관련 웹 페이지, 프로그램 또는 시뮬레이션을 사용하여 AR 콘텐츠, VR 콘텐츠, 3D 콘텐츠, 360도 콘텐츠를 출력하는 단계; 하나 이상의 사용자에게 하나 이상의 대화형 콘텐츠 서비스를 제공하도록 구성된 서버; 및 상기 네트워크를 통해 서버에 접속하고, 웹 브라우저에서 스크립트를 실행하여 상기 제작된 증강 현실 콘텐츠 또는 가상 현실 콘텐츠를 상기 서버에 업로드하는 하나 이상의 출력 요청 단말을 포함하고, 상기 적어도 하나의 사용자 입력 단말은, 또는 스마트 폰, 스마트 패드, 노트북, 데스크탑, HMD 및 컨트롤러를 더 많은 출력 주변 장치를 포함한다.

일부 실시예에서, 서버는 하나 이상의 데이터베이스, 적어도 하나의 콘텐츠 개발 모듈, 사용자 입력 터미널에 대한 액세스를 검출하도록 구성된 적어도 하나의 감지 및 검출 모듈, 토글 출력 컨텐츠는 AR, VR, 사용자 입력단말에서 접속된 웹페이지에서 사용자 지정, 사용자 입력단말의 적어도 하나의 사용자 인터페이스에 입력, 제작된 AR 컨텐츠 및 VR 컨텐츠를 수신하여 변환하도록 구성된 컨텐츠 변환기 모듈 해당 HTML5 플랫폼, 출력 노드, 및 액세스된 웹 페이지에서 AR 콘텐츠 및 VR 콘텐츠를 출력하기 위한 사용자 입력 터미널을 관리하도록 구성된 적어도 하나의 출력 관리자 요청 터미널을 포함한다.

본 발명의 일 실시예는 인터랙티브한 3D, AR, VR 콘텐츠를 생성하지만, HTML5 Canvas & WebXR 지원을 수행하여 사용자의 컴퓨팅 자원에 의존하지 않으므로 애플리케이션을 다운로드하지 않고 웹페이지에 접속해야만 구동될 수 있다. 또는 프로그램. 시각적 블록 코딩은 사용자 입력 터미널(101)에서 수행되는 이벤트/액션을 지원하기 위해 대화형 콘텐츠를 생성하는 과정에서 도입된다. 사용자 입력단말(101)과 연결된 HMD(Head Mounted Display)의 시선추적을 기반으로 소스에 의존하지 않는 인터랙티브 및 몰입형 컨텐츠 제공 및 VR 인터랙티브 컨텐츠를 사용자 입력단말(101)로 스트리밍 가능 및 컨트롤러로부터 입력된 데이터를 입력하여 VR 인터랙션 콘텐츠를 변환하고, AR 마커/마커리스를 통해 AR 콘텐츠를 출력하지만 AR 인터랙션 콘텐츠를 변환할 수 있는 HTML5 캔버스 웹 환경을 기반으로 하는 VR 및 AR 인터랙션 콘텐츠 서비스 제공 방법(200)이며, 사용자 입력단자(101)로부터 입력된 단 하나의 데이터에도 기초한다. 그러나, 본 실시예가 달성하고자 하는 기술적 과제는 상술한 기술적 과제에 한정되지 않고, 다른 기술적 과제가 존재할 수 있다.

본 발명의 일 실시예에 따르면, 사용자 입력 단말은 복수의 웹 브라우저를 지원하는 랩탑, 데스크탑, 휴대폰 및 태블릿 중 하나 이상이다.

일 실시예에 따르면, 하나 이상의 인터랙티브 콘텐츠 서비스는 HTML5 웹 그래픽 코딩 환경 기반 VR 및 AR 인터랙티브 서비스 웹 페이지, 시뮬레이터, 프로그램, 또는 애플리케이션, 적어도 하나의 출력 요청 터미널로부터 AR 콘텐츠 또는 VR 콘텐츠 요청을 업로드 및 전송, 3D, AR 또는 VR로서 사용자 입력 터미널에 입력 선택을 제공하는 것에 대응하는 인터랙션을 제공한다.

일 실시예에 따르면, 네트워크는 LTE(Long Term Evolution) 네트워크, 5GPP(5th Generation Partnership Project) 네트워크, LAN(Local Area Network), 무선 LAN(Wireless Local Area Network), WAN(Wide Area Network, 광역 네트워크) 및 PAN(Personal Area Network, 개인 영역 네트워크)을 포함한다.

일 실시예에 따르면, 웹 페이지는 사진, 비디오 및 음악을 재생하는 기능 중 하나 이상을 포함하는 HTML5 기반 웹 브라우저 페이지이다.

본 개시의 일 실시예에 따르면, 확장 현실을 생성하는 방법이 개시된다. HTML5 웹 환경에 기반한 WebXR 기반의 VR 및 AR 인터랙티브 콘텐츠를 그래픽 코딩 인터페이스로 제공하는 방법에 있어서, 사용자 입력단말이 웹페이지에 접속하는 단계를 포함하고, 지리적 코딩 환경과 함께 3D/AR/VR로 사용자 선택 시; 3D 자산 및 애니메이션이 있는 자유 플레이 장면에 매핑된 코딩 명령에 따라 기능을 수행하도록 제어 및 코딩 블록 목록을 출력하는 단계; 및 상기 출력 요청 단말로부터 접속된 웹 페이지로부터 출력될 3D to AR/VR 컨텐츠를 검출, 센싱, 변환 및 렌더링하는 단계를 포함한다. 사용자 입력 단자의 인터페이스에서 AR, VR 또는 3D 모드 중 하나에서 사용자 선택이 존재할 때 그 다음에는 출력 장치, 모바일 장치, 컴퓨터 웹 시스템, 스마트 TV 브라우저, AR 안경으로 구성된 서버를 허용하는 대화형 시뮬레이션 단계가 이어진다.

본 발명의 일 실시예에 따르면, 상기 방법은 출력 관리자 요청 단말이 상기 웹 브라우저 내에서 증강 현실 렌더링이 가능하도록 이미지 인식을 통합하여 상기 사용자 입력 단말로부터 출력될 증강 현실 컨텐츠를 관리하는 단계를 포함한다.

본 발명의 일 실시예에 따르면, 상기 방법은 정의된 그래픽 블록 및 3D 자산 블록을 갖는 향상된 그래픽 코딩 환경 내에서 정의된 툴바 영역을 제공하는 단계; 향상된 그래픽 코딩 환경 내에서 정의된 무료 플레이 작업 공간 영역을 제공하고, 시뮬레이션을 형성하기 위해 함께 하나 이상의 그래픽 블록과 3D 자산 모델/환경의 연결을 허용하는 무료 플레이 영역; 및 도구 모음 영역에서 하나 이상의 그래픽 블록 및 3D 자산을 끌어 하나 이상의 그래픽 블록 및 3D 자산을 기존 프로그램 시뮬레이션 또는 콘텐츠에 추가하는 단계를 포함한다.

본 발명의 일 실시예에 따르면, 상기 방법은 향상된 그래픽 코딩 환경에 의해 3D 모델에서의 자유 공간 작업, 환경, 텍스처, 입자 효과, 텍스트, 오디오를 자동으로 검출하는 단계; 도구 모음 영역을 블록 드래그 앤 드롭다운 도구 모음으로 자동 변경한다.

본 발명의 일 실시예에 따르면, 상기 방법은, 사용자 입력 단자와 연동된 HMD(Head Mounted Display)가 감지되면, 사용자 입력 단자에 VR 시뮬레이션을 재생하는 단계; 및 상기 사용자 입력단말기의 컨텐츠 타입을 초기화하면서 사용자 인터페이스를 통해 사용자 선택이 가상현실로 존재하는 경우, 3차원 시뮬레이션에서 가상현실 컨텐츠를 허용, 토글 및 변환하는 단계를 포함한다.

본 발명의 일 실시예에 따르면, 상기 방법은 HMD에 의한 센서 기반 사용자의 눈 데이터 세트 또는 서버의 적어도 하나의 제어 모듈의 입력 데이터에 기반하고 사용자 입력 단말과 연동되는 인터랙티브 시뮬레이션을 제공하는 단계를 포함한다.

본 발명에 따르면 AR 및 VR 콘텐츠를 생성하기 위한 시간을 단축할 수 있는 효과가 있다.

또한, 본 개시는 숙련된 프로그래머를 필요로 하지 않고 경제적으로 실행 가능하고, 대화형 시뮬레이션을 생성하기 위한 프로그래밍 구문 및 의미보다 논리적 및 분석적 기술을 더 강조하는 효과가 있다.

또한, 사용자가 자신만의 AR 및 VR 인터랙티브 콘텐츠를 생성할 수 있도록 하는 동시에 임베디드 링크 및 QR 코드를 통해 자신의 창작물을 전 세계의 다른 학습자와 경험하고 공유할 수 있도록 함으로써, 시스템이 유용성과 사용 용이성에 대한 사용자의 요구를 충족하고 기술에 대한 수용을 촉진할 수 있도록 하고, 학생들이 그룹 작업을 통해 협력하여 AR 및 VR 애플리케이션을 생성 및 설계할 수 있는 효과가 있다.

도 1은 본 발명의 일 실시예에 따라 그래픽 코딩 인터페이스를 갖는 HTML5 웹 환경에 기반한 WebXR 기반 VR 및 AR 인터랙티브 콘텐츠를 제공하기 위한 시스템을 도시한다.
도 1a는 아이들이 위젯 패널, 코딩 편집기, 속성 패널 및 스케일, 위치, 회전과 같은 기타 기즈모 도구에 액세스할 수 있는 3D 편집기 창의 그래픽 표현을 예시합니다.
도 1b는 프론트 엔드에서 애플리케이션 초기화를 위한 방법을 예시한다.
도 2는 본 발명의 일 실시예에 따른 양방향 컨텐츠 서비스 제공 서버 및 클라이언트를 도시한 블록도이다.
도 3a는 본 발명의 일 실시예에 따른 3D/AR/VR에서 대화식으로 디자인하기 위한 편집기 인터페이스를 도시한 도면이다.
도 3b는 본 발명의 일 실시예에 따른, 사용자 입력 터미널에 로직을 제공하기 위한 코딩 인터페이스를 도시한 도면이다.
도 3c는 본 발명의 일 실시예에 따른, 사용자 선택에 기초하여 3D/AR/VR에서 대화형을 생성하기 위한 장면 선택 인터페이스를 도시한다.
도 3d는 본 발명의 일 실시예에 따른 사용자 인증 단말 인터페이스를 도시한다.
도 3e는 본 발명의 일 실시예에 따른 공개 랜딩 페이지 갤러리를 도시한다.
도 3f는 본 발명의 일 실시예에 따른, 혁신에 의해 개발된 가상 현실(VR) 장면의 생성을 예시한다.
도 3g는 본 발명의 일 실시예에 따른, 사용자 인터페이스에 의해 개발된 증강 현실(AR) 장면의 생성을 예시한다.
도 4는 본 발명의 일 실시예에 따라, 성능에 기초하여 피드백을 제공하기 위해 CNN 알고리즘을 사용하는 AI 데이터 구동 기술로 사용자 콘텐츠가 기록되고 관리자가 실시간으로 사용자 응답을 평가하는 것을 도시한다. 그리고
도 5는 본 발명의 일 실시예에 따른 HTML5 웹 환경 기반의 VR 및 AR 인터랙티브 콘텐츠 서비스 제공 방법을 도시한 흐름도이다.
또한, 숙련된 기술자는 도면의 요소가 단순성을 위해 예시되고 반드시 축척에 맞게 그려지지 않았을 수 있음을 이해할 것이다. 또한, 장치의 구성과 관련하여, 장치의 하나 이상의 구성요소는 도면에서 통상적인 기호로 표시될 수 있으며, 도면은 본 발명의 실시예를 이해하는 데 적절한 특정 세부사항만을 도시할 수 있으므로, 본 명세서의 설명의 이점을 갖는 당업자에게 용이하게 명백할 세부사항으로 도면을 모호하게 하지 않도록 하기 위함이다.

본 발명의 원리에 대한 이해를 촉진하기 위해, 이제 도면에 예시된 실시예를 참조할 것이며, 이를 설명하기 위해 특정 언어가 사용될 것이다. 그럼에도 불구하고 이에 의해 본 발명의 범위가 제한되지 않음이 이해될 것이다. 예시된 시스템에서의 이러한 변경 및 추가 수정, 및 여기에 예시된 바와 같은 본 발명의 원리의 추가 적용은 본 발명이 관련된 기술 분야의 숙련자에게 일반적으로 발생하는 바와 같이 고려될 수 있다. 달리 정의되지 않는 한, 본 명세서에서 사용되는 모든 기술 및 과학 용어는 당업자가 일반적으로 이해하는 것과 동일한 의미를 갖는다. 여기에 제공된 시스템, 방법 및 예는 예시일 뿐이며 제한하려는 의도가 아닙니다.

본원에 사용된 용어 "일부"는 "없음 또는 하나 또는 하나 초과 또는 모두"로 이해되어야 한다. 따라서 "없음", "하나", "하나 이상", "하나 이상이지만 전부는 아님" 또는 "모두"라는 용어는 모두 "일부"의 정의에 해당합니다. "일부 실시예"라는 용어는 본 개시의 범위를 벗어나지 않고 어떠한 실시예도 지칭하지 않거나, 하나의 실시예 또는 여러 실시예 또는 모든 실시예를 지칭할 수 있다.

본 명세서에 사용된 용어 및 구조는 일부 실시예 및 이들의 특정 특징을 설명, 교시 및 조명하기 위한 것이다. 청구 범위 또는 이에 상응하는 내용의 정신과 범위를 어떤 식으로든 제한, 제한 또는 축소하지 않는다.

보다 구체적으로, "포함한다", "포함한다", "있다", "구성하다" 및 문법적 변형과 같이 이에 제한되지 않는 본 명세서에 사용된 임의의 용어는 정확한 제한 또는 제한을 지정하지 않으며 확실히 배제하지 않는다. 달리 명시되지 않는 한 하나 이상의 기능 또는 요소의 가능한 추가 및 제한 언어 "반드시 포함" 또는 "필요"로 달리 명시되지 않는 한 나열된 기능 및 요소 중 하나 이상의 가능한 제거를 배제하는 것으로 간주되어서는 안 됩니다. 포함하는."

특정 기능 또는 요소가 어느 쪽이든 한 번만 사용하도록 제한되었는지 여부에 관계없이 여전히 "하나 이상의 기능" 또는 "하나 이상의 요소" 또는 "적어도 하나의 기능"으로 지칭될 수 있다. "적어도 하나의 요소." 더욱이, "하나 이상" 또는 "적어도 하나의" 특징 또는 요소라는 용어의 사용은 "하나 이상이 있어야 할 필요가 있다. . . " 또는 "하나 이상의 요소가 필요합니다."

달리 정의되지 않는 한, 본 명세서에서 사용되는 모든 용어, 특히 임의의 기술 및/또는 과학 용어는 당해 기술 분야의 통상의 지식을 가진 자에 의해 일반적으로 이해되는 것과 동일한 의미로 취해질 수 있다.

본 명세서에서 일부 "실시예"에 대한 참조가 이루어진다. 실시예는 첨부된 청구범위에 제시된 임의의 특징 및/또는 요소의 가능한 구현의 예라는 것을 이해해야 합니다. 일부 실시예는 첨부된 청구범위의 특정 특징 및/또는 요소가 고유성, 유용성 및 비-자명성의 요건을 충족시키는 하나 이상의 잠재적인 방식을 조명할 목적으로 설명되었다.

"제1 실시예", "추가 실시예", "대체 실시예", "일 실시예", "일 실시예", "다중 실시예, "일부 실시예", "다른 실시예", "추가 실시예", "추가 실시예", "추가 실시예" 또는 이들의 변형은 반드시 동일한 실시예를 지칭하는 것은 아니다. 달리 명시되지 않는 한, 하나 이상의 실시예와 관련하여 설명된 하나 이상의 특정 특징 및/또는 요소는 하나의 실시예에서 발견될 수 있거나, 하나 이상의 실시예에서 발견될 수 있거나, 모든 실시예에서 발견될 수 있거나, 발견될 수 있다. 어떤 실시예에서도. 하나 이상의 특징 및/또는 요소가 단일 실시예의 맥락에서, 또는 대안적으로 하나 이상의 실시예의 맥락에서, 또는 추가로 대안적으로 모든 실시예의 맥락에서 본원에서 설명될 수 있지만, 특징 및/또는 요소는 대신 별도로 또는 적절한 조합으로 제공되거나 전혀 제공되지 않는다. 반대로, 개별 실시예의 맥락에서 설명된 임의의 특징 및/또는 요소는 대안적으로 단일 실시예의 맥락에서 함께 존재하는 것으로 실현될 수 있다.

또한, 명세서 전체에서 "부품"이라는 용어는 하드웨어로 구현된 단위를 의미한다. 또한, 하나의 유닛은 2개 이상의 하드웨어로 구현될 수 있고, 2개 이상의 유닛은 하나의 하드웨어로 구현될 수 있다. 단말기, 장치 또는 장치에 의해 수행되는 것으로 설명된 일부 작업 또는 기능. 대신 단말 장치 또는 장치에 연결된 장치 또는 서버에서 수행될 수 있다.

마찬가지로, 서버에 의해 수행되는 것으로 설명된 동작 또는 기능 중 일부는 서버에 연결된 단말 장치 또는 장치에서도 수행될 수 있다. 단말과의 매핑 또는 매칭으로 설명되는 동작 또는 기능 중 일부는 단말의 식별 데이터인 단말 고유번호 또는 개인식별정보를 매핑 또는 매칭하는 것으로 해석된다.

사양에서 XR은 가상 현실, 증강 현실 및 3D에 사용되는 하드웨어, 소프트웨어 및 기술의 스펙트럼을 의미하며 다음을 포함하지만 이에 국한되지 않는다.

a) 헤드 마운트 디스플레이(불투명, 투명 또는 활용 여부)

비디오 통과,

b) 위치 추적 기능이 있는 모바일 장치.

c) 머리 추적 기능이 있는 고정 디스플레이

본 명세서에 설명된 임의의 특정 및 모든 세부사항은 일부 실시예의 맥락에서 사용되며, 따라서 첨부된 청구범위에 대한 제한 요인으로 반드시 취해져야 하는 것은 아니다. 첨부된 청구범위 및 그 법적 등가물은 아래의 설명에서 예시적인 예로서 사용된 것과 다른 실시예의 맥락에서 실현될 수 있다. 이하, 첨부된 도면을 참조하여 본 발명의 실시예를 상세히 설명한다.

본 개시내용은 확장된 현실을 생성하기 위한 시스템(100)을 제공하며, 여기서 시스템(100)은 그래픽 코딩 인터페이스를 갖는 HTML5 웹 환경을 기반으로 하는 WebXR 기반 VR 및 AR 대화형 콘텐츠를 제공한다.

도 1은 본 발명의 일 실시예에 따라 그래픽 코딩 인터페이스를 갖는 HTML5 웹 환경에 기반한 WebXR 기반 VR 및 AR 대화형 콘텐츠를 제공하기 위한 시스템(100)을 도시한다. 그러나, 도 1에 도시된 HTML5 웹 환경 기반 VR 및 AR 인터랙티브 코딩 플랫폼은 본 발명의 일 실시예에 불과하므로, 본 발명이 도 1을 통해 한정적으로 해석되는 것은 아니다.

상기 시스템(100)은, 네트워크(103)에 연결된 하나 이상의 사용자가 입력을 제공하고, AR 콘텐츠, VR 콘텐츠, 3D 콘텐츠, HTML5 웹 환경 기반 VR 및 AR 상호 작용 코딩 서비스 관련 웹 페이지를 사용하여 360도 콘텐츠를 출력하도록 구성된 사용자 입력 단자(101)를 포함할 수 있다. 서버(104)는 프로그램, 또는 시뮬레이션, 및 하나 이상의 사용자에게 하나 이상의 대화형 콘텐츠 서비스를 제공하도록 구성된다.

또한, 도 1을 참조하면, 시스템(100)은 네트워크(103)를 통해 서버(104)에 접속하여 웹 브라우저(114)에서 스크립트를 실행하여 생성된 AR 콘텐츠 또는 VR 콘텐츠를 서버(104)에 업로드하도록 구성된 하나 이상의 출력 요청 터미널(102)을 포함할 수 있으며, 여기서 적어도 하나의 사용자 입력 터미널(101)은 스마트폰, 스마트 패드, 노트북, 데스크톱, HMD 및 컨트롤러를 포함한 하나 이상의 출력 주변 장치를 포함할 수 있다.

일 실시예에 따르면, 서버(104)는 하나 이상의 데이터베이스, 적어도 하나의 콘텐츠 개발 모듈, 사용자 입력 단자(101)로의 액세스를 검출하도록 구성된 적어도 하나의 감지 및 검출 모듈, 사용자 입력 단자(101)의 적어도 하나의 사용자 인터페이스에 입력되며, 사용자 입력 단자(101) 선택으로부터 액세스되는 웹 페이지로부터 AR, VR, 습관에서 출력 콘텐츠를 토글하도록 구성된 코드 입력 정보 취득부를 갖는 제어 모듈(105)을 포함할 수 있다., 그리고 콘텐츠 변환 모듈은 생성된 AR 콘텐츠 및 VR 콘텐츠를 수신하여 대응하는 HTML5 플랫폼, 출력 노드 및 적어도 하나의 출력 관리자 요청 터미널(c)로 변환되도록 구성된다. 접속된 웹 페이지로부터 AR 콘텐츠 및 VR 콘텐츠를 출력하도록 사용자 입력 단말기(101)를 관리하도록 구성된다. 대화형 콘텐츠 서비스 제공 서버(104) ("서버(104)"로 상호 교환 사용)는 네트워크(103)를 통해 원격 서버(104) 또는 단말에 액세스할 수 있다. 그것은 컴퓨터로 구현될 수 있다. 컴퓨터는, 예를 들어, 노트북, 내비게이션 시스템(100)을 구비한 데스크톱 및 웹 브라우저(114)를 포함할 수 있다.

하나의 실시예에서, 하나 이상의 사용자 입력 단자(101)는 모든 주요 웹 브라우저(114)를 지원하는 노트북 또는 데스크톱(구글 크롬, 사파리, 인터넷 익스플로러, 오페라, 파이어폭스 등)일 수 있다.

하나의 실시예에서, 도 1에 도시된 바와 같은 각 구성 요소는 네트워크(103)를 통해 연결될 수 있다. 예를 들어, 도 1에 도시된 바와 같이, 적어도 하나의 사용자 입력 단자(101)와 출력 요청 단자는 네트워크(103)를 통해 서버(104)를 제공하는 대화형 콘텐츠 서비스에 연결될 수 있다. 여기서, 네트워크(103)는 복수의 단말과 서버(104)와 같이 각 노드 간에 정보 교환이 가능한 연결 구조를 의미할 수 있다. 하나의 실시예에서, 네트워크(103)는 LTE(Long Term Evolution) 네트워크(103), 5GPP(5th Generation Partnership Project) 네트워크, LAN(Local Area Network)(103), 무선 LAN(Wireless Local Area Network)(103), WAN(Wide Area Network)(103), PAN(Personal Area Network)(103) 등을 포함할 수 있으나, 이에 한정되는 것은 아니다.

일 실시예에 따르면, 상기 적어도 하나의 사용자 입력 단말기(101)는 HTML5 웹 환경 기반 VR 및 AR 상호 작용 코딩 서비스 관련 웹 페이지, 프로그램 또는 시뮬레이션을 이용하여 AR 콘텐츠, VR 콘텐츠, 3D 콘텐츠, 360도 콘텐츠를 출력할 수 있다. 이 경우, 적어도 하나의 사용자 입력 단자(101)는 스마트폰, 스마트 패드, 노트북, 데스크톱, HMD 또는 컨트롤러 등의 출력 주변 장치와 연동되는 단자일 수 있다.

일 실시예에 따르면, 적어도 하나의 사용자 입력 단자(101)는 네트워크(103)를 통해 원격 서버(104) 또는 터미널에 접근할 수 있는 컴퓨터로서 구현될 수 있다. 여기서 컴퓨터는 예를 들어 내비게이션, 웹 브라우저(114), 데스크톱 및 노트북을 구비하는 노트북 등을 포함할 수 있다. 이 경우, 적어도 하나의 사용자 입력 단자(101)는 네트워크(103)를 통해 원격 서버(104) 또는 단말에 접근할 수 있는 단말로서 구현될 수 있다.

그림 1a는 어린이들이 위젯 패널, 코딩 편집기, 속성 패널 및 축척, 위치, 회전과 같은 기타 장치 도구에 액세스할 수 있는 3D 편집기 창의 그래픽 표현입니다. 그림 1a를 참조하면, 그림 다이어그램은 사용자 장면 이름, 10초 간격에 자동 저장과 같은 기능을 가진 저장 및 게시 시뮬레이션과 같은 옵션으로 구분된다. 사용자는 시뮬레이션 설계를 생성할 때 수행되는 작업을 다시 실행하거나 실행 취소할 수 있다. 속성 패널에는 각 3D/2D 모델/항목의 사용자 정의 속성이 표시될 수 있다.

설정은 사용자에게 Anti Aliasing/Rendering Type/Preserve Drawing 옵션과 같은 사용자 지정 캔버스 설정을 제공할 수 있다. 또한, 사용자는 현장에서 로드된 이력에 따라 자원의 체계적인 할당을 포함하는 설계에서 로드된 모델/항목의 계층적 그래프를 제공할 수 있다. 위젯 패널은 사용자에게 환경, 원시 3D 모델, 문자 모델, 오디오, 비디오, 텍스트 및 사용자 지정 마커의 다양한 내장 옵션과 함께 사용자 지정 모델 업로드 옵션을 제공할 수 있다.

그림 1b는 프런트 엔드에서 애플리케이션을 초기화하는 방법을 나타낸다. 하나의 실시예에서, Init.js는 솔루션이 실행되는 인스턴스에 기초하여 운영 서버 또는 개발 서버를 선택하기 위해 제어 작업이 수행되는 초기화 파일일 수 있다. 또한 Init.js는 필요한 씬(scene)이 에디터 모드 또는 재생 모드에서 열리는지 여부를 결정하기 위한 기본 파일일 수 있다. 재생 모드는 사용자가 시뮬레이션을 편집할 자유가 없는 시나리오일 수 있으며, 대신 인증된 사용자가 만든 장면만 시각화할 수 있다. 대신 편집 모드를 사용하면 사용자가 3D 모델/오디오/텍스트/입자 효과/질감을 자유롭게 추가할 수 있다. 편집 모드에서, 애플리케이션 계층 로직은 바닐라 js와 jquery를 사용하여 HTML 요소를 생성하도록 설계될 수 있다. 상기 HTML 구성요소는 그림 1a에서 논의된 바와 같이 속성 패널, 위젯 패널 및 기타 기즈모 패널의 생성을 포함할 수 있으며, 상기 3D 캔버스는 웹 상에 3D 관련 그래픽을 표시하는 이유인 'WebGL' 컨텍스트로 초기화될 수 있다. 3D 엔진 초기화 중에 카메라 매트릭스 및 모델 매트릭스를 설정하여 MVP 매트릭스를 생성하고 렌더링 기능으로 전송될 수 있다. 3D 엔진 및 HTML 요소의 완전한 초기화 후 3D 모델은 클라우드(S3 스토리지, localStorage, 외부 클라우드 서비스)에서 모델을 비동기적으로 로드하고 로드된 모델과 필요한 이벤트를 바인딩하는 장면 API에서 로드된다. 메모리에 로드된 해당 모델은 이제 렌더러로 전송되며, 여기서 모델은 증강 현실 형식 또는 가상 현실 형식 중 하나일 수 있는 사용자의 장면 생성 선택에 따라 사용자 단말기에 표시된다. 이전 모드에서 사용자가 선택한 옵션이 없으면 기본값은 3D이다.

도 2는 본 발명의 일 실시예에 따른 대화형 콘텐츠 서비스 제공 서버(104) 및 클라이언트를 도시한 블록도이다. 3층 구조는 프레젠테이션 계층(111), 논리 계층(112) 및 데이터 계층(113)으로 구성될 수 있다. 프레젠테이션 계층(111)은 일 실시예에 따른 그래픽 사용자 인터페이스(GUI) 및 3D 렌더링을 위한 메인 캔버스를 포함할 수 있다. 논리 계층(112)은 파이썬으로 작성되고 장고 웹 프레임워크에 배치된 다수의 웹 서비스를 포함할 수 있다. 데이터 계층(113)은 데이터의 저장 및 검색에 초점을 맞출 수 있다.

도 2를 더 참조하면, 서버(104)는, 센싱부, 제어부(105)(105) (제어 모듈(105)에 있어서, 명세서 전체에서 제어 모듈(105)과 상호 교환 가능하게 사용되는), 출력 VR/AR 제공부, 변환부 및 데이터베이스부를 포함할 수 있다. 한편, 클라이언트 웹 브라우저(114)를 제공하는 대화형 콘텐츠 서비스는 AR, VR 및 3D로 시뮬레이션을 실행하고 출력하기 위한 3D 게임 엔진 및 코드 관리자를 포함할 수 있다.

하나의 실시예에서, 코드 매니저는 사용자 인터페이스 입력 단자에서 사용되는 그래픽 비주얼 블록들을 포함할 수 있고, 2개의 연관된 정의 파일을 가질 수 있다. 제1 파일은 블록이 가질 수 있는 입력 또는 출력 필드를 포함하여 블록의 그래픽 시각적 외관을 설명하는 정보를 포함할 수 있다. 두 번째 파일은 플랫폼의 툴바 측에서 블록이 3D 자산에 임베디드되는 방법을 설명할 수 있다. 사용자는 블록의 필요한 기능을 입력하고 3D 모델과 웹 환경에 제공된 파라미터를 검색하여 AR/VR/Custom 시뮬레이션을 생성할 수 있습니다. 자바스크립트는 하나의 실시예에서 블록 정의 및 코드 생성 파일들을 위한 언어로서 사용될 수 있다. 또한, 특정 시뮬레이션을 생성하는 기능을 가진 블록들의 전체 컬렉션은 백그라운드에서 텍스트 코드로 변환될 수 있다.

감지부는 사용자 입력 단자(101)로부터 대화형 콘텐츠 서비스를 제공하는 웹 페이지에 액세스하여 사용자 입력 단자(101)의 액세스를 감지할 수 있다. 이 경우, 웹 페이지는 HTML5 기반의 웹 브라우저(114) 페이지일 수 있다. HTML5는 웹 문서 표준인 HTML(Hypertext Markup Language)의 최신 표준으로 사진, 동영상, 음악 등을 재생할 수 있는 기능을 포함하고 있다. 또한 HTML5는 플러그인 기반 액티브-X, 플래시와 같은 프로그램을 별도로 설치할 필요가 없으며 이로 인해 발생하는 대부분의 문제를 해결할 수 있다. 이때 기존 HTML 표준과 HTML5의 가장 큰 차이점은 시맨틱 마크업을 지원하고 추가 API를 제공한다는 점이다. 의미론적 마크업은 의미론적으로 웹 문서를 구조화할 수 있는 새로운 요소이다. 예를 들어, 문서 내용을 머리글, 본문 및 바닥글로 구분합니다. 따라서 문서를 작성하면 문서의 내용을 구조적으로 명확하게 이해할 수 있다. 또한 HTML5는 다양한 API를 제공합니다. HTML5에서 제공하는 API는 사용자가 웹 애플리케이션에 2차원 및 3차원 그래픽을 지원하는 등 다양한 기능을 추가할 수 있다.

HTML5의 postMessage 메커니즘은 서로 다른 출처(스케치팹 및 기타와 같은 타사 콘텐츠가 3D 모델을 업로드함)의 웹 콘텐츠가 서로 통신할 수 있도록 하여 동일한 출처 정책을 완화하는 데 사용된다. 각 메시지에는 정확한 정보가 포함되어 있다. HTML5(Canvas, WebGL) 표준을 지원하는 웹 브라우저(114)의 빌트인 기능을 기반으로 한 3D 메쉬의 효과적인 시각화를 제시한다. JavaScript 라이브러리는 물리학 및 3D 처리 알고리즘을 통합한다. HTML5 기반 대화형 콘텐츠 시스템(100)은 하이퍼링크, 사용자 상호 작용, 오디오 및 비디오, 애니메이션 및 3D 모델 보기를 지원한다. 또한 HTML5는 하이퍼링크 및 텍스트를 표시하고, 웹페이지를 생성하고, 멀티미디어와 같은 다양한 응용 프로그램을 표현 및 제공하는 데 사용되는 마크업 언어이다. 웹문서 구조를 디자인하기 위한 마크업 언어인 HTML, 디자인 표현을 위한 CSS, 인터랙티브 액션을 위한 JavaScript를 포함하여 HTML5를 구현할 수 있으며, 기존 HTML 태그에 새로운 태그를 추가할 수 있으며, 내용을 담기 위한 구조를 보다 균일하게 개선할 수 있다. 플랫폼의 역할을 한다.

CSS(Cascading Style Sheets)는 출력 요구 사항 터미널(102)에 표시되는 HTML5 요소를 설명하고, 한 번에 여러 웹 페이지의 레이아웃을 저장 및 제어한다. 한편, 여기서 사용하는 프론트엔드 기술은 고급 해석 프로그래밍 언어인 JavaScript(JS)입니다. JavaScript에는 중괄호 구문, 동적 유형 지정, 프로토타입 기반 객체 지향 및 일급 기능이 있다. JavaScript는 HTML, CSS와 함께 World Wide Web의 핵심 기술 중 하나이다. JavaScript는 대화형 웹 페이지를 가능하게 하며 이 웹 환경 플랫폼의 필수적인 부분이다. 지원에는 객체 지향 및 프로토타입 기반 스타일을 포함하여 이벤트 중심, 기능 및 명령이 포함되지만 이에 국한되지 않는다. 사용자 인터페이스에서 사용자가 제출한 양식이 부적절한 값을 가질 수 있는지 확인하는 것이 중요하다. 따라서 유효성 검사는 사용자를 인증하는 데 필수이다. JavaScript는 클라이언트 측에서 양식을 검증하는 기능을 제공하므로 데이터 처리가 서버(104) 측 검증보다 빠르다.

부트스트랩은 모바일 우선 프론트 엔드 웹 환경 인터페이스인 반응형 사용자 입력 터미널(101)을 대상으로 하는 오픈 소스 CSS 프레임워크이다. 여기에는 타이포그래피, 양식, 버튼, 탐색 및 기타 인터페이스 구성 요소를 위한 CSS 및 JavaScript 기반 디자인 템플릿이 포함되어 있다.

백엔드 측에서, 파이썬이 본 발명에서 사용되며, 이는 해석된 고수준 객체 지향 접근 방식인 범용 프로그래밍 언어이다. 본 개시에서, 파이썬은 플랫폼이 수행할 수 있는 데이터베이스 부분 및 모든 기능을 코딩하기 위한 백엔드 언어로 사용된다. 이 개발 과정에 사용된 Python 버전은 Python 3.7이다.

이 플랫폼의 이 개발 과정에서 사용된 Django의 버전은 Django 4.0.1이다. Django는 빠른 개발과 깨끗하고 실용적인 디자인을 장려하는 고급 Python 웹 프레임워크입니다. 프레임워크는 재사용성과 컴포넌트의 "플러그 가능성"을 강조하고 코드는 줄이다. 낮은 결합, 빠른 개발 및 반복하지 않는 원칙. Python은 웹 기반 대화형 콘텐츠 시스템(100)의 설정 파일 및 데이터 모델에도 전체적으로 사용된다. Django는 또한 내부 검사를 통해 동적으로 생성되고 관리 모델을 통해 구성되는 관리 생성, 읽기, 업데이트 및 삭제 인터페이스를 제공한다.

쟝고(Django)는 SQLite 3.372를 기본 데이터베이스로 사용했다. SQLite는 작고 빠르며 독립적인 고신뢰성, 완전한 기능을 갖춘 SQL 데이터베이스 엔진을 구현하는 C 언어 라이브러리이다. 쟝고(Django)는 파이썬 프로그래밍 언어를 사용하여 이 플랫폼 데이터베이스를 정의하는 특정 방법을 제공한다.

SHA-256은 데이터베이스에 보안 암호를 저장하는 암호화에 사용되는 해싱 알고리즘 중 하나이다. 모든 SHA-256 값에는 256비트 또는 32바이트가 있다. 로그인 인터페이스에서 사용자의 비밀번호를 확인하기 위해 사용자가 제출한 비밀번호를 메모리에 보관하므로 디스크를 만지거나 해시를 계산할 필요가 없다. 계산된 해시가 저장된 해시와 일치하는 경우 사용자는 올바른 비밀번호를 입력한 것이며 플랫폼에서 사용자가 안전하게 로그인할 수 있다.

또한, HTML5는 모바일 웹의 표준은 아니지만, 앞서 설명한 다양한 기능 중 모바일 웹의 구현에 필요한 많은 기능을 제공한다. 모바일 웹의 UI(User Interface)를 풍부하고 다양화할 수 있는 2D 그래픽, 오디오, 다양한 웹 형태 등 많은 기능을 제공한다. 즉, 모바일 웹 환경에서도 멀티미디어 정보를 제공하거나 사용자의 다이나믹한 인터랙션을 지원하는 것이 가능하다. 모바일 웹 환경에서는 모바일 환경의 특성상 많은 양의 데이터를 전송하는데 한계가 있으며, 이러한 제약을 극복할 수 있는 것이 웹이다. 일부 다른 기능은 아래 표 1에 요약되어 있다.

주요 기능	설명
Web Form	사용자 입력 양식 확장 제공(이메일, URL, 번호, 범위, 달력 등의 추가 웹 양식)
Canvas (WebGL)	3D 그래픽을 그리기 위한 API
SVG (Scalable Vector Graphic)	XML 기반의 3차원 벡터 그래픽 표현 언어
Video/ Audio	플러그인 없이 오디오 및 비디오를 재생하는 장치
SQL Database	데이터베이스 항목에 표준 MySQL을 사용하는 SQL
Local Storage	웹 클라이언트에 데이터를 저장하는 기능
Web Socket	웹 클라이언트가 서버(104) 측과 양방향으로 직접 통신할 수 있도록 하는 API
WebXR	컨트롤러, 표면 감지, 카메라 최적화 지원을 포함하는 장치에서 xr 인터페이스를 호출하는 API.
REST API	REST API 구조를 이용한 사용자 및 장면 정보 전송
Visual Coding	시스템(100)에 있어서, 그래픽 프로그래밍 코딩 환경을 생성하고, 상기 시각적 프로그래밍 코딩 환경은 복수의 그래픽 프로그래밍 블록을 정의하고, 상기 복수의 그래픽 프로그래밍 블록 중 각각의 그래픽 프로그래밍 블록은 미리 정의된 프로그래밍 요소를 나타내도록 구성되는 시스템(100).

상술한 HTML5 기능을 고려한 본 발명의 일 실시예에서, 본 발명의 서비스는 2가지 모델로 구현될 수 있으나, 본 발명은 이하에 열거된 것에 한정되지 않는다. 제1 모델은 웹 애플리케이션과 같이 서버(104) 측에 데이터를 저장할 수 있고, 클라이언트는 실시간으로 정보를 수신할 수 있다. 두 번째 모델은 클라이언트의 캐시 및 로컬 데이터베이스를 사용하여 개발하는 동안 미리보기 웹 애플리케이션으로 실행하고 필요한 경우 서버(104) 측에서 정보를 수신할 수 있다.

이 외에도 네트워크(103)에 연결된 클라우드 서버(104)를 이용하여 SaaS(Software as a Service)를 사용할 수 있다. SaaS는 클라우드 환경에서 실행되는 응용 프로그램을 사용자에게 제공하는 서비스이다. SaaS는 인터넷 어디에서나 쉽게 사용할 수 있으며 웹 브라우저(114)를 통해 어디서나 액세스할 수 있다. 상술한 애플리케이션은 다운로드 또는 설치되는 애플리케이션이 아니라 클라우드 서버(104) 또는 HTML5 기반의 웹 브라우저(114)를 통해 제공되는 애플리케이션으로 정의될 수 있다.

도 2를 참조하면, 제어부(105)는 사용자 입력단말(101)에서 접속할 수 있는 코드입력정보, 코드실행기를 포함하는 웹페이지에서 AR 및 VR컨텐츠를 출력하도록 제어할 수 있다. 이에 따라, 사용자 입력단말(101)은 작성된 코드의 기능에 대한 증강현실 콘텐츠 또는 가상현실 콘텐츠를 출력할 수 있고 웹페이지로 접속이 가능하며, 애플리케이션이나 프로그램을 설치하지 않을 수 있다. 또한, 제어부(105)는 사용자 입력단(101)에서 AR 마커가 인식되면, AR 마커가 있는 위치에 AR 컨텐츠를 출력하도록 제어할 수 있다. 이때, AR 마커는 요청 단말이 기관 또는 개인 사용자인 경우 코스 콘텐츠 이미지일 수 있으나, 이에 한정되는 것은 아니다. 또한 화면을 터치하여 상호작용이 가능하도록 구성할 수 있다. 마커리스 방법(200)은 미지의 또는 실외의 실제 환경(예: 벽의 위치)을 감지하고 이해하며 환경에 대한 사전 지식이 필요하지 않으므로 대규모 모바일 AR을 효율적으로 촉진할 수 있다.

다양한 장치에 대해 많은 상호 작용 모델이 제공되고 자동으로 조정되며, 예를 들어 모바일 장치(스마트폰 및 태블릿) 및 터치 스크린에서는 멀티 터치 상호 작용이 제공되는 반면 데스크탑 장치(노트북, PC)에서는 키보드가 제공됩니다. +마우스 모델이 활성화되었다. 몰입형 VR/AR 장치에서는 HMD 자유도(3-DoF 또는 6-DoF)에 따라 다양한 상호 작용 모델이 자동으로 활성화된다. QwikXR에는 사용자 장치의 유형에 따라 활성화할 수 있는 다양한 탐색 모드가 있다. (A) 궤도 모드(기본값); (B) 1인칭 모드; (C) 장치 방향 모드; 및 (D) 몰입형 VR 탐색 모드.

궤도 모드는 대다수의 Web3D 발표자에 의해 제공되는 고전적인 탐색 모델이다. QwikXR에서는 우수한 사용자 경험을 위한 부드러운 전환과 함께 대상 변경 기능(카메라 대상을 조정하기 위해 표면을 두 번 탭/두 번 클릭)을 제공한다. 1인칭 모드를 통해 사용자는 공통 포인트 앤 고 모델을 통해 환경을 탐색할 수 있다. 장치 방향 모드(모바일 장치에서 사용 가능)는 사용자 장치에 내장된 센서에 액세스하고 이러한 정보를 사용하여 가상 카메라를 제어한다. 시스템(100)은 3-DoF 및 6-Dof HMD에 자동으로 적응하여 VR 컨트롤러의 존재 여부에 따라 포인팅 방법(200)을 전환한다. 컨트롤러가 없으면(예: 판지) 보기 정렬/시선 포인팅이 활성화되고, 그렇지 않으면 VR 컨트롤러 중 하나가 사용된다. 이를 통해 시스템(100)은 고급 HMD(예: Oculus Quest, HTC Vive 등)에서 제공하는 3-DoF(예: 판지) 및 6-DoF 상호 작용 모델에 원활하게 적응할 수 있다.

WebXR Device API는 웹 상에서 VR과 AR을 모두 지원한다. Web Extended Reality, WebXR은 웹 환경에서 가상 환경을 제시하거나 실제 환경에 그래픽 이미지를 추가하기 위해 적절한 하드웨어로 3D 장면의 렌더링을 지원하는 데 사용된다. WebXR 장치 API 알고리즘은 휴대용 컨트롤러, 광학적으로 추적된 손 및 뷰어의 포즈에서 작동하는 시선 기반 입력 방법(200)을 포함하지만 이에 국한되지 않는 XR 입력 소스이다. WebGL, JavaScript API는 플러그인을 사용하지 않고 고성능 인터랙티브 3D 및 2D 그래픽을 렌더링하는 데 사용된다. WebRTC는 실시간으로 사용자와 통신하고 피어 간에 비디오, 음성 및 일반 데이터를 스트리밍할 수 있는 기능을 웹 환경에 제공하는 API를 제공한다. Web Speech API는 음성 인식 및 합성을 지원하는 데도 사용된다. 사용자는 AR 및 VR 출력 요구 사항 터미널(102)에서 실시간으로 이 기능을 사용하기 위한 맞춤형 컨텐츠 생성을 선택할 수 있다. 사용자는 URL/내장 링크를 열거나 장치에서 QR 코드를 스캔하여 통신에 참여할 수도 있다. 또한 대용량 다운로드가 필요하지 않으며 사용자는 웹 사이트에서 즉시 가상 환경을 경험할 수 있다.

본 발명의 실시예의 일부인 XR 렌더러는 사용자가 선택한 원하는 사용자 상호작용 환경 옵션을 저장하고 이를 사용하여 사용자의 상호작용 환경에 따라 XR 코드를 적절하게 해석한다. 사용자의 상호 작용 환경이 AR인 경우 XR 렌더러는 초기에 모든 가상 객체를 렌더링하지 않도록 설정하고 AR 엔진이 실제 객체를 추적할 때 증강 객체만 선택적으로 렌더링한다. 반면 VR의 ar-target 속성에 관계없이 모든 객체는 항상 렌더링된다. XR 렌더러는 카메라 비디오 프레임이 사용자에게 표시되도록 배경 및 가상 개체가 AR로 렌더링되지 않도록 지정한다. 반면, 사용자의 환경이 VR인 경우 렌더러는 배경과 가상의 물체를 그려 사용자에게 사실적인 몰입감을 제공한다.

센서 기반 방법(200)을 사용하는 본 개시 내용은 비교적 가벼운 모바일 AR 구현 접근 방식인 반면, 비전 기반 접근 방식은 네트워크뿐만 아니라 런타임 플랫폼의 컴퓨팅 및 저장 기능에 대한 높은 요구를 둔다. (103) 능력. 오늘날 모바일 장치는 이미 가속도계, 자이로스코프, 나침반, 자력계, GPS 등과 같은 다양한 센서를 지원한다. 출력부는, 사용자 입력단말(101)의 적어도 하나의 사용자 인터페이스에 입력이 있는 경우, 증강현실 컨텐츠를 해당 입력으로 변환하여 사용자 입력단말(101)에서 인터랙티브 컨텐츠를 출력할 수 있다. 이에 따라, 사용자 입력 단말(101)은 사용자 인터페이스의 입력에 대응하는 인터랙티브 콘텐츠를 출력할 수 있다. 이때, 출력부는 사용자 입력단자(101)의 터치 디스플레이에 입력되는 터치 이벤트를 카메라를 통해 인식한다(카메라는 주변 환경을 캡쳐할 수 있으나, 환경 표시에 한함) 사용자 입력 단말(101)의 배경으로) 제스처 데이터 및 사용자 입력 단말(101)에 내장된 적어도 하나의 센서를 통해 감지된 센서 데이터 중 어느 하나. AR 콘텐츠는 이들 중 어느 하나 또는 적어도 하나의 조합에 의해 수정될 수 있다.

단일 센서를 기반으로 하는 모바일 AR 구현 메커니즘에 추가하여, 다른 센서를 결합하면 많은 애플리케이션이 보다 정확한 추적 결과를 달성할 수 있다. 센서 범주의 증가와 센서 기능의 지속적인 향상은 Web XR 응용 프로그램의 다양화를 위한 기반과 기회를 제공한다. 카메라가 실제 환경을 보고 있을 때 카메라가 움직이면 SLAM(Simultaneous Localization And Mapping) 알고리즘을 사용하여 실제 환경에 대한 포인트 클라우드 정보를 추출한다.

본 발명은 AR 콘텐츠의 효율적인 계산 가속화 및 강력한 렌더링을 위해 계산 집약적인 작업을 네트워크(103) 클라우드로 오프로드한다. 클라우드 서버(104)는 항상 더 강력한 컴퓨팅 기능을 가지고 있으며 Web XR 콘텐츠에 대한 성능 향상도 제공한다. 현재 모바일 네트워크(103) 4G/5G는 추적, 렌더링 및 상호 작용과 같은 실시간 작업을 지원한다.

사용자 입력 터미널(101) 출력 요구 터미널(102)에는 두 종류의 AR 콘텐츠가 있으며, 첫 번째는 모바일 장치의 모든 작업을 로컬에서 오프라인으로 실행하는 자체 포함 방법(200)이다. 이 방법(200)의 장점은 모바일 네트워크(103)에 덜 의존하므로 실시간 추적 성능이 추가 통신 지연에 의해 저하되지 않는다는 것이다. 그러나 모바일 장치의 비효율적인 컴퓨팅 기능은 치명적인 결함이 된다. 현재의 모바일 장치는 여전히 이러한 작업을 잘 수행할 수 없다.

본 발명에 사용되는 다른 방법(200)은 클라우드 서버(104)의 계산 및 저장 기능을 활용하는 계산 아웃소싱 방법(200)이며, 일반적으로 사용자 출력 요구 사항 터미널(102)에서 컴퓨팅 능력을 감소시키는 서버(104)의 더 강력한 컴퓨팅 능력으로 인해 앞서 언급한 자체 포함된 것보다 더 나은 사용자 경험을 제공할 수 있다. 그러나 이 방법(200)은 모바일 네트워크(103)에 대한 의존도가 높으므로 4G 및 5G 연결이 이 시스템(100)에 매우 적합하다. 새로운 5G 네트워크(103)는 1Gb/s의 데이터 속도와 밀리초의 종단 간 통신 지연을 달성하여 출력에서 AR 성능을 향상시킬 수 있지만 이에 국한되지 않는다. 다가오는 5G 네트워크(103)는 WebXR을 위한 효율적이고 강력한 플랫폼을 제공한다.

본 발명에서 언급된 플랫폼(도 2)은 최적화된 계산 아웃소싱을 위해 Django Framework에서 개발되었다. 사용된 백엔드 서버(104)는 Python, MySQL 및 Socket이다. 온라인 클라우드 서비스인 Cloudinary는 데이터를 저장하는 데 사용되었다. 증강 현실, 얼굴 인식, 자연어 처리, 게임, 비디오 처리, 3D 모델링, 실시간 렌더링 등은 일반적으로 리소스가 많이 필요하며 집약적인 계산과 높은 에너지 사용이 필요하다. 반면에 모바일 장치는 휴대형 특성으로 인해 클라우드 기반 오프로딩을 사용한 발명으로 모바일 코드 실행을 클라우드로 마이그레이션하여 모바일 애플리케이션 성능을 개선하고 에너지 소비를 줄일 수 있다. 컴퓨팅 오프로딩은 모바일 시스템(100)의 기능을 강화하는 기술이다. 웨어러블, 휴대전화, 센서 등 소형 장치. 이러한 개선은 전체 프로그램 또는 집중적인 작업을 클라우드에 있는 더 강력한 컴퓨터 또는 인근 인프라의 클라우드렛으로 마이그레이션하여 수행된다.

도 2에 언급된 Django 웹 애플리케이션은 일반적으로 이러한 각 단계를 처리하는 코드를 별도의 파일로 그룹화한다. a) URL: 단일 기능을 통해 모든 단일 URL의 요청을 처리하는 것이 가능하지만 훨씬 더 각 리소스를 처리하기 위해 별도의 보기 기능을 작성하기 위해 유지 관리가 가능하다. URL 매퍼는 요청 URL을 기반으로 HTTP 요청을 적절한 보기로 리디렉션하는데 사용된다. URL 매퍼는 URL에 나타나는 특정 패턴의 문자열이나 숫자를 일치시키고 이를 데이터로 보기 기능에 전달할 수도 있다. b) 보기: 보기는 HTTP 요청을 수신하고 HTTP 응답을 반환하는 요청 처리기 기능이다. 뷰는 모델을 통해 요청을 충족하는 데 필요한 데이터에 액세스하고 응답 형식을 템플릿에 위임한다. c) 모델: 모델은 애플리케이션 데이터의 구조를 정의하고 데이터베이스의 레코드를 관리(추가, 수정, 삭제) 및 쿼리하는 메커니즘을 제공하는 Python 개체이다. d) 템플릿: 템플릿은 실제 콘텐츠를 나타내는 데 사용되는 자리 표시자와 함께 파일(예: HTML 페이지)의 구조 또는 레이아웃을 정의하는 텍스트 파일이다. 보기는 HTML 템플릿을 사용하여 동적으로 HTML 페이지를 생성하여 모델의 데이터로 채울 수 있다. 템플릿을 사용하여 모든 유형의 파일 구조를 정의할 수 있다. HTML일 필요는 없다. Django는 XSS(Cross-Site Scripting), CSRF(Cross-Site Request Forgery), SQL Injection, Click Jacking 등 다양한 보안 공격을 차단하여 웹 환경의 보안을 더욱 강화한다. 데이터베이스 및 서버(104)에 대한 원치 않는 공격을 방지하기 위해 보안 문제가 해결된다. 제안된 프레임워크에서 시공간 데이터는 데이터 서버(104)에 저장되고 WebSocket을 통해 사용자 브라우저(114)로 전송된다.

또한, 증강 현실에서 사용되는 3차원 인터랙션 방법(200)은 다양하기 때문에 어느 하나에 한정되지 않으나, 본 발명의 일 실시예에 따르면 코어 렌더링 시스템(100)은 다음을 사용한다. Three.js, 렌더링 시스템(100)은 또한 그래픽 성능이 좋지 않은 장치에서 프레임 속도를 제어하거나 미세 조정하기 위해 동적 그림자, 동적 픽셀 밀도를 지원한다. 포비티드 렌더링은 주변 시야의 해상도를 줄여 렌더링 작업량을 줄인다.

본 발명에서 언급된 이 WebXR 플랫폼은 스마트폰, 태블릿, 랩톱, 데스크톱 컴퓨터 및 전체 룸 디스플레이를 포함하는 HMD 및 웹 브라우저(114)를 사용하여 출력 요구 사항 터미널(102)에서 VR 환경을 지원한다. 또한 WebXR Device API는 웹에서 VR과 AR을 모두 지원한다. 본 발명은 Three.js를 이용하여 플랫폼 갤러리에서 제공되는 VR 콘텐츠를 감상할 수 있을 뿐만 아니라 스마트폰 카메라와 그래픽 코딩 환경에서 파노라마 사진이나 360도 동영상으로 나만의 콘텐츠를 제작할 수 있다. 이러한 사전 설정된 3D 모델 및 시각적 코딩 기능은 사용자가 세상과 상호 작용하는 방식에 큰 영향을 미쳤다.

출력 유닛은 센서를 사용하여 하이브리드 기반 추적의 성능을 증가시킬 수 있다. 특징점 기반 추적 기술은 일반적인 추적 기술 중 하나로 카메라에서 들어오는 이미지를 사용하여 카메라의 자세와 위치를 추적한다. 특징점 기반 추적 기술은 카메라 움직임이 작은 경우 추적 성능을 어느 정도 보장하지만 카메라가 회전하거나 빠르게 움직이거나 움직이는 물체가 카메라 앞에 나타나면 추적이 실패하여 발생하는 특징 추출을 방해한다. 이 경우, 증강현실의 주요 문제점 중 하나인 그래픽의 정확한 증강 없이는 현실감이 저하되는 문제가 발생한다. 이를 보완하기 위해 스마트폰에 내장된 센서를 추가로 활용하는 것도 가능하다. 사용자 입력 단자(101)와 연동된 HMD(Head Mounted Display)가 감지되면, VR 제공 장치는 VR 콘텐츠를 사용자 입력 단자(101)로 스트리밍하고, 사용자 인터페이스를 통해 입력을 수신한다. 사용자 입력 단자(101). 사용자 입력단말(101)에서 인터랙티브 컨텐츠를 변환하여 출력할 수 있다. 이 경우, VR 제공부는 HMD에 의해 추적된 사용자의 동공 데이터 또는 사용자 입력 단자(101)와 연동되는 적어도 하나의 컨트롤러의 입력 데이터에 기초하여 인터랙티브 콘텐츠를 제공할 수 있다. 아이트래킹은 아이트래커에 의해 눈의 동공중심과 각막반사를 인식하여 눈의 움직임을 추적하는 방법(200)이다.

시선을 추적하는 시선 추적은 시선 또는 동공의 움직임을 측정하여 당신이 보고 있는 곳을 알아내는 방법(200)이다. 눈의 위치에서 시선을 추적하는 과정이다. 이때, 응시 시간, 응시 횟수, 응시 분포, 평균 동공 크기, 눈 깜박임 빈도 등에 따라 인터랙션이 이루어질 수 있다. 사용자 인터랙션에 따라 VR 콘텐츠가 제공될 수 있다. 문자 그대로 눈이 움직이는 방향에 해당한다. 이 경우 아이트래킹 외에도 사용자가 자이로 센서, 각축 등을 이용하여 움직일 때마다 해당 출력을 볼 수도 있다.

변환부는 제작된 AR 콘텐츠 및 VR 콘텐츠를 수신하여 HTML5 플랫폼에 대응하도록 변환할 수 있다. HTML5 기반 콘텐츠 스트리밍 서비스는 웹 브라우저(114) 기반 동영상을 재생할 수 있어야 한다. 다만, 지금까지 HTML5 기반의 웹 브라우저(114)가 지원하는 영상/음성 코덱 정보가 모두 다르기 때문에 코덱 규격이 결정될 때까지 각 웹 브라우저(114)가 지원하는 콘텐츠로 변환해야 한다.

이러한 변환 후에는 웹 브라우저(114)에서 이미지를 보는 것처럼 멀티미디어 컨텐츠를 재생할 수 있다. 이를 위해 HTML5에서 비디오 및 오디오 태그를 정의할 수 있다. HTML5 이전에는 웹 페이지에 동영상을 삽입하기 위해 외부 개체를 넣을 수 있는 개체 태그와 많은 매개 변수가 중복되었다. 한편, HTML5는 더 이상 플러그인을 사용하지 않고 비디오와 오디오를 웹의 하나의 요소로 포함하는 표준화된 방법(200)을 정의하여 웹 브라우저(114) 자체에서 콘텐츠를 직접 재생하고 표시하는 방법을 제공한다. 모든 콘텐츠는 일반적으로 상호 연관되는 비디오, 오디오 및 데이터와 같은 트랙으로 구성된다. 또한, 각 트랙은 비디오 종횡비 또는 오디오 언어 정보와 같은 메타데이터를 저장하고 컨테이너에는 비디오 제목 및 커버 디자인과 같은 메타데이터가 포함될 수도 있다.

데이터베이스 변환부는 적어도 하나의 사용자 입력 단말(101)로부터 AR 콘텐츠 및 VR 콘텐츠의 요청을 수신할 수 있고, AR 콘텐츠 및 VR 콘텐츠를 요청 단말에 매핑하여 AR 콘텐츠 및 VR 콘텐츠를 저장할 수 있다(도시되지 않음), 인터랙션 콘텐츠 서비스 제공 서버(104)는 이러한 이벤트를 수집 및 구성하고 주기적으로 보고를 제공하거나 데이터를 요청한 단말과 공유할 수 있다.

이하, 도 3 및 도 4를 예로 들어 도 2의 양방향 컨텐츠 서비스 제공 서버(104)의 구성에 따른 동작 과정을 상세히 설명한다. 다만, 실시예는 본 발명의 다양한 실시예 중 어느 하나일 뿐, 이에 한정되는 것은 아님은 자명하다.

도 3a는 본 발명의 일 실시예에 따른, 3D/AR/VR에서 대화식으로 디자인하기 위한 편집기 인터페이스를 예시한다. 그림 3a는 사용자가 적절한 3D 모델, 애니메이션, 로우 폴리곤 모델, 3D 환경, 이미지, 비디오, 3D 텍스트, 사운드, 입자 효과, 조명을 선택하고 외부 파일을 업로드할 수 있는 3D 편집기 창 작업 공간을 보여준다. 오픈 소스 또는 스케치팹에서 3D 모델을 가져온 다음 작업 공간으로 끌어다 놓는다. 기본적으로 작업 공간에는 사용자가 원치 않는 블록, 모델 또는 기타 불필요한 자산을 제거할 수 있는 휴지통이 포함되어 있다. 높은 수준의 기능은 다음과 같은 무료 재생 창에서 수행할 수 있다.

기능 1(F1). 이를 통해 사용자는 AR/VR 콘텐츠를 시각적으로 프로그래밍할 수 있다.

기능 2(F2). 여기에는 3D 모델, 3D 텍스트 엔진, 사운드, 기본 모델, 애니메이션, 로우 폴리, 환경, 입자 엔진, 이미지, 비디오, 파노라마, 레고 및 외부 업로드 3D 모델(예: GLTF, OBJ)을 포함한 여러 콘텐츠 유형이 포함될 수 있다(e.g., GLTF, OBJ).

기능 3(F3). 학습자는 AR/VR 콘텐츠와 관련 애니메이션을 모두 생성할 수 있다.

기능 4(F4). 이를 통해 사용자는 AR 및 VR 모드에서 시각적 인터페이스를 경험할 수 있다.

기능 5(F5). 사용자는 AR 및 VR 애플리케이션을 다운로드하지 않고도 공유 가능한 임베디드 링크/QR 코드를 통해 자신이 개발한 AR/VR 콘텐츠를 다른 사람과 공유할 수 있다.

도 3b는 본 발명의 일 실시예에 따른, 사용자 입력 터미널(101)에 로직을 제공하기 위한 코딩 인터페이스를 도시한다. 특히, 도 3b를 참조하면, Blockly.js는 블록 기반 VPL(Visual Programming Language) 및 편집기를 생성하는 데 사용된다. 블록을 끌어다 놓는 것과는 대조적으로 텍스트 기반 프로그래밍은 문자, 숫자 및 기호를 입력하는 프로세스이다. C, Javascript 및 Python과 같은 프로그래밍 언어에서 사용되는 텍스트 형식이라고도 하는 텍스트 기반 프로그래밍에서는 프로그래머가 프로그램을 컴파일하기 위해 형식 구문을 사용해야 한다. 본 발명에서 블록 모달리티는 사용자가 프로그램을 신속하게 생성, 컴파일 및 테스트하도록 권장한다.

이 창의 주요 값은 공통 작업을 위한 일부 기존 블록과 함께 사용자 정의 가능한 블록을 포함하는 것이다. 이 고유한 기능으로 인해 모든 텍스트 프로그래밍 언어로 코드를 생성할 수 있다. 그러나 새로운 블록 유형에는 각각 정의와 생성기가 필요하다. 정의는 생성기가 블록을 실행 코드로 변환하는 동안 텍스트, 색상, 모양 및 다른 블록과의 연결을 포함하여 블록의 모양과 동작 방식을 설명한다.

본 실시예는 3D 편집기 패널 작업 공간과 함께 시각적 인터페이스를 포함하는 다음 설명을 포함하지만 이에 국한되지 않는다.

애니메이션: 이 범주는 3D 웹 인터페이스, AR 및 VR 콘텐츠 시뮬레이션에서 이벤트를 정의하는 블록으로 구성될 수 있다. 상기 블록은 3D 모델, 환경에 대한 다중 작업을 제공하고 카메라, 텍스트 및 오디오 엔진과 동기화할 수 있다.

디스플레이 메시지: 디스플레이 메시지 블록은 시뮬레이션 또는 웹 인터페이스에 표시될 2D 및 3D 메시지를 정의할 수 있다. 상기 디스플레이 메시지는 텍스트 블록을 입력으로 사용하고 다양한 색상 옵션을 사용하여 사용자 논리 형식으로 출력을 표시할 수 있다.

변수: 해당 범주는 3D, AR 및 VR 시뮬레이션의 게임 논리 장면에 사용되는 사용자 정의 변수를 선언하고 초기화할 수 있다. QwikXR을 사용하면 다중 장면 스토리텔링 모드에서 임의의 3D 개체를 추가할 수 있으므로 각 개체는 클라우드 서버에 저장되고 고유한 ID가 있어야 한다.

도 3c는 본 발명의 일 실시예에 따른, 사용자 선택에 기초하여 3D/AR/VR에서 대화형을 생성하기 위한 장면 선택 인터페이스를 예시한다. 도 3c는 제어 단말 및 네트워크(103) 단말을 통해 요구 출력 요구 단말(102)에서 출력하는 장면의 사용자 입력 단말(101) 선택을 설명한다. 사용자는 3D, AR, VR 장면을 선택하고 편집기 창의 인터페이스를 초기화할 수 있습니다. 감지 유닛, 제어 유닛(105) 및 변환기는 사용자 선택의 각각의 모드에서 콘텐츠를 출력한다.

도 3d는 본 발명의 일 실시예에 따른 사용자 인증 단말 인터페이스를 도시한다. 도 3d는 콘텐츠 작성자와 사용자가 배포된 인스턴스에서 자신의 컬렉션 및 장면에 액세스, 관리 및 수정할 수 있도록 하는 내장 인증 시스템(100)을 제공하는 프레임워크를 보여준다. 프레임워크는 사용자, 편집자 또는 콘텐츠 작성자가 인증을 받아 3D 장면 또는 시뮬레이션을 쉽게 게시하고 관리할 수 있는 내장형 경량의 반응형 백엔드를 제공한다.

도 3e는 본 발명의 일 실시예에 따른 공개 랜딩 페이지 갤러리를 도시한다. 그림 3e는 그래픽 코드 정보의 기능을 가진 AR, VR, 3D 콘텐츠에 직접 접근할 수 있는 공개 랜딩 갤러리 웹 페이지를 보여준다. 토큰 기반 인증을 통해 콘텐츠 액세스, 수정 또는 기타 작업과 관련된 요청을 세밀하게 제어할 수 있다. 또한 인증된 사용자가 갤러리의 도구 키트 3D 자산에서 쉽게 온라인 장면을 만들 수 있다. 그런 다음 인증된 사용자는 공개 액세스가 있는 기본 랜딩 페이지에 자신의 장면을 게시할 수 있으므로 원격 사용자는 인증된 사용자가 각각 선택한 AR 및 VR 장면을 기반으로 모든 장치에서 3D 장면을 사용할 수 있다. 방문 페이지는 또한 검색어 또는 키워드로 공개 장면을 필터링하는 검색 상자를 제공하여 사용자 지정 갤러리(예: 컬렉션 코딩, 역사, 지리, 과학, 화학, 음악, STEM 등)를 만드는 데 매우 유용하다.

도 3f는 본 발명의 실시예에 따른, 혁신에 의해 개발된 가상 현실(VR) 장면의 생성을 예시한다. 도 3f에서는 각 프레임이 하나의 장면과 같이 순차적으로 구성되어 있으나, 이는 VR을 위한 각 장면의 실시예이다. 이러한 방식으로 캐릭터/모델과 배경이 결합되어 HMD에서 출력될 수 있으며 그림 3e와 같은 컨텐츠는 사용자 선택 입력에 따라 마커가 있거나 마커가 없는 AR에 출력되고 화면에 출력된다. 증강 현실 카메라 화면. 가상 객체를 렌더링하기 위해 Three.js 라이브러리를 사용한다. 따라서 실행 코드는 Three.js JavaScript에 기인한다. Three.js의 아키텍처는 플러그인을 사용하지 않고 호환되는 모든 웹 브라우저(114) 내에서 대화형 3D 그래픽을 렌더링하는 데 사용되는 WebGL을 기반으로 한다. WebGL은 다른 웹 표준과 완전히 통합되어 웹 페이지 캔버스의 일부로 물리학 및 이미지 처리 및 효과의 GPU 가속 사용을 허용한다. 반면 AR.js를 사용하면 개발자가 이미지 및 패턴을 감지하고, 공간 위치를 추정하고, 감지된 이미지/패턴에 가상 객체를 중첩할 수 있다.

도 4는 실시예에 따라 성능에 기초하여 피드백을 제공하기 위해 CNN 알고리즘을 사용하는 AI 데이터 구동 기술로 사용자 콘텐츠가 기록되고 관리자가 실시간으로 사용자 응답을 평가하는 것을 도시한다. 일 실시예에서, 열 지도는 논리적 사고, 창의성, 분석적 사고, 계산 능력, 코딩 능력, 스토리텔링, 및 문제 해결 능력을 포함하나 이에 제한되지 않는 인자에 기초하여 차례로 사용자 성능에 기초하여 생성될 수 있다.

도 5는 본 발명의 일 실시예에 따른 HTML5 웹 환경에 기반한 VR 및 AR 양방향 콘텐츠 서비스를 제공하는 방법(200)을 도시한 흐름도이다. 도 5는 본 발명의 일 실시예에 따른 HTML5 WebXR 환경 기반의 3D, VR 및 AR 양방향 코딩 플랫폼 서비스 제공 방법(200)을 나타내는 동작 흐름도이다. 이하, 도 5를 참조하여 각 구성요소 사이에서 데이터가 송수신되는 과정의 예를 설명하지만, 본 출원은 이러한 실시예에 한정되지 않으며, 도 5에 도시된 데이터는 다양한 실시예에 따른다. 상술한 실시예에서 도 5를 참조하면 도시된 데이터 송수신 과정이 변경될 수 있음은 당업자에게 자명하다. 이때, 양방향 컨텐츠 서비스 제공 서버(104)가 사용자 입력단말(101)로부터 양방향 컨텐츠 서비스를 제공하는 웹페이지에 접속하면, 사용자 입력단말(101)의 접속이 감지된다.

특히, 방법(200)은 HTML5 웹 환경을 기반으로 하는 WebXR 기반 VR 및 AR 대화형 콘텐츠에 그래픽 코딩 인터페이스를 제공할 수 있으며, 방법(200)은 사용자 입력에 의해 웹 페이지에 액세스하는 단계를 포함한다. 지리학적 코딩 환경과 함께 3D/AR/VR과 같은 사용자 선택에 기초한 대화형 콘텐츠를 제공하는 웹 페이지(101); 3D 자산 및 애니메이션이 있는 자유 플레이 장면에 매핑된 코딩 명령에 따라 기능을 수행하도록 제어 및 코딩 블록 목록을 출력하는 단계; 및 상기 출력 요청 단말로부터 접속된 웹 페이지로부터 출력될 3D to AR/VR 컨텐츠를 검출, 센싱, 변환 및 렌더링하는 단계를 포함하는 것을 특징으로 하는 방법. 대화식 시뮬레이션을 허용하는 서버(104)는 사용자 입력 단자(101)의 인터페이스에서 AR, VR 또는 3D 중 임의의 모드에서 사용자 선택이 존재할 때 출력 유닛, 모바일 디바이스, 컴퓨터 웹 시스템(100), 스마트 TV 브라우저(114), AR 안경을 포함한다.

또한, 방법(200)은 웹 브라우저(114) 내에서 AR 렌더링을 가능하게 하는 이미지 인식을 통합함으로써 사용자 입력 터미널(101)로부터 출력될 AR 콘텐츠를 출력 관리자 요청 터미널에 의해 관리하는 단계를 포함한다.

다음으로, 방법(200)은 정의된 그래픽 블록 및 3D 자산 블록을 갖는 향상된 그래픽 코딩 환경 내에 정의된 도구 모음 영역을 제공하는 단계; 향상된 그래픽 코딩 환경 내에서 정의된 무료 플레이 작업 공간 영역을 제공하고, 시뮬레이션을 형성하기 위해 함께 하나 이상의 그래픽 블록과 3D 자산 모델/환경의 연결을 허용하는 무료 플레이 영역; 및 툴바 영역으로부터 하나 이상의 그래픽 블록 및 3D 자산을 드래그하여 하나 이상의 그래픽 블록 및 3D 자산을 기존 프로그램 시뮬레이션 또는 콘텐츠에 추가하는 단계를 포함한다.

또한, 방법(200)은 향상된 그래픽 코딩 환경에 의해 3D 모델, 환경, 텍스처, 입자 효과, 텍스트, 오디오에서의 자유 공간 작업을 자동으로 검출하는 단계; 도구 모음 영역을 블록 드래그 앤 드롭다운 도구 모음으로 자동 변경한다. 방법(200)은 사용자 입력 단자(101)와 연결된 HMD(Head Mounted Display)가 검출될 때 사용자 입력 단자(101)에 VR 시뮬레이션을 재생하는 단계; 및 상기 사용자 입력단말기(101)의 컨텐츠 종류를 초기화하면서, 상기 사용자 인터페이스를 통해 가상현실로 사용자 선택이 존재하는 경우, 3차원 시뮬레이션에서 가상현실 컨텐츠를 허용, 토글 및 변환하는 단계를 포함한다.

본 개시내용의 실시예에 따르면, 방법(200)은 HMD에 의한 센서 기반 사용자의 눈 데이터 세트 또는 서버(104) 및 사용자 입력단말(101)과 연결된다.

도면 및 전술한 설명은 실시예의 예를 제공합니다. 당업자는 설명된 요소 중 하나 이상이 단일 기능 요소로 잘 결합될 수 있음을 이해할 것이다. 또는 특정 요소가 여러 기능 요소로 분할될 수 있다. 한 실시예의 요소가 다른 실시예에 추가될 수 있다. 예를 들어, 여기에 설명된 프로세스의 순서는 변경될 수 있으며 여기에 설명된 방식으로 제한되지 않는다. 또한 모든 흐름도의 작업은 표시된 순서대로 구현할 필요가 없다. 모든 행위를 반드시 수행할 필요도 없다. 또한, 다른 행위에 의존하지 않는 행위는 다른 행위와 병행하여 행할 수 있다. 실시예의 범위는 이들 특정 예에 의해 제한되지 않는다. 사양에 명시적으로 명시되어 있는지 여부에 관계없이 구조, 치수 및 재료 사용의 차이와 같은 수많은 변형이 가능하다.

Claims (11)

1. 그래픽 코딩 인터페이스를 갖는 HTML5 웹 환경을 기반으로 하는 WebXR 기반 VR 및 AR 대화형 콘텐츠를 제공하는 확장된 현실을 생성하기 위한 시스템(100)에 있어서,
   상기 시스템(100)은,
   HTML5 웹 환경 기반 VR 및 AR 인터랙션 코딩 서비스 관련 웹 페이지, 프로그램 또는 시뮬레이션을 이용하여 AR 콘텐츠, VR 콘텐츠, 3D 콘텐츠, 360도 콘텐츠를 출력하도록 구성되며, 한 명 이상의 사용자가 입력을 제공할 수 있도록 하며, 네트워크(103)에 연결된 하나 이상의 사용자 입력 터미널(101);
   하나 이상의 사용자에게 하나 이상의 대화형 콘텐츠 서비스를 제공하도록 구성된 서버(104); 및
   네트워크(103)를 통해 서버(104)에 접속하고, 웹 브라우저(114)에서 스크립트를 실행하여 제작된 AR 콘텐츠 또는 VR 콘텐츠를 서버(104)에 업로드하도록 구성된 하나 이상의 출력 요청 단말(102)을 포함하며,
   상기 적어도 하나의 사용자 입력 터미널(101)은 스마트폰, 스마트패드, 랩탑, 데스크탑, HMD 및 컨트롤러를 포함하는 하나 이상의 출력 주변 장치와 연동하는 터미널이고,
   상기 서버(104)는,
   - 하나 이상의 데이터베이스;
   - 적어도 하나의 콘텐츠 개발 모듈;
   - 상기 사용자 입력 단자(101)에 대한 액세스를 감지하도록 구성된 적어도 하나의 감지 및 감지 모듈;
   - 상기 사용자 입력 터미널(101)의 적어도 하나의 사용자 인터페이스로 입력하며, 상기 사용자 입력 터미널(101)에서 액세스된 웹 페이지에서 사용자 지정, AR, VR의 출력 콘텐츠를 토글하도록 구성된 코드 입력 정보 획득 유닛을 포함하며, 상기 사용자 입력 터미널(101)에서 접속할 수 있는 코드입력정보, 코드실행기를 포함하는 웹페이지에서 AR 및 VR컨텐츠를 출력하도록 제어하는 제어 모듈(105);
   - 제작된 AR 콘텐츠 및 VR 콘텐츠를 수신하여 해당 HTML5 플랫폼으로 변환하도록 구성된 콘텐츠 변환 모듈;
   - 출력 노드; 및
   - 접속된 웹 페이지로부터 AR 콘텐츠 및 VR 콘텐츠를 출력하기 위한 사용자 입력 단말(101)을 관리하도록 구성된 적어도 하나의 출력 관리자 요청 단말을 포함하는 것을 특징으로 하는 확장된 현실을 생성하기 위한 시스템.
   
2. 제1 항에 있어서,
   상기 사용자 입력 단말(101)은 복수의 웹 브라우저(114)를 지원하는 랩탑, 데스크탑, 휴대폰 및 태블릿 중 하나 이상인 것을 특징으로 하는 확장된 현실을 생성하기 위한 시스템.
   
3. 제1 항에 있어서,
   하나 이상의 인터랙티브 콘텐츠 서비스는 HTML5 웹 그래픽 코딩 환경 기반 VR 및 AR 인터랙티브 서비스 웹 페이지, 시뮬레이터, 프로그램 또는 애플리케이션, 3D, AR 또는 VR로 사용자 입력 단자(101)에 입력 선택을 제공하는 것에 대응하는 인터랙션을 제공하고, 적어도 하나의 출력 요청 단말로부터 AR 콘텐츠 또는 VR 콘텐츠 요청을 업로드 및 전송하는 단계를 포함하는 것을 특징으로 하는 확장된 현실을 생성하기 위한 시스템.
   
4. 제1 항에 있어서,
   상기 네트워크(103)는 LTE(Long Term Evolution) 네트워크(103), 5GPP(5th Generation Partnership Project) 네트워크(103), LAN(Local Area Network)(103), Wireless LAN (Wireless Local Area Network) (103), WAN (Wide Area Network) (103), and PAN (Personal Area Network) (103) 중 적어도 하나를 포함하는 것을 특징으로 하는 확장된 현실을 생성하기 위한 시스템.
   
5. 제1 항에 있어서,
   상기 웹 페이지는 사진, 비디오 및 음악을 재생하는 기능 중 하나 이상을 포함하는 HTML5 기반 웹 브라우저 페이지인 것을 특징으로 하는 확장된 현실을 생성하기 위한 시스템.
   
   포함하며, 상기 사용자 입력 터미널(101)에서 접속할 수 있는 코드입력정보, 코드실행기를 포함하는 웹페이지에서 AR 및 VR컨텐츠를 출력하도록 제어하는
   
   
6. 그래픽 코딩 인터페이스를 갖는 HTML5 웹 환경을 기반으로 하는 WebXR 기반 VR 및 AR 대화형 콘텐츠를 제공하는 확장된 현실을 생성하기 위한 방법에 있어서,
   사용자 입력 단말(101)이 3D/AR/VR과 같은 사용자 선택에 기초한 양방향 콘텐츠를 제공하는 웹 페이지에 지리적 코딩 환경을 갖는 웹 페이지에 액세스하는 단계(201);
   3D 자산 및 애니메이션이 있는 무료 플레이 장면과 매핑된 코딩 명령에 따라 기능을 수행하도록 제어 및 코딩 블록 목록을 출력하는 단계(202);
   출력 요청 단말로부터 액세스된 웹 페이지로부터 출력될 3D에서 AR/VR로의 콘텐츠를 검출, 감지, 변환 및 렌더링하는 단계(203);
   서버(204)를 허용하는 대화식 시뮬레이션은 사용자 입력 단자의 인터페이스에서 사용자 선택이 AR, VR 또는 3D 모드 중 임의의 모드에서 존재할 때 (101) 출력 유닛, 모바일 장치, 컴퓨터 웹 시스템(100), 스마트 TV 브라우저(114), AR 안경을 포함하는 것을 특징으로 하는 확장된 현실을 생성하기 위한 방법.
   
7. 제6항에 있어서,
   웹 브라우저(114) 내에서 AR 렌더링이 가능하도록 이미지 인식을 통합하여 출력 관리자 요청 터미널(101)에서 출력될 AR 콘텐츠를 관리하는 단계를 포함하는 것을 특징으로 하는 확장된 현실을 생성하기 위한 방법.
   
8. 제6항에 있어서,
   향상된 그래픽 코딩 환경 내에서 정의된 툴바 영역을 제공하고, 정의된 그래픽 블록 및 3D 자산 블록을 갖는 툴바 영역을 제공하는 단계;
   향상된 그래픽 코딩 환경 내에서 정의된 무료 플레이 작업 공간 영역을 제공하고, 시뮬레이션을 형성하기 위해 함께 하나 이상의 그래픽 블록과 3D 자산 모델/환경의 연결을 허용하는 무료 플레이 영역을 제공하는 단계; 및
   하나 이상의 그래픽 블록 및 3D 자산을 기존 프로그램 시뮬레이션 또는 콘텐츠에 추가하도록 도구 모음 영역에서 하나 이상의 그래픽 블록 및 3D 자산을 끌어오는 단계를 포함하는 것을 특징으로 하는 확장된 현실을 생성하기 위한 방법.
   
9. 제6항에 있어서,
   향상된 그래픽 코딩 환경에 의해 3D 모델, 환경, 텍스처, 입자 효과, 텍스트, 오디오의 자유 공간 작업을 자동으로 감지하는 단계; 및
   도구 모음 영역을 블록 드래그 앤 드롭다운 도구 모음으로 자동 변경하는 단계를 포함하는 것을 특징으로 하는 확장된 현실을 생성하기 위한 방법.
   
10. 제6항에 있어서,
    상기 사용자 입력단자(101)에 연결된 HMD(Head Mounted Display)가 감지되면, 상기 사용자 입력단자(101)에 VR 시뮬레이션을 재생하는 단계; 및
    사용자 입력단말기(101)의 컨텐츠 유형을 초기화하면서 사용자 인터페이스를 통해 사용자 선택이 VR로 존재하는 경우 3D 시뮬레이션에서 VR 컨텐츠를 허용, 토글 및 변환하는 단계를 포함하는 것을 특징으로 하는 확장된 현실을 생성하기 위한 방법.
    
11. 제6항에 있어서,
    HMD에 의한 센서 기반 사용자의 눈 데이터 세트 또는 서버(104)에 있는 적어도 제어 모듈(105)의 입력 데이터에 기반하고 사용자 입력 단말(101)과 연결된 대화형 시뮬레이션을 제공하는 단계를 포함하는 것을 특징으로 하는 확장된 현실을 생성하기 위한 방법.