아이팟 각인 서비스를 기억하시나요
2000년대에 아이팟을 온라인 애플 스토어에서 사면, 뒷면 금속 판에 원하는 문구를 무료로 새겨주는 서비스가 있었어요. 생일 선물로 '사랑하는 딸에게' 같은 문구를 넣어서 주던 그거요. 지금도 에어팟이나 아이패드에 각인이 가능하지만, 이 문화를 대중화한 건 아이팟 시절이었죠.
애플 온라인 스토어 쪽에서 일했던 디자이너 던스턴 오처드(Dunstan Orchard)가 2019년에 쓴 글이 다시 읽히고 있는데요, 바로 이 아이팟 각인 기능을 만들던 시절을 회고한 글이에요. 겉으로 보면 '텍스트 입력창 두 개에 미리보기 하나' 정도인 단순한 기능인데, 그 뒤에 얼마나 많은 고민이 들어갔는지를 보여주는 글이라 개발자라면 한 번쯤 읽어볼 만해요.
단순해 보이는 기능이 어려운 이유
이런 기능의 핵심은 미리보기예요. 사용자가 글자를 입력하면 실제 아이팟 뒷면에 새겨진 것처럼 화면에 보여줘야 해요. 이게 뭐가 어렵냐면, 화면에 보이는 것과 실제 레이저로 새겨지는 결과가 조금이라도 다르면 고객이 실망하거든요. 선물로 받은 아이팟의 글자가 미리보기와 다르게 잘려 있다면? 각인 제품은 반품도 안 되니까 애플 입장에서는 치명적이죠.
그래서 미리보기는 실제 각인 장비가 쓰는 것과 똑같은 글꼴, 똑같은 크기, 똑같은 줄 간격으로 렌더링돼야 해요. 그런데 2000년대 중반이면 브라우저에서 웹 폰트를 자유롭게 쓸 수 있는 시대가 아니었어요. CSS의 @font-face가 제대로 지원되기 전이니까요. 그러니까 서버에서 이미지를 생성해서 내려주거나, 브라우저별로 다르게 나오는 렌더링을 어떻게든 통일해야 했다는 거예요. 지금이야 캔버스에 폰트 하나 얹으면 끝이지만, 당시엔 이게 상당한 엔지니어링 과제였어요.
글자 수 제한과 다국어의 벽
각인은 두 줄이고, 한 줄에 들어갈 수 있는 양이 정해져 있어요. 그런데 '글자 수'라는 게 알파벳 기준으로는 간단하지만, 실제 제약은 글자 수가 아니라 물리적 폭이에요. 'iiii'와 'WWWW'는 같은 네 글자지만 폭이 전혀 다르잖아요. 애플은 전 세계에 아이팟을 팔았으니 일본어, 중국어, 한국어, 아랍어, 태국어까지 다 각인 대상이었고요. 한글은 알파벳보다 한 글자당 폭이 넓고, 아랍어는 오른쪽에서 왼쪽으로 쓰고 글자끼리 붙어서 모양이 바뀌고, 태국어는 위아래로 성조 기호가 붙어서 줄 높이가 달라져요.
이 모든 걸 고려해서 '이 문구는 들어갑니다', '이 문구는 너무 깁니다'를 실시간으로 판단하고, 각 언어의 실제 각인 결과를 정확하게 미리 보여줘야 하는 거예요. 국제화(i18n)를 해 본 개발자라면 이 대목에서 공감의 한숨이 나올 거예요. 텍스트 하나 다루는 게 왜 이렇게 어렵냐는 그 느낌이요.
여기에 하나 더, 부적절한 문구를 걸러내는 필터도 필요해요. 욕설이나 상표권 문제가 될 수 있는 문구를 각인해서 내보내면 안 되니까요. 그런데 이것도 언어마다 다르고, 우회 표기도 많아서 완벽한 필터는 애초에 불가능하고, 어느 선에서 타협할지가 제품 결정이 되는 영역이에요.
지금 개발자에게 주는 교훈
이 글이 좋은 이유는, 우리가 매일 만드는 '별것 아닌 것 같은 기능' 하나에도 사용자 경험, 물리적 제약, 국제화, 법적 리스크가 전부 얽혀 있다는 걸 보여주기 때문이에요. 기획서에 '각인 텍스트 입력 및 미리보기'라고 한 줄로 적히는 기능이 실제로는 몇 달짜리 프로젝트가 되는 이유가 여기 있죠.
한국 개발자에게 특히 와닿는 부분은 디지털과 물리 세계가 만나는 지점의 엔지니어링이에요. 요즘은 굿즈 커스터마이징, 포토북, 폰케이스 인쇄, 네임스티커 같은 서비스가 많잖아요. 이런 서비스는 전부 같은 문제를 안고 있어요. 화면에서 본 것과 손에 쥔 것이 같아야 한다는 문제요. 폰트 라이선스, 렌더링 엔진 차이, CMYK와 RGB 색 차이, 인쇄 여백까지 미리보기가 책임져야 하는데, 이걸 대충 하면 고객센터가 터져요. 애플이 20년 전에 이미 이 문제를 어떻게 풀었는지 보는 건 그래서 실용적인 참고가 돼요.
또 하나는 제약이 곧 디자인이라는 관점이에요. 두 줄, 정해진 폭, 하나의 글꼴. 이 제약 덕분에 각인은 어떤 문구를 넣어도 애플다운 결과물이 나왔어요. 사용자에게 무한한 자유를 주는 것보다, 잘 설계된 제약 안에서 좋은 결과가 나오게 만드는 게 더 어려운 디자인이라는 걸 보여주는 사례예요.
마무리
한 줄 정리: 아이팟 각인 미리보기는 텍스트 입력창 두 개짜리 기능처럼 보이지만, 폰트 렌더링, 다국어 폭 계산, 물리적 결과물과의 일치, 콘텐츠 필터링이 전부 들어간 작은 걸작이었어요.
여러분이 만들었던 기능 중에 '겉으로는 단순한데 안은 지옥이었던' 기능이 있나요? 그리고 화면의 미리보기와 실제 결과물을 일치시켜야 하는 서비스를 만들어 보신 분들, 어떤 방식으로 검증하셨는지 궁금해요.
🔗 출처: Hacker News