역사는 반복되지 않지만, 종종 타일이 된다
원문은 Marcin Wichary님이 에 게재했습니다. 이 블로그 구독하기
(이전 글에 이어서, 혹은 그에 앞서서)…
1.
옛 컴퓨터들은 8×8 폰트를 좋아했고, 8×8 그래픽도 좋아했다.
당시 많은 컴퓨터에서 그래픽은 틈 없이 나란히 표시되었기 때문에, 폰트는 문자 사이에 숨 쉴 공간을 만들기 위해 소중한 픽셀 한두 개를 희생해야 했다. 하지만 이런 배치에는 장점이 있었다. 두 개 이상의 타일을 매끄럽게 이어 붙여 더 큰 그림을 만들 수 있었다는 것이다.
이는 이미 1970년대 후반 컴퓨터인 Ohio Scientific Challenger 1P의 내장 그래픽에서도 볼 수 있다. 집, 탱크, 비행기, 사람 같은 한 글자짜리 그래픽이 많았지만, 서로 붙여야만 의미를 갖는 것들도 있었다. 잠수함이나 전함, 혹은 U.S.S. 엔터프라이즈호 같은 것들이다:

이보다 후대의 컴퓨터인 Atari ST에는 두 글자에 걸쳐 펼쳐진 Atari 로고와, 16×16 크기의 이스터에그인 “Bob”의 얼굴이 있었다.

그리고 Apple II의 문자 세트는 몇 개의 글리프를 조합해 달리는 사람이나 폴더, 스크롤바를 만들 수 있게 해주었다:

아케이드 비디오 게임도 마찬가지였다. 팩맨의 미로는 하나하나의 8×8 문자들을 모아 조립한 것이었지만, 팩맨과 그의 숙적들은 16×16 크기로 더 컸다:

위에서 흥미로운 기법 하나를 발견할 수도 있다. 유령은 2×2 격자에 깔끔하게 들어갈 수 있었지만, 대신 수직으로 어긋나게 배치되어 2×3 칸을 차지한다. 왜일까? 눈과 ‘치마’ 부분이 서로 독립적으로 움직이면서도 필요한 타일 수가 조합 폭발을 일으키지 않도록 하기 위해서다:
2.
얼마 전 우리는 Mac OS X 앱의 다양한 설치 그래픽을 살펴본 적이 있다. 그 그래픽들은 Finder의 새로운 기능, 즉 배경 이미지를 지정하는 기능을 창의적으로 활용한 것이었다.
1984년부터 1990년대 후반까지 Mac OS X 이전의 Finder에는 그런 기능이 없었는데도, 가끔 이런 화면을 볼 수 있었다:

어떻게 만든 것일까? 그래픽을 수많은 32×32 아이콘으로 쪼갠 뒤, 윈도우 안에 정교하게 배치하는 방식이었다.
그 아이콘들은 앱이나 이미지의 바로가기가 아니었다. 그냥 그 자리에 있었을 뿐이다. 마지막 비결은 공백만으로 이루어진 이름이었다. 그러면 모든 것이 끊김 없이 이어진 하나의 거대한 이미지처럼 보이기 시작했다… Clean Up 기능을 실행하기 전까지는 말이다. 그 기능은 유쾌하리만치 확실하게 모든 것을 망쳐버렸다:
3.
2014년 출시 이후 Slack은 어느 직장에서나 누구나 커스텀 공유 이모지를 만들 수 있게 했고, 1년 뒤부터는 이를 리액션으로도 사용할 수 있게 되었다.

이 기능은 매우 인기를 끌었고, 커스텀 이모지가 특정 조직의 문화를 어떻게 반영하는지에 대해서는 책을 몇 권이라도 쓸 수 있을 정도다.

이모지 여러 개를 나란히 출력할 수도 있었는데, Slack은 이모지 사이에 아무 간격도 두지 않기로 했다:

이제 어디로 흘러갈지 짐작이 갈 것이다.
사람들은 더 큰 이미지를 더 작은 이모지로 쪼개기 시작했다. 처음에는 직접 손으로…
…그러다 부분적인 자동화를 거쳐, slack-big-emoji나 slack-emoji-enlarger 같은 완전 자동화된 도구들이 등장했다:
이 기법의 다른 모든 사례와 마찬가지로, 타일을 올바른 순서로 조립하는 것 자체가 도전의 일부다. 위의 예시는 이렇게 생겼다:
:tjp3-000::tjp3-001::tjp3-002::tjp3-003::tjp3-004::tjp3-005::tjp3-006::tjp3-007::tjp3-008::tjp3-009::tjp3-010::tjp3-011::tjp3-012::tjp3-013::tjp3-014::tjp3-015::tjp3-016::tjp3-017::tjp3-018::tjp3-019:
:tjp3-020::tjp3-021::tjp3-022::tjp3-023::tjp3-024::tjp3-025::tjp3-026::tjp3-027::tjp3-028::tjp3-029::tjp3-030::tjp3-031::tjp3-032::tjp3-033::tjp3-034::tjp3-035::tjp3-036::tjp3-037::tjp3-038::tjp3-039:
:tjp3-040::tjp3-041::tjp3-042::tjp3-043::tjp3-044::tjp3-045::tjp3-046::tjp3-047::tjp3-048::tjp3-049::tjp3-050::tjp3-051::tjp3-052::tjp3-053::tjp3-054::tjp3-055::tjp3-056::tjp3-057::tjp3-058::tjp3-059:
:tjp3-060::tjp3-061::tjp3-062::tjp3-063::tjp3-064::tjp3-065::tjp3-066::tjp3-067::tjp3-068::tjp3-069::tjp3-070::tjp3-071::tjp3-072::tjp3-073::tjp3-074::tjp3-075::tjp3-076::tjp3-077::tjp3-078::tjp3-079:
:tjp3-080::tjp3-081::tjp3-082::tjp3-083::tjp3-084::tjp3-085::tjp3-086::tjp3-087::tjp3-088::tjp3-089::tjp3-090::tjp3-091::tjp3-092::tjp3-093::tjp3-094::tjp3-095::tjp3-096::tjp3-097::tjp3-098::tjp3-099:
:tjp3-100::tjp3-101::tjp3-102::tjp3-103::tjp3-104::tjp3-105::tjp3-106::tjp3-107::tjp3-108::tjp3-109::tjp3-110::tjp3-111::tjp3-112::tjp3-113::tjp3-114::tjp3-115::tjp3-116::tjp3-117::tjp3-118::tjp3-119:
:tjp3-120::tjp3-121::tjp3-122::tjp3-123::tjp3-124::tjp3-125::tjp3-126::tjp3-127::tjp3-128::tjp3-129::tjp3-130::tjp3-131::tjp3-132::tjp3-133::tjp3-134::tjp3-135::tjp3-136::tjp3-137::tjp3-138::tjp3-139:
:tjp3-140::tjp3-141::tjp3-142::tjp3-143::tjp3-144::tjp3-145::tjp3-146::tjp3-147::tjp3-148::tjp3-149::tjp3-150::tjp3-151::tjp3-152::tjp3-153::tjp3-154::tjp3-155::tjp3-156::tjp3-157::tjp3-158::tjp3-159:
:tjp3-160::tjp3-161::tjp3-162::tjp3-163::tjp3-164::tjp3-165::tjp3-166::tjp3-167::tjp3-168::tjp3-169::tjp3-170::tjp3-171::tjp3-172::tjp3-173::tjp3-174::tjp3-175::tjp3-176::tjp3-177::tjp3-178::tjp3-179:
:tjp3-180::tjp3-181::tjp3-182::tjp3-183::tjp3-184::tjp3-185::tjp3-186::tjp3-187::tjp3-188::tjp3-189::tjp3-190::tjp3-191::tjp3-192::tjp3-193::tjp3-194::tjp3-195::tjp3-196::tjp3-197::tjp3-198::tjp3-199:
Slack에서도 이미지를 공유할 수 있는데 굳이 이렇게 할 필요가 있느냐고 물을 수도 있다.
나도 딱히 이유가 있다고 확신하지는 못한다. 물론 타일로 만든 이미지 주변에는 일반 이미지와 달리 글을 쓸 수 있고, 별도의 UI 크롬도 생기지 않는다. 하지만 진짜 이유는 단순하다. 그저 이 놀이 자체를 사랑하기 때문이다.
하지만 그래서 나는 역사의 이런 디테일을 사랑한다. 오래된 디테일이 언제 다시 살아 돌아올지 아무도 모른다. 때로는 재미로 시도해 볼 만한 핵(hack)일 뿐이지만, 가끔은 까다로운 문제를 풀 수 있는 유일한 해법이 되기도 한다.
클래식 Mac OS의 타일링에 대해 알려준 Andrew Yaros에게 감사드린다.
글을 무작위로 읽기
댓글
로그인하고 댓글 남기기