02 / PROCESS
구성과 제작 과정
01
기술 설명의 진행 순서
각 기술에 관한 질문으로 시작하여 등장 배경과 내부 구조, 발광 원리를 순서대로 살펴볼 수 있도록 구성하였습니다.
02
설명 단계와 기술 비교
화면 상단에 단계 표시줄을 배치하고 실사 위에 도해와 자막을 구성하였습니다. 마지막 OLED 편에서는 네 기술을 나란히 비교하여 구조와 표현 방식의 차이를 살펴볼 수 있도록 하였습니다.
03 / MAKING
기획과 구현
기획 의도
CRT·PDP·LCD·OLED의 내부 구조와 발광 원리를 단계별로 살펴볼 수 있도록 구성하였습니다. 같은 설명 화면을 자동재생 영상과 터치형 HTML로 제공하도록 하였습니다.
구현 방식
공통 HTML에 장면과 단계, 재생 시간 데이터를 연결하고 Python에서 도식과 자막을 정리하였습니다. Node.js 스크립트로 자동재생 화면을 영상으로 출력하고, 마지막에는 네 가지 디스플레이의 두께·무게·구성을 비교하는 화면을 연결하였습니다.
공통 페이지에 장면과 단계 연결
CRT의 기준 페이지를 바탕으로 PDP·LCD·OLED의 장면, 단계와 길이를 교체하였습니다. 같은 내용을 자동재생 영상과 한 파일로 실행하는 터치형 HTML에 적용하였습니다.
도식 위치와 생성 영상의 전환 수정
자막 영역을 정리한 뒤 위쪽에 남아 있던 도식을 설명 영역의 가운데로 옮겼습니다. PDP의 생성 영상에서 확인한 깜빡임과 갑작스러운 유리판 전환은 1.4초 디졸브로 조정하였습니다.
그림 비율과 전시 명칭 통일
그림을 가로로 늘이지 않고 비율을 유지하여 넓은 화면에 배치하였습니다. 분해 전시 자료와 부품 이름을 맞추고, 마지막 비교 화면에는 네 열의 막대와 수치를 함께 표시하였습니다.
04 / GALLERY


