Code Less, Create More!

Simple but useful code snippets for 3D Graphic Developers

반응형

분류 전체보기 22

Babylon.js를 시작하기 위한 간단한 Boilerplate 예제

Babylon.js는 웹 브라우저에서 3D 게임 및 애니메이션을 개발하는 데 사용되는 오픈 소스 3D 게임 엔진입니다. WebGL과 HTML5 Canvas를 사용하여 실시간 3D 렌더링을 지원하며, 강력한 기능과 다양한 도구를 제공하여 개발자들이 높은 수준의 3D 경험을 만들 수 있도록 돕습니다. 이 포스트에서는 Babylon.js를 시작하는 데 도움이 될 수 있는 간단한 방법을 소개하겠습니다. Babylon.js는 웹 애플리케이션에 멋진 시각적 효과를 만들기 위해 사용할 수 있는 3D 엔진입니다. 그러나 새로운 Babylon.js 프로젝트를 설정하는 것은 초보자에게는 어려울 수 있습니다. 보일러플레이트 코드는 새로운 또는 실험적인 프로젝트를 빠르게 시작하기에 적합한 방법입니다. 보일러플레이트 코드를 사..

glTF 3D Model 2023.04.25

Squared Length를 이용한 3D 좌표의 빠른 거리 비교 방법

객체들 간의 거리를 비교하는 방법에 대해서 생각해 보도록 하겠습니다. 특히 여러 객체들 사이의 거리를 비교해 가장 가까운 점을 찾아야 할 경우라면 어떤 방법이 좋을까요? 3D 프로그래머라면 Length() 함수에 대해 잘 알고 있을 것입니다. 이 함수는 공간 상에서 두 점 간의 거리를 계산하는 함수로 게임 개발, 컴퓨터 그래픽 등 다양한 분야에서 사용됩니다. 하지만 더욱 빠르고 효율적인 거리 비교를 위해서 사용할 수 있는 LengthSquared() 함수도 있습니다. LengthSquared() 함수는 Length() 함수와 비슷하게 두 점 간의 거리를 계산하지만, 각 좌표 차이의 제곱의 합을 구하고 제곱근을 계산하지 않고 그대로 반환합니다. 이 차이는 작아 보일 수 있지만, 많은 양의 점들을 다룰 때 ..

C++ 2023.04.22

glTF 3D 모델을 웹 페이지에 포함하는 방법

glTF 모델을 웹 페이지에 추가해 3D 모델을 표시할 수 있다는 것을 아시나요? glTF는 3D 그래픽을 위한 오픈 표준 형식으로, 최근에 널리 사용되고 있습니다. 이 포맷은 효율적이고 간결하며 로드하기 쉬운 것으로 디자이너와 웹 개발자들이 웹 페이지에 3D 콘텐츠를 추가하고자 할 때 손쉽게 사용할 수 있습니다. glTF 포맷을 사용하면 웹 페이지에서 빠르고 효율적으로 로드되는 고품질의 3D 모델을 만들 수 있습니다. 이 방식으로 성능을 희생하지 않으면서 사용자에게 몰입감 있는 체험을 제공할 수 있습니다. 또한 애니메이션과 투명도와 같은 기능을 지원하기 때문에 사용자들의 관심을 끌고 계속해서 끌어들일 수 있는 인터렉티브한 콘텐츠를 만들 수 있습니다 웹 페이지에서 glTF 모델을 표시하려면 WebGL 호..

glTF 3D Model 2023.04.22

glTF: 3D 콘텐츠의 생성 및 배포를 위한 표준 포맷

오늘날 3D 모델은 게임, 건축, 엔지니어링, 엔터테인먼트 등 다양한 산업에서 디지털 콘텐츠 생성의 필수 구성 요소로 사용됩니다. 그러나 3D 모델의 생성, 공유 및 조회는 보통 표준 포맷이 없기 때문에 어려움이 있었습니다. 서로 다른 소프트웨어와 플랫폼은 독점적인 형식을 사용해 왔기 때문에 호환성 문제, 파일 크기 제한 및 별도 프로그램 설치 등으로 접근성이 제한되는 경우가 발생하게 됩니다. 2015년이 되어서야 컴퓨터 그래픽 산업의 주요 회사들이 모인 연합인 크로노스 그룹은 glTF (GL Transmission Format) 3D 모델 형식의 1.0 버전을 릴리즈했습니다. 현재는 2.0버전이 릴리즈되어 glTF는 웹, 모바일 및 데스크탑 플랫폼에서 3D 모델을 공통적이고 효율적인 방식으로 표현할 수..

glTF 3D Model 2023.04.22

glTF 3D 모델을 위한 도구들

3D 프로그램을 개발하고 있다면, glTF 포맷에 대해 들어보았을 것입니다. glTF는 "GL Transmission Format"의 약자로, 3D Scene(장면)과 Model의 효율적인 전송 및 로드를 위해 특별히 설계된 오픈 표준 파일 형식입니다. 크로노스그룹 (Khronos Group)이 발표한 실험적이었던 초기 버전이었던 1.0을 지나 완성도 있는 버전 2.0이 릴리즈된 이후로 glTF를 지원하는 프로그램이나 엔진들이 많아지고 있습니다. 현재는 다양한 분야에서 3D 기술이 도입되고 개발자들에게도 3D 모델을 사용하는 것이 아주 어렵거나 새로운 기술이 아닌 이미지나 동영상처럼 선택 가능한 하나의 자원으로 받아들여지고 있습니다. 이런 점에서 3D 파일을 손쉽게 보고 편집할 수 있는 도구들에 대해 알..

glTF 3D Model 2023.04.22

버전관리(GIT, SVN)에 친화적인 C++ 코딩 스타일

C++로 소프트웨어를 개발할 때 일관된 코딩 스타일은 개발자들이 네이밍 컨벤션, 포맷팅 및 기타 코드 관련 사항에 대해 동일한 이해를 가지도록 도와줍니다. 이는 서로 다른 스타일로 작성된 코드를 작업할 때 발생할 수 있는 혼란과 오류를 줄여줍니다. 이를 위해서 다양한 규칙들이 존재하고 한 가지로 정의되기는 어렵지만 일반적으로 아래의 원칙들을 사용할 수 있습니다. 의미 있는 변수명 사용: 변수명을 정확히 표현하는 뜻있는 이름으로 선택해서 다른 사람들이 코드를 읽을 때 이해하기 어려운 짧은 이름은 피하는 것이 좋습니다. 일관된 코딩 스타일 사용: 들여쓰기, 이름 규칙 및 서식을 포함하여 코드베이스 전체에서 일관된 스타일을 따르도록 하십시오. 이렇게 함으로써 다른 사람들이 코드를 읽고 이해하기 쉬워집니다. 효..

C++ 2023.04.22

FString과 std::string의 메모리 사용량 비교 (Unreal Engine, C++)

대부분의 C++ 프로젝트에서 문자열은 텍스트, 식별자 및 기타 데이터 유형에 사용되는 기본 데이터 유형입니다. 그러나 문자열은 자주 사용되거나 많은 양의 데이터를 포함하는 경우 상당한 양의 메모리를 소비할 수 있습니다. 메모리를 절약해야 하는 프로젝트에서는 문자열 개체의 메모리 사용량을 신중하게 고려하고 최소화하는 것이 중요합니다. 언리얼 엔진에서 FString은 기능의 편리함과 엔진의 전체 구조와의 무결성으로 인해 사용하기 쉬운 클래스이지만 특정 상황에서는 std::string을 대신 사용해야 할 경우도 있습니다. 문자열 클래스의 메모리 사용량 확인 // 13 characters std::string MyStdString = "Hello, world!"; FString MyFString = "Hello..

Unreal Engine 2023.04.22

여러 객체를 대상으로 카메라 전환하는 방법 (Unreal Engine, C++)

여러 대상 간에 카메라를 전환하면서 사용자의 입력을 처리하는 ​​기술은 게임에서만 필요한 것이 아닙니다. 이 기술은 갤러리, 전시회, 제품 매장 및 시뮬레이션과 같은 여러 유형의 응용 프로그램에서 사용할 수 있습니다. 예를 들어 갤러리 또는 제품 매장 앱은 유사한 시스템을 사용하여 사용자가 다양한 전시품, 예술품 또는 제품의 카테고리 와 개별 제품 사이를 탐색할 수 있도록 할 수 있습니다. 선택한 항목에 초점을 맞추도록 카메라를 배치하여 사용자가 작품을 자세히 볼 수 있도록 합니다. 차량 또는 항공기와 관련된 시뮬레이션 애플리케이션의 경우 사용자는 다른 비행기 사이를 전환하거나 다른 차량 사이를 운전할 수 있습니다. 카메라는 각 개체에 대한 자세한 보기를 제공하도록 배치되어 사용자가 다양한 관점에서 시뮬..

Unreal Engine 2023.04.22

하나의 HTML 파일에 3D 컨텐츠를 iframe으로 포함하는 방법

웹에서 동작하는 3D 엔진들 (예: three.js 또는 babylon.js)로 제작된 3D 콘텐츠는 일반적으로 캔버스를 사용하여 GPU 제어와 그래픽 컨텍스트의 반복 렌더링을 처리합니다. 이 때문에 HTML 페이지의 전체 클라이언트 영역을 사용하는 경우가 많고 따라서 웹 브라우저에서 별도의 단위로 처리되어야 합니다. iframe은 웹 브라우저에서 별도의 컨텍스트 관리를 제공하기 때문에 이 용도에 맞는 적합한 tag입니다. 한편 iframe 요소의 "src" 속성은 iframe 내부에 표시될 콘텐츠의 URL을 지정하는 데 사용되는 데, 이를 위해 별도의 HTML 파일이 필요하기 때문에 "src" URL이 없이는 iframe 콘텐츠를 사용하는 것이 쉽지 않습니다. 그러나 웹에서 하나의 기사 또는 블로그 포..

Three.js 2023.04.11

Three.js를 하나의 HTML 파일로 실행하는 간단한 Boilerplate 예제

보일러플레이트 코드는 신규 또는 실험적인 프로젝트를 빠르게 시작하기에 좋은 방법입니다. 간단한 보일러플레이트 코드를 사용하면 기본 설정 코드를 처음부터 작성하지 않아도 되므로 시간이 절약되고 오류가 줄어듭니다. 보일러플레이트 코드를 시작점으로 사용해서 이를 기반으로 프로젝트를 구축할 수 있습니다. Three.js의 보일러플레이트 코드는 일반적으로 렌더러, 카메라 및 장면과 같은 Three.js 장면을 만드는 데 필요한 기본 구성 요소를 포함합니다. 또한 Cube 또는 Sphere와 같은 기본적인 객체를 포함할 수 있으며, 이를 수정하거나 커스텀 3D 모델로 교체할 수 있습니다. HTML과 Javascript를 사용하는 보일러플레이트 코드는 하나의 단일 HTML 파일로 시작할 수 있어서 편리합니다. 이를 ..

Three.js 2023.04.08
반응형