틀린그림찾기

두 3D 장면을 비교하고 발견한 차이를 선택하세요.

사용 방법

함께 회전하고 확대·축소되는 두 개의 귀여운 로우 폴리 3D 장면을 비교해 8개 명소풍 레벨에서 5~8개의 제작된 차이를 찾습니다.

WebGL 기반의 혁신적인 3D 입체 ‘틀린그림찾기’ 게임입니다. 평면 사진을 넘어 360도 자유롭게 회전하고 확대할 수 있는 두 개의 정교한 3D 공간을 직접 둘러보며 숨겨진 차이점을 찾아 공간 지각력과 기억력을 기를 수 있습니다.

💡 3단계 초간단 사용 가이드

① 3D 입체 챌린지 시작

시작 버튼을 누르면 좌우에 정밀하게 렌더링된 두 개의 3D 가상 공간이 로드됩니다.

② 360도 회전 및 줌으로 탐색

화면을 드래그해 각도를 돌리고 마우스 휠로 확대하여 기둥 뒤나 오브젝트의 모양, 색상 차이를 비교합니다.

③ 발견한 다른 점 클릭

차이점을 발견하면 3D 오브젝트를 직접 마우스로 클릭하여 정답을 맞히고 완료합니다.

활용 상황

8레벨 본편에는 같은 명소가 반복되지 않습니다. 편안한 모드 재플레이는 정답 조합을 무작위로 바꾸고, 레벨 1 후에는 로컬 날짜 일일 도전, 레벨 8 후에는 끝없는 월드 투어가 열립니다.

계산 또는 처리 방식

한쪽을 드래그해 두 장면을 회전하고 휠이나 두 손가락으로 확대·축소한 뒤 차이를 고르세요. 힌트는 게임마다 2회이며 일일 도전에서 오답은 3초, 힌트는 회당 10초가 추가됩니다.

구체적인 예시

예시: 히메지성을 모티브로 한 장면을 완료해 다음 고유 명소로 이동하거나, 같은 장면에서 검토된 다른 유효한 차이 조합을 무작위로 골라 다시 플레이할 수 있습니다.

제한 및 데이터 처리

WebGL이 필요하며 GPU, 기기 성능, 네트워크 상태가 로딩에 영향을 줄 수 있습니다. 장면은 건축 특징을 살린 로우 폴리 해석이며 정밀 건축 모형이 아닙니다. 동일 출처 Firebase 리소스는 브라우저나 호스팅 계층에 캐시될 수 있지만 정확한 캐시 또는 삭제 기간은 보장하지 않습니다. 실패하면 다시 시도하거나 돌아갈 수 있습니다.

레벨 진행, 진행 중인 정답, 일일 개인 최고 기록, 월드 투어 기록, 오디오 설정은 localStorage에만 저장합니다. 동일 출처 Firebase는 정적 장면 리소스만 제공합니다. GA4에는 도구, 분류, 언어, 모드, 명소, 레벨, 찾은 수, 힌트 수, 로딩 결과 코드(성공, WebGL 미지원, 리소스 오류, 컨텍스트 손실, 복구 실패)로 제한된 정보만 보냅니다. 정답이나 ID, 무작위 시드, 좌표, 시간, 진행도, 기록, 가공하지 않은 오류, 스택 추적은 보내지 않습니다. H5 전면 광고는 AdSense 검토 중에는 계속 비활성화됩니다. 활성화하려면 H5 이용 자격을 별도로 확인하고 승인된 설계, 광고 인벤토리 신고, 정책 검토, 테스트, 운영 환경 검증을 완료해야 합니다. 기존 페이지 광고는 제공 여부에 따라 표시됩니다.

WebGL 3D 렌더링, 공간 기하 비교 및 인지 훈련 게임 설계 가이드

1. WebGL 및 Three.js 3D 그래픽스 파이프라인 구조

브라우저 표준 WebGL과 Three.js 엔진을 기반으로 플러그인 설치 없이 실시간 3D 공간을 렌더링하며, 좌우 듀얼 카메라의 동기화된 궤도 회전을 지원합니다.

2. 3D 기하 메시(Mesh) 변형 및 차이점 생성 원리

3D 객체의 위치 이동, 크기 축소/확대, 회전 각도 및 텍스처 색상 변경을 통해 다채로운 입체 공간 틀린그림찾기를 구현합니다.

3. 공간 지각력 및 뇌 인지 훈련 효과

입체 공간을 다각도에서 탐색하고 비교하는 상호작용은 뇌의 공간 작업 기억과 시각적 주의 집중력을 활성화하는 데 도움을 줍니다.

공식 자료 출처 및 표준 기준

  • Khronos Group WebGL 2.0 공식 기술 규격
  • Three.js 3D 그래픽 라이브러리 개발자 문서
  • 한국인지과학회: 3차원 공간 인지 및 주의집중 연구

자주 묻는 질문

틀린그림찾기: 어떻게 조작하고 어떤 브라우저가 필요한가요?

마우스, 터치 또는 키보드로 두 장면을 함께 회전·확대·이동한 뒤 차이를 선택합니다. WebGL과 동일 출처 Firebase 정적 리소스는 시작한 뒤에만 불러오며 WebGL 미지원 브라우저에서는 실행할 수 없습니다.

틀린그림찾기: 본편, 재플레이, 일일 도전, 월드 투어는 어떻게 진행되나요?

8레벨 본편에서 서로 다른 8개 명소를 방문하며 게임마다 차이 5~8개를 찾고 힌트는 2회 사용합니다. 편안한 모드 재플레이는 다른 유효한 정답 조합을 무작위로 고릅니다. 일일 도전은 브라우저 로컬 날짜와 콘텐츠 버전으로 문제를 고정하고 오답은 3초, 힌트는 10초를 더합니다. 레벨 8 후 월드 투어에서는 차이 수가 5, 6, 7, 8 순서로 반복되고 직전 명소는 연속으로 나오지 않습니다.

틀린그림찾기: 로딩 실패나 기기 성능 부족 시에는 어떻게 하나요?

WebGL이 필요하며 GPU, 기기 성능, 네트워크 상태가 로딩에 영향을 줄 수 있습니다. 장면은 건축 특징을 살린 로우 폴리 해석이며 정밀 건축 모형이 아닙니다. 동일 출처 Firebase 리소스는 브라우저나 호스팅 계층에 캐시될 수 있지만 정확한 캐시 또는 삭제 기간은 보장하지 않습니다. 실패하면 다시 시도하거나 돌아갈 수 있습니다.

틀린그림찾기: 어떤 데이터를 저장·전송하며 게임 광고가 있나요?

레벨 진행, 진행 중인 정답, 일일 개인 최고 기록, 월드 투어 기록, 오디오 설정은 localStorage에만 저장합니다. 동일 출처 Firebase는 정적 장면 리소스만 제공합니다. GA4에는 도구, 분류, 언어, 모드, 명소, 레벨, 찾은 수, 힌트 수, 로딩 결과 코드(성공, WebGL 미지원, 리소스 오류, 컨텍스트 손실, 복구 실패)로 제한된 정보만 보냅니다. 정답이나 ID, 무작위 시드, 좌표, 시간, 진행도, 기록, 가공하지 않은 오류, 스택 추적은 보내지 않습니다. H5 전면 광고는 AdSense 검토 중에는 계속 비활성화됩니다. 활성화하려면 H5 이용 자격을 별도로 확인하고 승인된 설계, 광고 인벤토리 신고, 정책 검토, 테스트, 운영 환경 검증을 완료해야 합니다. 기존 페이지 광고는 제공 여부에 따라 표시됩니다.