디스플레이(display)

디지털 콘텐츠는 2D 픽셀이거나, 3D 폴리곤이거나 모두 화면에 보이는 것으로 끝나게 됩니다. 결국 디스플레이의 특징에 대해서 알아야 효과 적인 표현을 할 수 있습니다. 이번 글에서는 디스플레이의 간단한 역사와 발전 방향에 대하여 알아 보겠습니다.

1 세대 : CRT, 브라운관

초창기 디스플레이가 가장 많이 쓰인 분야는 TV입니다. 가정용으로도 그렇고 공업(기업용 컴퓨터)에 사용된 디스플레이들은 기본적은 브라운관 이라고 불리는 형태를 띄고 있습니다. 전자총으로 전자(빛의 입자)를 날릴 때 전자석으로 경로를 만들어야 하기 때문에 앞뒤로 길쭉한 형태이기도 하고, 가능한 균일한 속도, 거리를 날려야 함으로 화면이 볼록하게 되어 있습니다.
지금 다루는 디스플레이의 세대별 구분은 빛을 뿌려서 화면에 부딪히게 한다는 기본 구성이 같기 때문에 렌즈를 통해 빛을 투과하는 프로젝터나 프로젝션 TV같은 계열도 1세대에서 크게 다르지 않습니다.

나무위키 – CRT (https://namu.wiki/w/CRT)


2세대 : LCD, LED, OLED 등 평면 디스플레이

LCD, LED는 기본적인 작동 원리가 비슷합니다. 백라이트에서 빛을 뿌리면 각각의 픽셀(화소)마다 전기를 이용하여 필터나 렌즈를 통하여 빛을 막거나 통과시키는 원리로 색을 표현합니다. 마치 출입문 처럼 열고 닫는 형식을 통해 색을 통과시키는 것입니다.
다만, OLED의 경우 백라이트가 아닌 자체 발광하는 유기물 입자를 통해 색을 표현하는 원리이기는 하지만 제조사에 따라서는 소자 자체는 백색으로 하고, 컬러필터를 통해 빛을 표현하기 도합니다.
브라운관에서 평면 디스플레이로 발전이 되면서 무게가 줄어 듦과 동시에 크기가 굉장히 크게변화되었습니다. 가정에서 사용하는 평균 20인치 대 브라운관에서 80인치 대 평면 디스플레이를 사용하는 시대로 바뀌게 되었습니다.

3세대 : Flexible or Foldable

기본적인 작동 원리는 2세대 평면 디스플레이와 큰 차이는 없지만, 외형에 대한 변화가 생기게 되었습니다. 평면 디스플레이와는 다르게 곡선, 접히는 책과 같은 형태, 두루마리처럼 말릴 수 있는 형태로 하여 현재 고가의 디스플레이 시장을 차지하고 있습니다.

LG 사이니지 투명 디스플레이(https://lg.co.kr/media/release/23315)
 
이는 각종 회로, 기판에 쓰이는 소재의 발전으로 가능해 졌으며, 이러한 변화에는 투명한 기판을 활용하여 투명 디스플레이(LG 사이니지)까지 보다 우리가 생활하는 환경에 밀착하는 형태로 발전되었습니다.

4세대 : Hologram

차세대 디스플레이이자 디스플레이의 마지막 발전 형태라고 할 수 있는 홀로그램입니다. 현재의 홀로그램이라고 불리는 상용 제품들의 경우 반사판을 활용하여 사실상 홀로그램과 같은 효과를 낸것이지 실제 홀로그램은 아닙니다. 대표적으로 MR장비인 마이크로 소프트의 홀로렌즈가 이러한 원리를 사용합니다.

마이크로 소프트 홀로렌즈 https://www.microsoft.com/en-us/d/hololens-2/91pnzzznzwcp
 
실제 홀로그램의 경우 손톱 만한 디스플레이 구현을 위해 수 억 원이 들어가는 만큼, 상용화 단계와는 거리가 멀다고 할 수 있습니다. 홀로그램이 마지막 세대 디스플레이라고 할 수 있는 이유는 사람이 인지할 수 있는 차원이 3차원(x, y, z)로 제한되어 있기 때문입니다. 3세대의 디스플레이까지는 외형적인 부분에서는 입체적인 형태로 보일 수는 있지만, 평면의 이미지를 굴곡진 표면에 투사(Projection) 시키는 형태일 뿐 결과적으로 보여지는 이미지의 형태가 2D로 이루어져 있습니다.

3D 데이터도 우리가 모니터에서 보기 위해서는 MVP(Model, View, Projection) 변환(transform)이라는 것을 통해서 평면으로 변환 하는 절차를 거치게 됩니다. 마치 공간(3D)을 사진(2D)으로 찍어서 보는 것과 같은 원리입니다.

https://www.kickstarter.com/projects/2029950924/holovect-holographic-vector-display
 
반면에 홀로그램의 경우 입체를 입체 그대로 보여줄 수 있는 디스플레이입니다. LG 사이니지 같은 투명한 디스플레이를 반대편에서 본다면 거울처럼 좌우가 뒤집어진 이미지를 보는 것이 아니라 사물, 혹은 인물의 뒷모습 보여줄 수 있는 것입니다. SF영화에서 이러한 홀로그램 디스플레이에 대한 상용화 되었을 때 모습을 그려놓은 작품들이 있습니다.
 
스타워즈 : 통신 중에 원거리에 떨어진 인물의 모습을 디스플레잉
아이언맨 : 홀로그램으로 장비를 설계, 시뮬레이션
아바타 : 지형 정보등 구현한 자원, 군사 시뮬레이션

아이언맨 홀로그램 https://www.cgrecord.net/2013/04/iron-man-ii-hologram-suits.html

유니티(unity)

유니티 3D는 대표적인 리얼타임 엔진이기도 하며, 언리얼과는 다른 포지션으로 시장에 군림하고 있습니다.
 
특징을 크게 나눠보면 다음과 같습니다.
1. 다양한 플랫폼을 지원한다.
2. UX, UI가 편리하다
  (언리얼 엔진 4에서 UI가 대대적으로 바뀌었을 때, 유니티와 유사한 구조로 업데이트 되었습니다.)
3. 다양한 디바이스를 지원한다.
 
유니티 3D가 우리나라에서 보편적으로 쓰이게 된것은 스마트 폰의 역사와 그 맥을 같이 합니다. 2007년 스마트폰의 등장 이전에는 피쳐폰에 소프트웨어 혹은 게임을 넣기위해서는 별도의 개발 키트를 이용해서 개발해야 했습니다. (GVM, SK-VM등) 피쳐폰에서는 3D를 지원하지 않기도 했지만 피쳐폰에 개발되는 소프트웨어들에 대한 용량 제약도 심했기 때문에 복잡한 컨텐츠는 개발하기 힘든 환경이 였습니다. 반면, 아이폰 3gs의 등장으로 시작된 스마트 폰에서는 cocos-2D, 유니티와 같은 게임엔진을 필두로 하여 다양한 컨텐츠 제작이 가능한 개발환경 구축이 가능했고, 이를 뒷받침해줄 수 있는 하드웨어의 성능으로 인해 3D 게임에 대한 개발이 가능해졌습니다. 
 
 
 
Temple Run (Imagi studio) , 길건너친구들(Hipster Whale) 같이 소규모 팀 혹은 개인과 같은 인디게임들의 상업적인 성공으로 인해 많은 개발자들이 접하게 되었습니다. 소규모 팀의 성공이후 삼국지를 품다(Ndoors)와 같이 중대형 팀에서도 유니티를 도입하면서 대형 개발사들에서도 많은 프로젝트가 출시되었습니다.

출처 : https://play.google.com/store/apps/details?id=com.imangi.templerun&hl=en_US


 
2016년에 출시 된 Oculus Lift와 같은 VR 장비들에 발빠르게 대응하면서 대표적인 XR 콘텐츠 제작도구가 되었습니다. 언리얼과 접근 방식이 다른것이 유니티는 AssetStore라는 자체 플랫폼을 통해 VR, AR 솔루션 업체들이 직접 플러그인을 업로드하고 관리하도록 유도하였습니다. 또한 VR과 같은 성능에 민감한 디바이스들은 상대적으로 가벼운 환경에 언리얼보다 대응이 쉬웠고, 다양한 디바이스에 대한 선택지 들이 있었기 때문에  포켓몬 GO! (닌텐도)와 같은 컨텐츠도 제작이 되었습니다.
 
최근에  업데이트 된 많은 기능들은 기본기능에 플러그인과 같이 확장해서 패키지 형태로 확장해서 언리얼과 유사한 기능들이 많이 추가 되었습니다. AI 솔루션을 검토해서 사용하는 AI 스토어도 확장되어 발빠르게 대응하는 모습을 보여줬습니다.

출처 : https://assetstore.unity.com/ai-hub

안티 앨리어싱(Anti-Aliasing)

안티 앨리어싱은 레스터라이즈(벡터 > 픽셀화) 한 이미지를 보다 부드럽게 만들어주는 기능입니다. 보통 안티 앨리어싱이 적용되지 않아서 픽셀이 끊어져 보이는 효과를 재깅(Jagging, jagged)라고 합니다. 이러한 재깅을 부드럽게 줄여주는 것을 안티앨리어싱이라고 합니다.

안티 앨리어싱의 원리

안티 앨리어싱은 렌더링 되는 과정중에 하나의 효과로 여러가지 알고리즘이 있습니다.

언리얼 엔진에서는 TSR(Temporal Super Resolution)이 PC기준으로 기본값으로 적용되어 있고, 모바일은 FXAA(Fast Approximate Anti-Aliasing)이 기본 설정으로 적용 됩니다.

유니티 엔진에서는 MSAA (Multi Sample Anti Aliasing)이 기본값으로 적용되어 있습니다.

이는 기본값으로 몇가지 선택지 중에 바꿀 수 있습니다.

안티 앨리어싱 종류와 특징

빠른 근사 안티 앨리어싱(Fast Approximate Anti Aliasing) 

TSR에도 등장하지만 종종 샘플, 혹은 샘플링이라는 표현들이 등장합니다.

이는 렌더링과 관련해서 자주 등장하게 되는 단어인데, 단순하게 설명하면 수집된 표본(데이터)라고 이해하시면 됩니다.

출처 : https://www.nvidia.com/en-us/geforce/news/multi-frame-sampled-anti-aliasing-delivers-better-performance-and-superior-image-quality/

안티 앨리어싱에 한해서 설명하자면, 재깅(지글거리는)것을 완화하기 위해서 샘플을 수집합니다. 수집되는 대상은 3D 벡터 데이터를 화면에 표현하게 되었을 때 픽셀에서 차지하는 비율이라고 보시면 됩니다. 위에 이미지 좌측 하단에 두개의 박스를 풀어보면 다음과 같습니다.

네모 박스는 픽셀을 의미합니다.

빨간 선은 벡터 이미지(3D 폴리곤)으로 빨간선을 기준으로 아래쪽에 폴리곤이 있게 됩니다. 빨간점 혹은 녹색 점은 샘플입니다.

Frame n-1을 보면 폴리곤(빨간선)이 하단 3개의 샘플에 포함되어 있습니다. 같은 색상이라도 샘플이 1개만 포함되면 옅은 흰색, 샘플 두개가 포함되면 흰색으로 폴리곤이 같은 색이라도 다르게 표현되는 것을 알 수 있습니다. 반면, Frame n 과 같이 좌측하단의 샘플에 폴리곤이 포함되지 않는다면, 블랙(0)으로 폴리곤이 없는 것처럼 처리됩니다.

불칸(Open Gl)에서도 보면 하나의 픽셀을 네개의 샘플을 수집해서 픽셀을 표현하게 되는데, 이러한 경우 MSAA x4 로 표현합니다. x는 곱하기 의미 입니다. 2개의 샘플은 x2, 6개는 x6과 같이 표기합니다. 샘플 수가 많을 수록 연산이 무겁습니다

템포럴 슈퍼 레졸루션(Temporal Super Resolution Up Scaling)

언리얼 엔진4에서 사용하던 템포럴 안티  앨리어싱 업스케일을 개선한 기능입니다.

업스케일링(낮은 해상도로 렌더링해서 높은 해상도로 보여주는) 기반으로 한 안티앨리어싱입니다.

간단하게 작동 순서를 보면 다음과 같습니다.

1. 디스플레이 해상도가 4k라면, 그보다 낮은 단계로 렌더링 합니다. 예를 들면  FHD(1920 * 1080)로 렌더링된 결과를 각종효과를 적용하고 나서 4k(3840 * 2160)으로 보여주는 것입니다.

2. 각 프레임에서 서로 다른 위치를 샘플링(분석하기 위한 픽셀 데이터 수)합니다.

3. 이전 프레임에 샘플링된 픽셀을 블렌딩(혼합) 합니다.

위에 이미지는 컴퓨터가 화면을 그리는 순서입니다. 지오메트리를 적용한 후 DOF(depth of field) 효과를 적용한 후에 Temporal Super Resolution (TSR – 녹색)이 적용됩니다.

그 후에 적용되는 많은 포스트 프로세스(후처리 시각 효과)들이 적용됩니다. 이러한 과정을 거쳐서 각진 도트를 보기 편안한 이미지로 필터링 하게 됩니다.