Search

KR-102960500-B1 - Cloud websocket based networking engine and system providing 3D model online using the same

KR102960500B1KR 102960500 B1KR102960500 B1KR 102960500B1KR-102960500-B1

Abstract

본 발명은 클라우드 웹 소켓 기반 네트워킹 엔진 및 이를 이용하여 온라인 상에서 3D 모델을 제공하는 시스템에 관한 것으로, 본 발명의 일양태에 따르면, HTML5 WebGL기반의 모바일 어플리케이션의 빠른 출력을 위한 그래픽 모델 구조를 갖는 클라우드 웹 소켓 기반 네트워킹 그래픽 엔진이 제공되고, 이 네트워크 그래픽 엔진은, 웹브라우저상의 애플리케이션에서 이용되는 객체; 상기 객체가 사용하는 리소스의 논리적 객체인 리소스 객체; 상기 리소스 객체로부터의 논리적 객체를 출력하는 GL 래퍼인 렌더러; 상기 렌더러 내에 존재하며 컨텐츠 로직에서 요청한 렌더링데이터를 쌓는 렌더러 큐; 상기 렌더러 큐를 가공한 렌더링 데이터를 버퍼링하는 렌더 버퍼; 상기 렌더러로부터 렌더링 데이터를 취출하여 스키닝 쉐이더, 폴리곤 쉐이더, 노멀 쉐이더 및 텍스트 쉐이더로 출력하는 GL 쉐이더 엔진인 GLSL; 상기 GLSL로부터의 렌더링 데이터에 대하여 스프라이트를 1 드로우 콜 하기 위해 각 페이스의 변환 값을 주는 스키닝 쉐이더; 상기 GLSL로부터 출력되는 렌더링 데이터의 폴리곤을 출력하는 폴리곤 쉐이더; 상기 GLSL로부터 출력되는 렌더링 데이터의 일반 2D 단일 스프라이트 렌더링 하는 노멀 쉐이더; 및 GLSL로부터 출력되는 렌더링 데이터의 텍스트를 출력하는 텍스트 쉐이더(190);를 포함한다.

Inventors

  • 백재성

Assignees

  • (주)디지엔터테인먼트

Dates

Publication Date
20260506
Application Date
20230518

Claims (3)

  1. HTML5 WebGL 기반의 모바일 어플리케이션의 빠른 출력을 위한 그래픽 모델 구조를 갖는 클라우드 웹 소켓 기반 네트워킹 그래픽 엔진에 있어서, 웹브라우저상의 애플리케이션에서 이용되는 객체; 상기 객체가 사용하는 리소스의 논리적 객체인 리소스 객체; 상기 리소스 객체로부터의 논리적 객체를 출력하는 GL 래퍼인 렌더러; 상기 렌더러 내에 존재하며 컨텐츠 로직에서 요청한 렌더링 데이터를 쌓는 렌더러 큐; 상기 렌더러 큐를 가공한 렌더링 데이터를 버퍼링하는 렌더 버퍼; 상기 렌더러로부터 렌더링 데이터를 취출하여 스키닝 쉐이더, 폴리곤 쉐이더, 노멀 쉐이더 및 텍스트 쉐이더로 출력하는 GL 쉐이더 엔진인 GLSL; 상기 GLSL로부터의 렌더링 데이터에 대하여 스프라이트를 1 드로우 콜 하기 위해 각 페이스의 변환 값을 주는 스키닝 쉐이더; 상기 GLSL로부터 출력되는 렌더링 데이터의 폴리곤을 출력하는 폴리곤 쉐이더; 상기 GLSL로부터 출력되는 렌더링 데이터의 일반 2D 단일 스프라이트를 렌더링하는 노멀 쉐이더; 상기 GLSL로부터 출력되는 렌더링 데이터의 텍스트를 출력하는 텍스트 쉐이더; 및 상기 스키닝 쉐이더, 폴리곤 쉐이더, 노멀 쉐이더 및 텍스트 쉐이더로부터 출력되는 데이터를 그래픽 처리하는 GPU;를 포함하며, 상기 엔진은 클라우드 서버와의 웹 소켓 기반 양방향 통신을 통해 렌더링 데이터 및 3D 모델 정보를 실시간으로 송수신함으로써 사용자의 웹브라우저에서 별도의 플러그인 설치 없이 3D 모델을 실시간으로 제공할 수 있고, 상기 GPU는 상기 쉐이더들로부터 출력된 데이터에 대하여 스프라이트, 폴리곤, 2D 단일 스프라이트 및 텍스트 데이터를 통합적으로 그래픽 처리하여, WebGL 환경에서 3D 모델의 빠른 출력 및 실시간 갱신을 지원함을 특징으로 하는 HTML5 WebGL 기반의 모바일 어플리케이션의 빠른 출력을 위한 그래픽 모델 구조를 갖는 클라우드 웹 소켓 기반 네트워킹 그래픽 엔진.
  2. 삭제
  3. 삭제

Description

클라우드 웹 소켓 기반 네트워킹 엔진 및 이를 이용하여 온라인 상에서 3D 모델을 제공하는 시스템{Cloud websocket based networking engine and system providing 3D model online using the same} 본 발명은 클라우드 웹 소켓 기반 네트워킹 엔진 및 이를 이용하여 온라인 상에서 3D 모델을 제공하는 시스템에 관한 것으로 보다 구체적으로는 WebGL 기술을 이용하여 웹브라우저에서 추가 프로그램(액티브 X 등)의 설치가 필요없이 HTML5로 3D 서비스를 제공할 있는 클라우드 웹 소켓 기반 네트워킹 엔진 및 이를 이용하여 온라인 상에서 3D 모델을 제공하는 시스템에 관한 것이다. 코로나 19 발생으로 다수의 사람이 모이는 행위 자체가 불가능해지고 있으며, 이로 인해 단말장치 등을 이용?비대면 애플리케이션의 도입이 시급해지고 있다. 특히 3D 모델링은 교육, 건축, 인테리어, 컴퓨터 그래픽 등 다양하고 폭넓은 산업분야에서 사용되어 오면서 현실에 가장 가까운 가상의 결과물을 미리 구현해 볼 수 있다는 점에서 각광을 받고 있다. 대중들도 2차원적인 2D보다는 3차원적인 3D 콘텐츠에 관심이 높아지고 있으며, 더불어 3D 인터페이스, 3D LED TV 출시 등 실생활 깊숙이 3D 열풍이 불고 있다. 하나의 3D 장면이 완성도 높게 구현되기 위해서는 시점에 따라 공간감과 입체감을 충분히 구현해 줄 수 있는 다수의 3D 모델이 잘 조합되어 있어야 한다. 그러나 이와 같은 3D 모델링을 사용자의 단말에 제공하기 위해서는 사용자 단말에서 3D 모델링을 구현하기 위한 애플리케이션 또는 프로그램이 설치되어야만 하고, 이는 컴퓨터와 같은 단말장치의 조작이 미숙한 사람들에게는 매우 복잡하고 어려운 과정에 해당하여 메타버스를 포함한 3D 컨텐츠로의 접근성을 곤란하게 하는 요인으로 작용한다. 도 1은 본 발명에 따른 HTML5 WebGL기반의 네트워킹 그래픽 모델 구조와 출력을 위한 어플리케이션의 그래픽 모델 구조를 설명하기 위한 블록 구성도이고, 도 2는 본 발명에 따른 HTML5 WebGL기반의 네트워킹 그래픽 모델 구조와 출력을 위한 어플리케이션의 그래픽 모델 구조와 출력방법을 설명하기 위한 흐름도이고, 도 3은 본 발명의 실시예에 따른 온라인 상에서 3D모델을 제공하는 시스템을 UI(user interface)로 표시하는 화면의 예시도이고, 도 4은 본 발명의 실시예에 따른 온라인 상에서 3D모델을 제공하는 시스템을 UI(user interface)로 표시하는 화면의 다른 예시도이고, 도 5는 본 발명의 일 실시예에 따른 온라인 상에서 3D모델을 제공하는 시스템에서 웹사이트의 화면을 나타내는 예시도이고, 도 6는 도 5의 웹사이트에서 선택된 3D모델을 제공하는 화면을 나타내는 예시도이다. 본 명세서에 개시되어 있는 본 발명의 개념에 따른 실시예들에 대해서 특정한 구조적 또는 기능적 설명들은 단지 본 발명의 개념에 따른 실시예들을 설명하기 위한 목적으로 예시된 것으로서, 본 발명의 개념에 따른 실시예들은 다양한 형태로 실시될 수 있으며 본 명세서에 설명된 실시예들에 한정되지 않는다. 본 발명의 개념에 따른 실시예들은 다양한 변경들을 가할 수 있고 여러 가지 형태들을 가질 수 있으므로 실시예들을 도면에 예시하고 본 명세서에 상세하게 설명하고자 한다. 그러나, 이는 본 발명의 개념에 따른 실시예들을 특정한 개시형태들에 대해 한정하려는 것이 아니며, 본 발명의 사상 및 기술 범위에 포함되는 변경, 균등물, 또는 대체물을 포함한다. 이하, 실시예들을 첨부된 도면을 참조하여 상세하게 설명한다. 그러나, 특허출원의 범위가 이러한 실시예들에 의해 제한되거나 한정되는 것은 아니다. 이하에서는, 본 발명에 따른 클라우드 웹 소켓 기반 네트워킹 엔진(또는 웹소켓 통신)에 대해 설명한다. 웹 소켓(Web Socket)은 두 프로그램간의 메시지를 교환하기 위한 통신방법 중 하나이다. 웹 소켓은 W3C와 IETF에 의해 자리잡은 표준 프로토콜 중 하나이기 때문에, 현재 인터넷을 사용하는 환경에서 특히 많이 사용되고 있습니다. 예를 들면, 크롬(Chrome)이나 엣지(Edge) 등의 웹 브라우저 같은 경우에 웹 소켓 프로토콜을 지원한다. 웹소켓에서는 서버와 브라우저 사이에 양방향 소통이 가능하다. 브라우저는 서버가 직접 보내는 데이터를 받아들일 수 있고, 사용자가 다른 웹사이트로 이동하지 않아도 최신 데이터가 적용된 웹을 볼 수 있게 한다. 도 1는 본 발명에 따른 웹(HTML5 WebGL) 기반의 네트워킹 엔진의 구조와 출력을 위한 어플리케이션의 그래픽 모델 구조를 설명하기 위한 블록 구성도이다. WebGL이란 OpenGL을 사용한 HTML5 의 새로 추가된 기능으로, WebGL을 이용하여 웹 브라우져 화면상에 프레임을 이용한 렌더링을 지원함으로써 매초에 일정 장수만큼 지웠다 그렸다 하는 방식으로 기존의 RPG 게임을 제작하듯이 제작이 가능해진다. 본 발명에 따른 HTML5 WebGL 기반의 통신 모델 구조와 출력을 위한 모바일 어플리케이션의 구조는 도 1에 나타낸 바와 같이, 객체(100)와, 리소스 객체(110), 렌더러(120), 렌더러 큐(130), 렌더 버퍼(140), GLSL(150), 스키닝 쉐이더(160), 폴리곤 쉐이더(170), 노멀 쉐이더(180), 텍스트 쉐이더(190) 및 GPU(195)로 구성된다. 여기서, 객체(100)는 웹상에 표시되는 애플리케이션서 실제 사용되는 객체를 의미한다. 리소스 객체(110)는 객체(100)가 사용하는 리소스의 논리적 객체이다. 렌더러(120)는 리소스의 논리적 객체(110)를 출력하는 GL 래퍼이다. 렌더러 큐(130)는 렌더러(120) 내에 존재하며 컨텐츠 로직에서부터 요청한 렌더링데이터를 쌓는다. 렌더 버퍼(140)는 렌더러 큐(130)를 가공한 GL에 직접 전달되는 렌더링 데이터를 버퍼링한다. GLSL(150)는 렌더러(120)로부터 렌더링 데이터를 취출하여 스키닝 쉐이더(160), 폴리곤 쉐이더(170), 노멀 쉐이더(180) 및 텍스트 쉐이더(190)로 출력하는 GL 쉐이더 엔진이다. 스키닝 쉐이더(160)는 GLSL(150)로부터의 렌더링 데이터에 대하여 스프라이트를 1 드로우 콜 하기 위해 각 페이스의 변환 값을 준다. 폴리곤 쉐이더(170)는 GLSL(150)로부터 출력되는 렌더링 데이터의 폴리곤을 출력한다. 노멀 쉐이더(180)는 GLSL(150)로부터 출력되는 렌더링 데이터의 일반 2D 단일 스프라이트 렌더링을 한다. 텍스트 쉐이더(190)는 GLSL(150)로부터 출력되는 렌더링 데이터의 텍스트를 출력한다. GPU(195)는 스키닝 쉐이더(160), 폴리곤 쉐이더(170), 노멀 쉐이더(180) 및 텍스트 쉐이더(190)로부터 출력되는데이터를 그래픽 처리한다. 도 2는 본 발명에 따른 HTML5 WebGL 기반의 통신 엔진의 빠른 출력을 위한 모델 구조와 출력 방법을 설명하기 위한 흐름도이다. 본 발명에 따른 HTML5 WebGL 기반의 통신 엔진의 빠른 출력을 위한 모델 구조와 출력 방법은 도 2에 나타낸 바와 같이, 웹브라우저 상의 애플리케이션에서 실제 사용되는 객체(100)가 사용하는 리소스의 논리적 객체인 리소스 객체(110)로부터 렌더러(120)가 논리적 객체를 출력한다(S100). 리소스의 논리적 객체(110)를 출력하는 GL 래퍼인 렌더러(120)내에 존재하는 렌더러 큐(130)는 컨텐츠 로직에서부터 요청한 렌더링데이터를 쌓는다 그리고 렌더 버퍼(140)는 렌더러 큐(130)를 가공한 GL에 직접 전달되는 렌더링 데이터를 버퍼링한다(S110). 그 다음 GLSL(150)는 렌더러(120)로부터 렌더링 데이터를 취출하여 스키닝 쉐이더(160), 폴리곤 쉐이더(170), 노멀 쉐이더(180) 및 텍스트 쉐이더(190)로 출력한다(S120). 스키닝 쉐이더(160)는 GLSL(150)로부터의 렌더링 데이터에 대하여 스프라이트를 1 드로우 콜 하기 위해 각 페이스의 변환 값을 주고, 폴리곤 쉐이더(170)는 GLSL(150)로부터 출력되는 렌더링 데이터의 폴리곤을 출력하며, 노멀 쉐이더(180)는 GLSL(150)로부터 출력되는 렌더링 데이터의 일반 2D 단일 스프라이트 렌더링을 하고, 텍스트 쉐이더(190)는 GLSL(150)로부터 출력되는 렌더링 데이터의 텍스트를 각각 GPU(195)로 출력한다(S130). GPU(195)는 스키닝 쉐이더(160), 폴리곤 쉐이더(170), 노멀 쉐이더(180) 및 텍스트 쉐이더(190)로부터 출력되는 데이터를 취합하여 그래픽 처리한다(S140). 도 3은 전술한 바와 같은 웹소켓 기반의 통신 엔진에 의해 온라인 상에서 3D모델을 제공하는 시스템(10)을 나타내는 도면이다. 본 발명의 일 실시예에서 3D 모델링 파일 변환 장치(200)는 프로세서와 메모리를 포함하는 컴퓨팅 장치로서, 일예로 태블릿 PC와 같은 이동 단말기일 수 있다. 한편, 3D 모델링 파일 변환 장치(200)는 이동 단말기로 제한되지 않고, 프로세서와 메모리를 포함하는 한 임의의 컴퓨터(예컨대, 개인용 컴퓨터)일 수도 있다. 또한, 도시하지 않았지만 3D 모델링 파일 변환 장치(200)는 정보 입력을 위한 입력 모듈, 정보를 출력하기 위한 출력 모듈 및 정보를 저장하기 위한 저장 모듈 및 정보를 외부로 전송하기 위한 통신 모듈을 포함할 수 있다. 입력 모듈은 데이터를 입력받는 입력 장치로서, 일 예로 터치 패드, 키보드, 마우스, 터치 펜 등을 포함할 수 있다. 출력 모듈은 데이터를 화면에 표시하는 표시 장치로서, 일 예로 LCD 등을 포함할 수 있다. 한편, 입력 모듈이 터치 패드이고 이 터치 패드가 출력 모듈과 결합된다면, 입력 모듈과 출력 모듈은 터치 스크린을 구성할 수 있다. 저장 모듈은 파일 또는 데이터 처리 프로그램 등의 데이터를 저장하는 저장 장치로서, 일 예로 HDD, SSD, RAM, ROM, 캐쉬, 레지스터 등을 포함할 수 있다. 통신 모듈은 데이터를 송수신하는 통신 장치로서, 일 예로 무선 데이터 통신 모듈, 무선 랜 모듈, 근거리 통신 모듈 등을 포함할 수 있으나, 이에 제한되지 않고 유선 데이터 통신 모듈 등을 포함할 수도 있다. 3D 모델링 파일