PackText는 단어와 이미지를 원하는 모양에 채워 배치한다

PackText는 단어와 이모지, 이미지를 정한 윤곽 안에 채웁니다. 브라우저에서는 WebAssembly로 실행되고, Word Mess의 iPhone·iPad·Mac 버전에도 쓰입니다. 저는 게임 화면의 단어 구름을 만드는 계산이 브라우저에서도 같은 엔진으로 돌아간다는 점이 눈에 들어옵니다. 꾸밈으로 보이는 배치가 여러 환경에서 재사용되는 실제 기능이라는 점이 오래 남습니다.

MiniLM-L6-v2 임베딩 모델을 웹어셈블리(WebAssembly)로 실행하는 사례와 PackText는 브라우저 안에서 계산을 처리한다는 점에서 이어집니다. 하나는 모델 작업, 다른 하나는 비트맵 배치지만 서로 다른 기능이 같은 실행 환경을 활용합니다.

단어 구름은 완성된 장면으로만 보이기 쉬운데, PackText는 윤곽을 기준으로 단어뿐 아니라 이모지와 이미지까지 배치합니다. 결과물을 보여주는 데 그치지 않고, 배치를 만들어 내는 엔진을 브라우저와 앱에 연결한 점이 흥미롭습니다.

대상은 비트맵(bitmap)으로 표현할 수 있는 요소입니다. 텍스트는 Core Text나 FreeType으로 만들거나 알파 채널(alpha channel) 데이터를 가져오는 식으로 입력 경로를 선택해야 합니다. 단일 명령 다중 데이터(SIMD)는 한 연산에 128비트를 처리하지만, 이 설명만으로 실제 작업 시간이 얼마나 줄었는지는 알 수 없습니다. 글꼴과 이미지 입력 방식, 기대하는 속도를 따져 보면 선택이 달라집니다.

데모 페이지에서 단어를 윤곽 안에 배치해 보십시오. 결과가 윤곽을 채우면서도 읽히는지 살펴보면 배치 품질을 확인할 수 있습니다. 속도도 궁금하다면 같은 입력을 여러 번 넣어 처리 시간을 재어 보십시오.

게임에서 글자 배치 때문에 단어 찾기가 어려워졌다고 느낀 마지막 순간은 언제입니까?