매직 아이 만들기 프로그램

들어가며

글자나 그림을 넣으면 그 모양을 무늬 속에 숨긴 매직 아이 그림을 만들어 주는 웹 프로그램을 만들었다. 설치 없이 브라우저에서 바로 쓸 수 있고, 만든 그림은 PNG 파일로 저장할 수 있다.

숨길 모양은 네 가지 방법으로 정한다. 글자를 입력하거나, 예시 그림이나 내 사진을 고르거나, 화면에 직접 그리거나, 실제 별자리를 고르면 된다. 특히 별자리 기능은 지구에서 각 별까지의 실제 거리를 입체의 높낮이로 보여 준다.

프로그램 바로가기

https://sciencej.cafe24.com/html5/magiceye/magiceye.html

매직 아이의 원리

매직 아이는 두 눈이 서로 다른 위치의 무늬를 보도록 만들어 뇌가 입체로 느끼게 하는 그림이다. 정식 이름은 오토스테레오그램(autostereogram)이다.

무늬는 가로로 일정한 간격마다 반복된다. 숨긴 모양이 있는 곳에서는 이 반복 간격이 조금 좁아진다. 초점을 풀어 두 눈의 시선이 반복 무늬 한 칸씩 어긋나게 겹치면, 간격이 좁은 부분이 앞으로 튀어나와 보인다.

이 프로그램은 숨길 모양을 먼저 흑백 깊이 그림으로 바꾼다. 흰색일수록 가깝고 검은색일수록 멀다. 그다음 깊이에 맞춰 무늬의 반복 간격을 한 줄씩 계산해 매직 아이를 완성한다. ‘정답 보기’ 버튼을 누르면 이 깊이 그림을 직접 확인할 수 있다.

숨길 모양 만들기

왼쪽 설정판 맨 위의 탭에서 숨길 모양을 만드는 방법을 고른다. 탭은 글자, 그림, 그리기, 별자리 네 가지다.

글자

입력 칸에 숨기고 싶은 글자를 쓴다. 줄을 바꾸면 여러 줄로 들어간다.

• 글자체: 검은고딕, 도현체, 주아체, 본고딕 굵게, 본명조 굵게, 연성체 중에서 고른다.
• 글자 크기: 20%부터 100%까지 조절한다. 100%는 화면에 꽉 차는 크기다.

획이 굵은 글자체일수록 입체가 또렷하다. 처음이라면 검은고딕으로 두세 글자를 크게 넣어 보는 것이 좋다.

그림

‘입체용 흑백 그림 고르기’ 드롭다운에서 예시 깊이 그림을 고른다. 옆의 작은 미리보기에 흑백 깊이 그림이 나타난다.

• 입체 도형: 공, 도넛, 원뿔, 피라미드, 계단 탑, 과녁, 하트, 별, 물결, 체크무늬
• 동물: 고양이, 강아지, 코끼리, 기린, 토끼, 물고기, 돌고래, 나비, 공룡, 거북이, 비둘기, 달팽이
• 사물과 자연: 비행기, 자동차, 로켓, 기타, 우산, 열쇠, 집, 나무, 사과, 초승달, 음표, 닻

‘자동’에 체크하면 2초마다 다음 그림으로 차례대로 넘어간다. 내 사진은 ‘내 그림 올리기’를 눌러 고르거나, 끌어다 놓거나, 붙여넣기로 넣는다. 사진은 밝은 곳일수록 튀어나오므로, 배경이 단순하고 윤곽이 뚜렷한 그림이 잘 보인다.

그리기

그리기 탭을 고르면 오른쪽 화면이 검은 그리기 판으로 바뀐다. 검정은 배경이고, 밝은 음영으로 칠할수록 앞으로 튀어나온다.

• 도구: 펜(자유롭게 그리기), 직선, 네모, 원
• 음영: 검정, 진한 회색, 회색, 연한 회색, 흰색의 5단계. 검정은 지우개처럼 쓴다.
• 붓 굵기: 4단계
• 속 채우기: 네모와 원을 꽉 채울지, 테두리만 그릴지 고른다.

Shift 키를 누른 채 끌면 직선은 45° 단위로, 네모는 정사각형으로, 원은 정원으로 그려진다. 되돌리기(Ctrl+Z)와 모두 지우기도 있다. 다 그렸으면 ‘매직 아이로 바꾸기’를 누르고, 고치고 싶으면 ‘다시 그리기’를 누른다.

별자리

실제 별의 하늘 위치로 별자리 모양을 그리고, 지구에서 가까운 별일수록 앞으로 튀어나오게 만든다. 북두칠성, 작은곰자리, 카시오페이아자리, 오리온자리, 백조자리, 사자자리, 남십자자리를 고를 수 있다.

• 거리 표현: ‘실제 비율’은 거리 차이를 그대로 높이 차이로 바꾼다. ‘고르게 펼치기’는 거리가 비슷한 별들도 높이 차이가 잘 보이도록 펼친다.
• 별자리 선 잇기: 별 사이를 선으로 잇는다. 선은 양쪽 별의 높이에 맞춰 비스듬히 기울어 보인다.
• 별 목록: 별 이름과 거리를 가까운 순서대로 막대와 함께 보여 준다.

북두칠성을 보면 가운데 다섯 별은 약 80광년으로 거의 같은 높이에 있고, 양 끝의 두베(약 123광년)와 알카이드(약 104광년)는 뒤로 물러나 있다. 오리온자리에서는 벨라트릭스(약 250광년)가 가장 앞에, 허리띠 가운데 알닐람(약 2000광년)이 가장 뒤에 보인다. 거리는 대략적인 값이며, 멀리 있는 별일수록 자료마다 측정값 차이가 크다.

무늬와 입체감 설정

설정을 바꾸면 매직 아이가 바로 다시 그려진다. 숨길 모양 아래에 공통 설정이 모여 있다.

설정하는 일

가장자리 부드럽게	모양의 경계를 부드럽게 다듬는다. 0이면 각지고, 높일수록 둥글게 솟는다.
모양이	모양을 튀어나오게 할지, 움푹 들어가게 할지 고른다.
무늬	모래, 색종이, 물감, 내 사진 중에서 고른다. 기본은 모래다.
무늬 다시 섞기	같은 종류의 무늬를 새로 만든다. 물감은 섞을 때마다 색 조합이 바뀐다.
튀어나오는 정도	입체의 깊이를 정한다. 너무 크면 눈이 쉽게 피로해진다.
무늬 폭	무늬가 반복되는 간격이다. 화면 위 두 점 사이 거리와 같다.
보는 방법	평행법과 교차법 중 내가 보는 방법을 고른다.
그림 크기	가로, 정사각, 세로 중에서 고른다.
초점 맞추기용 점	그림 위쪽에 두 점을 표시한다.

무늬는 자잘하고 색이 다양할수록 눈이 초점을 잡기 쉽다. 내 사진을 무늬로 쓸 때는 꽃밭이나 나뭇잎처럼 작은 무늬가 많은 사진이 잘 어울린다.

매직 아이 보는 법

매직 아이를 보는 방법은 평행법과 교차법 두 가지다. 기본 설정은 평행법이다.

평행법

1. 그림 위쪽의 검은 점 두 개가 보이도록 화면을 편하게 바라본다.
2. 화면 너머 먼 곳을 보듯 초점을 푼다. 점이 네 개로 보이다가 가운데 두 개가 겹쳐 세 개가 되면 거의 다 온 것이다.
3. 그 상태를 유지하면 숨은 모양이 서서히 떠오른다.

처음에는 화면에 코를 대고 시작해 천천히 얼굴을 떼면 쉽다.

교차법

눈을 코끝 쪽으로 살짝 모아서 두 점을 세 개로 만드는 방법이다. 교차법으로 볼 때는 ‘보는 방법’을 교차법으로 바꿔야 모양이 올바르게 튀어나온다. 바꾸지 않으면 튀어나와야 할 모양이 들어가 보인다.

잘 안 보일 때

• 화면에 보이는 두 점 사이가 6cm보다 넓으면 평행법으로 보기 어렵다. 무늬 폭을 줄이거나 화면 배율을 낮춘다.
• 튀어나오는 정도를 조금 낮추고 가장자리 부드럽게를 높이면 초점이 잘 잡힌다.
• ‘정답 보기’로 숨은 모양을 먼저 확인하고 보면 찾기 쉽다.
• 오래 보면 눈이 피로하므로 중간중간 쉬어 준다.

저장하고 내려받기

만든 그림은 화면 위쪽의 ‘PNG로 저장’ 버튼으로 저장한다. 파일 이름은 magic-eye.png다. 초점 맞추기용 점을 켜 두었다면 점도 함께 저장된다. 저장 버튼이 보이지 않는 환경에서는 그림을 오른쪽 클릭하거나 길게 눌러 저장하면 된다.

프로그램은 HTML 파일 하나로 되어 있다. 파일을 내려받아 더블클릭하면 브라우저에서 바로 열리고, 인터넷이 없어도 동작한다. 다만 인터넷이 연결되지 않으면 글자체가 기기의 기본 글꼴로 바뀔 수 있다.

수업 활용 아이디어

• 두 눈과 입체 지각: 한쪽 눈을 가리면 매직 아이가 보이지 않는다는 것을 직접 확인한다. 두 눈의 시차로 거리를 느낀다는 원리로 이어 갈 수 있다.
• 별까지의 거리: 별자리 탭에서 같은 별자리의 별들이 실제로는 서로 아주 다른 거리에 있다는 것을 입체로 체험한다. 별 목록의 광년 값과 비교하며 이야기 나누기 좋다.
• 숨은 글자 퀴즈: 글자 탭으로 낱말을 숨긴 그림을 저장해 나눠 주고, 누가 먼저 찾는지 겨룬다.
• 깊이 그림 그리기: 그리기 탭에서 음영의 밝기가 높이가 된다는 규칙으로 계단, 산, 건물 같은 입체를 설계해 본다.

마치며

매직 아이는 처음 볼 때 시간이 걸리지만, 한 번 보이기 시작하면 다음부터는 금방 보인다. 쉬운 공 모양부터 시작해 글자, 그림, 별자리 순서로 넓혀 가면 좋다. 오래 보면 눈이 피로해지니 짧게 여러 번 보는 것을 권한다.