2년 걸린 폰트 편집기 작업 마무리중

2년 걸린 폰트 편집기 작업 마무리중

작년에 만들던 폰트에디터에 대해서 이런저런 고민하다가 3D로 획을 만드는 방법으로 방향을 완전히 틀었고 이제 그 결과물이 거의 끝나갑니다. 그냥 폰트찍어내는 프로그램을 만들기는 했는데 기계에 사용할 폰트를 목적하고 있는 것이라서 조금 다르긴 하지만 하여간 기본 폰트에 대한 부분이랑 한글, 한글 조합 등등 다 좋은데 진짜는… 

애니메이션 폰트가 만들어진다는 것 그리고 더 중요한 것은… UFO 폰트 스펙에 다 맞춰서 글자 변형이 자유로워지는 것

만화폰트는 금방 뽑아냅니다. 아이패드 지원도 됩니다. 그리고 템플릿을 기반으로 하는 기능과 몇가지 기능들을 추가중인데 대충 끝나면 폰트 펀딩이나 해야겠어요.

일단 애니메이션 폰트는 영상용이나 방송용으로 쓰일거 같긴한데 그것보다 어르신들 손글씨를 기록하게 될거예요. 이거 만들다 내가 어르신이 된 기분 

이건 손글씨폰트지 손글씨라고 하기에는 좀 ^^; 그걸 해결하기 위해서 다른 아이템들을 전부 담아 끝을 낼 예정입니다.

2년 걸린 프로젝트도 이제 거의 끝… 그나저나 인터페이스는 다 바꿔야하는데 디자인은 더 복잡하게 만들어 놓고 간단한 버전을 먼저 만들어서 마무리 했습니다. 

책 팔아야 하는데 여전히 엉뚱한 짓을

한글 폰트에디터 작업이 어느덧 8개월째…

한글폰트 에디터 작업 8개월이 넘어가는 중입니다.

폰트를 모든 컴포넌트로 조합해서 자동으로 조합하는 부분과 타사의 폰트와 완전히 동일한 좌표계를 가진 대체폰트를 위한 에디터입니다. 타사로 바꿔도 같은 자간, 행간 커닝 조합이 되는 것을 하고 있었고 만화쪽 폰트에서 기업용까지 대체할 수 있는 폰트를 만들 목적으로 제작했습니다.

시간이 오래 걸리고 과정도 길고… 한글 폰트는 컴포넌트 방식으로 만들어야 하기 때문에 관련 조합이 상당히 많은 편입니다. 그걸 다 해결할 수는 없고 폰트형태에 따라 달라지게 됩니다.

그걸 가이드별로 다르게 처리하는데 일단 전문 폰트 에디터들이 한글용으로 기준을 잡아 만들고 있지 않으니까 이것저것 작업해야 할게 많아집니다. 그래서 옛날에 만든 폰트중에 3000개 내외의 글립스를 가진 폰트가 많아서 그걸 인쇄용으로 쓰려면 포기하고 새로 다른 본문용을 선택하는 경우가 많습니다. 현재 새로 조합해서 만들고 수정을 해야 하는 부분이 있지만 저희는 틈새를 노리는 에디터입니다.

### 컴포넌트 라이브러리 – 자주 사용하는 자모 부분을 라이브러리에 저장 – 카테고리별로 컴포넌트 관리 (초성, 중성, 종성, 사용자 정의) – 드래그 앤 드롭으로 컴포넌트 배치 – 더블 클릭으로 컴포넌트 즉시 추가 – “현재 선택 저장” 버튼으로 새 컴포넌트 추가

1. **문자 선택**: 편집할 한글 문자 입력 2. **자모 확인**: 초성/중성/종성 구성 확인 3. **레이아웃 설정**: 자동으로 설정된 자모 레이아웃 확인 4. **컴포넌트 배치**: 라이브러리에서 기본 형태 배치 5. **세부 조정**: 베지에 도구로 세부 형태 조정 6. **일관성 검토**: 글리프 네비게이터로 다른 문자와 비교 7. **저장**: 완성된 문자를 JSON 형식으로 저장

현재 수정중인 에디터 부분은 면 기반이 아니라 선기반으로 작업중입니다. 끝 

뇌 건강을 감지하는 3D손글씨 프로젝트

손글씨 프로젝트의 다음단계

3차원 공간에서 글자를 만들 생각을 하고 있습니다. 이 생각은 폰트를 만들면서 계속 고민한 부분인데 획을 모두 각도별로 따로 Depth 별로 구분하고 랜더링해서 glyph 를 만들어서 구성하는 것입니다.

그러면 각기 다른 각도의 폰트는 물론 사람 특유의 서체를 구현할 수 있으리라 봅니다. 특히 획의 힘주는 포인트를 압력을 Depth 로 구분하면 제가 맨 처음에 폰트를 만들려고 했던 기계가 인간을 온전히 따라하는 장비에 맞는 폰트를 구성할 수 있습니다.

https://www.facebook.com/100000028745534/videos/900683031876367

가시적으로 보여지는 것이 외에 데이터기반으로 압력감지를 폰트화 하는 것이라서 보일때는 2D인데 실제로 전혀 다른 데이터가 포함된 필기를 건강이랑 결합한 프로젝트입니다. 인간의 노화도 알아볼 수 있고 ? 필체의 변화를 건강상태랑 즉각 반영합니다. 특히 뇌에 이상이 생기면 필기체가 변화합니다.

이건 저도 경험한바 있기때문에 인지기능을 테스트하는 것과 비슷합니다. 같은 글씨를 매년 쓰면 다른 글자가 나오게 됩니다. 그걸 이용한 프로젝트입니다.

신경학적 변화 감지

파킨슨병, 알츠하이머 등 신경퇴행성 질환의 초기 징후 포착

뇌졸중 후 회복 과정 모니터링

미세한 운동 기능의 변화 추적

데이터 수집 방식

필기 압력 (pressure sensitivity)

글자 모양의 일관성

쓰기 속도와 리듬

획의 연속성과 끊어짐

실시간 건강 모니터링

정기적인 필기 샘플 수집을 통한 변화 추적

갑작스러운 변화 발생시 조기 경고 시스템

장기적인 건강 트렌드 분석

이런 시스템을 구현하기 위해서는 다음과 같은 기술적 요소들이 필요할 것 같습니다:   

압력 감지 센서

실시간 데이터 처리 알고리즘

머신러닝 기반 패턴 인식

시계열 데이터 분석

와콤, 아이패드만 있으면 감지가 됩니다. 그리고 지속적인 손글씨 연습데이터를 기록하는 앱을 준비하고 있습니다. 그 것을 이용해서 폰트도 만들어 드릴 생각이지만 본 목적은 향후 본인의 글씨를 교정하는 것도 있지만 내가 어떤 글씨를 쓰고 있고 건강에 문제가 발생했을 때 미리 알아 차릴 수 있게 하는 것도 있습니다.

Wacom의 압력감지:   

압력 레벨의 정밀한 감지 (대부분의 모델이 8192단계)

펜의 기울기 정보도 활용 가능

실시간 데이터 스트림 접근 가능

아이패드 애플펜슬의 압력감지

압력감지 특성

최대 4096단계의 압력감지

기울기(Tilt) 감지 가능

방향(Azimuth) 데이터 수집

초당 240회 데이터 샘플링

Web API 접근

제가 폰트를 만드는 이유도 CNC, 로봇팔 등에 인간 고유의 것을 접목하려는 것도 다 연결되어 있습니다. 뇌졸중이 온지 벌써 8년째인데 제가 느낀 것은 현재 손상된 부분은 연습을 통해 매꿔질 수 있지만 본질적으로 우회하고 있다는 것입니다.

이 프로젝트는 매번 쓰는 글자를 통해 스스로 변화를 감지하기 위함입니다. 

bone 폰트를 잠깐 개발해서 보고 있습니다.


bone 폰트를 잠깐 개발해서 보고 있습니다. 기존 폰트를 읽어서 뼈대에 해당하는 것을 추출하고 다시 획을 3D애니메이션 할 때 쓰는 bone 을 입혀 한글을 뼈로 만들어서 움직이게 하고 있습니다.

한글서체의 기본 글자의 뼈에 해당하는 중심점을 찾습니다. 스트로크로 폰트만드는 작업을 할 때 필요하기도 하고 현재 가장 문제가 되고 있는 글자를 똑바로 쓰지 않는 손글씨의 원점인 기본 획을 찾아내기 위해 만들었습니다.

구분된 글자를 기준으로 다시 OVAL, Line, Square, 등의 기본 도형에 대한 부분을 추출해서 xml 로 대체할 예정입니다. 바로 전에 만든게 초성, 중성, 종성의 위치값을 찾는 것이라면 이번에는 글씨의 기본인 선의 각도 획의 형태를 찾아내는 것입니다.

두깨는 나중일이지만 일단 이 부분만 중점적으로 학습하고 있습니다.

기계학습을 통해서 조금 고민을 하게 되는 것은 비슷한 알고리즘이 되지 않을까 하는 것입니다. 대신 애니메이션이나 새로운 유형의 글자를 만들 때 재미있는 결과물로 확장할 수 있으리라 생각되기는 합니다. 논문 더 봐야할거 같아요 ^^

아무리 엉망으로 써도 bone 추출후 다시 한글폰트로 만들 수 있습니다. 벡터로 만들어 놓은 것을 감안하면 폰트가 조금 달라지지만 손글씨가 아닌 폰트가 됩니다

레이아웃 자동화 만화효과음 폰트 만들기

주말 다 반납하고 제작한 만화효과음 레이아웃 추출 기능을 대부분 완성했고 반대 작업도 하고 있습니다. 초성, 중성, 종성 한벌만 쓰면 이세상 모든 폰트레이아웃으로 만화효과음 폰트가 그려집니다. 인디자인 대체폰트가 그냥 만들어지기는 하는데 같은 모양이라고 하지 않았습니다. 같은 것도 만들 수는 있지만 일단 그건 예외로 하고 

이 결과물은 여러가지 학습결과물로 글자 자소 디자인체계를 바꿀 수 있습니다. 가로, 세로, 모든 획을 구분해서 나눈 다음에 이미지에서 특별한 값을 추출해서 벡터로 깔끔하게 연결하는 Stroke 방식으로 안그려도 대충 그려도 찾아낼 수 있습니다. 각도별로 다 다른 값을 가진 이미지를 생성할 수 있기 때문입니다.

제가 요즘 점선으로 된 무언가를 그리면 외곽이 모두 연결되고 꾸밈하는 글자의 부리. 획의 삐침 등을 색상으로 구분해 두면 그걸 너비에 맞춰서 디자인을 붙여가는 방식을 생각하고 있습니다.

만화효과음은 방향에 따라 다른 느낌을 주기위해 작가가 손을 대는 경우가 많은데 아예 그럴필요없이 방향별로 폰트를 다 생성할 수 있습니다. ttf 나 otf 같은 파일이 아니라 svf 로 만화 그리는 에디터에서 직접 수정하는 것도 가능하게 됩니다.

예를 들어 기존 글꼴이 있다면

글꼴의 레이아웃에 초성, 중성, 종성을 그려주면 폰트가 생성됩니다.

벡터로 그린 것 이외에 다른 방식도 가능합니다. 그냥 비트맵인 포토샵이나 코믹스튜디오에서 작업하면 이미지를 벡터화하여 폰트로 만들 수 있습니다.

집중해서 기능적인 부분을 마무리하고 아이패드 프로크리에이터에서 개별 폰트의 레터링을 제작할 수 있는 템플릿을 그대로 한글폰트로 만들 수 있게 하면 되지 않을까 합니다.

초성, 중성, 종성만 그리면 다양한 레이아웃으로 바로 폰트 1000개 가이드폰트 및 템플릿을 만들 수 있습니다. GPU가 필요합니다. 제 머리로는 이제 한계예요 ?!?

OpenCV, tesseract 등 도입으로 한글폰트 레이아웃 재구성

OpenCV, tesseract 등 도입으로 한글폰트 레이아웃 재구성

일단 어떤 폰트건 다시 재구성해서 한글을 구분된 레이아웃으로 분리했습니다. 그리고 글리프별 레이아웃을 기반으로 한 데이터를 재구성할 수 있도록 표준화된 json 파일로 구성하고 svg 로 내보내기 할 수 있게 구성했습니다.

반대로 몇몇 유형의 글자를 쓰면 초성, 중성, 종성을 분리해서 다시 조합하고 특정한 폰트의 레이아웃 정보를 적용하면 새로운 폰트가 생성됩니다.

그동안 손글씨를 특정 패턴에 의해 제작하는 방식을 만들었다면 이번에는 방식으로 폰트제작을 해보려는 중입니다.

글자별로 인식하는게 다르긴한데 그래도 모든 글자를 검토해서 뽑는 것에는 문제가 없습니다. 다만 ㅎ 같은 글자가 2벌로 나눠져서 ㅗ ㅇ 이 부분을 어떻게 처리해야 하나 고민중입니다.

그냥 폰트 만드는데 도움되는 실험이었습니다.

대체폰트 프로젝트 – 인디자인 스타일 재구성

대체폰트 프로젝트 – 인디자인 스타일 재구성을 위해 무료 대체폰트를 찾거나 만들거나 메트릭스를 조정할 수 있는 기능을 생각하고 있습니다. 어차피 한글 이외에 모든 글꼴은 조합해서 구성할 수 있으므로 일단 한글만 찾기로 했습니다.

대략 폰트를 디렉토리에 넣고 프로그램을 돌리면 기본 정보를 모두 비교합니다. 그리고 각기 다른 폰트간에 폰트의 위치를 스타일로 조절하고 폰트는 서로 달라도 결과가 동일한 스타일 구성을 뽑아내는 것을 목표로 합니다.

무료폰트를 사용해도 동일한 결과가 나오게 하는 것이 목적이며 폰트를 수정하거나 바꾸는 일을 하는 것은 다른 문제이기 때문에 그냥 계산기 역할만 할 생각으로 제작중입니다.

특히 외서에 본문의 폰트에 따라 대체할 수 있는 스타일을 지정해야 하는데 잘 안맞는 경우가 있습니다. 그걸 다 찾아내서 한 번에 수정할 수 있게 하려는 목적입니다.

일서를 자주하는 저희 회사용도입니다. 그냥 작업하면 빠른데 오늘 빨리 마감해야해서 계산용도로 만들어봤습니다.

글립프가 있는 것이라면 모두 추출해서 폰트를 거꾸로 만들 수도 있지만 로고 정도에 사용된 폰트를 만들거나 PDF에서 벡터를 폰트 데이터를 재생성할 수도 있기는 합니다. 

하여간 돈 안내고 뭘 하겠다 이런 것이 아닙니다. 그냥 기술적으로 가능하다 정도이며 기존에 유료폰트를 사용한 인디자인 작업물을 가지고 PDF를 만들거나 epub을 만들때에도 수정을 해야하는데 이 기능을 활용하면 적은 시간에 플랫폼에 맞는 전자책을 만들 수 있습니다.

그 전에 플랫폼마다 예외처리해야 하는 기능들에 대해서 분석해야 하는데… 뭐 하다보면 될겁니다.

이제 폰트 분석 플랫폼이나 하나 만들어 봐야겠습니다. 여기저기 만들어놨던 것들도 이제 하나로 좀 합치고 혼자 장난하는 것도 그만하기로… 

베이스라인 (실선)

x-height 라인 (점선)

어센더 라인 (점선)

디센더 라인 (점선)

중앙 정렬 가이드 (가는 점선)

커닝가이드 그리고 기존 폰트 스타일과 대체 폰트를 x-ray 툴이라는 저희가 만든 폰트 비교 프로그램으로 본문을 기준으로 맞춰보면 눈으로 보이는 것과 기계적으로 분석한 것은 다르기 때문에 비교 결정을 할 수 있게 될 것입니다.

손글씨 하나 폰트로 만들려고 하다가 할 일만 늘어놨네요 ^^

만화효과음 자소 폰트 편집기 프로토타입

만화효과음 자소 폰트 편집기 프로토타입


웹툰에서 작가고유의 폰트를 만들고 초, 중, 종성을 분리한 콤포넌트를 사용하여 집중선, 퍼스펙티브에 맞춘 글자 레터링을 자유롭게 할 수 있고 폰트패밀리를 사용해서 효과를 즉각적으로 변경해서 확인할 수 있는 폰트를 제작하고 있습니다.


전용 폰트 제작 및 클립스튜디오에서 벡터효과를 바로 복사 붙이기가 됩니다!

https://youtu.be/SdX35tBwgXQ

폰트를 만들기 위한 초, 중, 종성 자유배치 프로그램

오선지를 이용한 손글씨 가이드

클립스튜디오에서 만화용의 초성, 중성, 종성만 그리고 벡터로 중심선이나 괘선 위에 만화작가가 그린 그림에 맞게 본인이 쓴 글씨의 부분을 가지고 작업할 수 있는 한글 만화효과음 편집기를 간단히 만들어 봤습니다. 사실 SVG를 하나씩 선택하게 해서 서로 다른 폰트의 조합을 운영하기 위한 테스트를 실행해봤습니다.

그냥 자소 상관없이 본인이 쓴 조합을 찍어낼 수 있으리라 생각됩니다. 만화 캐릭터 얼굴, 눈 같은 것도 가능하겠죠? 하여간 옛날 점프 만화에 하이스쿨 기멘구미의 에피소드에 얼굴 도장찍는 만화가가 오버랩됩니다.

다른데 쓸 수도 있겠다 싶기도 하지만 일단 만화효과음만 생각하면 중심점, 방향에 따른 글자 배치되는 부분 및 글자의 조합이 될 수 있고 거꾸로 폰트에서 다시 초중성을 재배열 할 수 있을거 같습니다.

폰트를 고쳐서 새로운 폰트를 구성할 수 있겠죠.

사실 원래 만들어 놓은 손글씨에서 폰트로 바꿀 수 있는 가이드에 각도를 넣는 부분이 준비중인데 이것을 편집기에서 내 글씨 스타일을 분석해서 배치형태의 기본형을 만들어주거나 손글씨의 약점인 균일화를 어느정도 지원해줄 수 있는 가이드가 될 수 있으리라 생각됩니다.

최초에 모양을 삼각, 사다리꼴, 다각형 구조로 만들었던 가이드는 본인의 글씨를 기준으로 여러가지 자모 조합에 따른 몇가지 유형으로 단순화 한 것인데 이번에 만든 가이드는 레터링과 비슷한 오선지 스타일의 중성 기준으로 제작합니다.

그러면 거꾸로 초성, 종성의 유형은 자유롭게 블록으로만 처리하고 중성의 위치에 따라 초성의 다양한 형태를 쓰거나 균형, 조형을 직접 체감해볼 수 있으리라 생각됩니다. 중성이 기준이 되는 이유는 글자의 안정감과 균형을 맞추는 중심이 되기 때문입니다.

초성은 모양이 많이 달라지지만 그에 대해 종성은 위치이동 정도로 달라지기 때문에 이 방법을 채용해서 폰트를 온라인이나 앱에서 쓸 때 최소 글자로 글자를 추출할 수 있는 기능과 에디터를 만들어 스캔하고 SVG를 배치하면 자동으로 폰트가 나오게 하려고 합니다.

기존에 템플릿을 완전히 바꿀 준비를 하고 가이드 글씨 쓰기 부분도 바꿔볼 생각입니다.

손글씨 가이드 편집기 각도를 바꿀 수 있고 사이즈 변경 배치를 변경할 수 있음 주황색은 초성, 연두, 초록, 노랑, 보라색이 중성, 남색은 종성 이 블록의 위치를 조절해서 내 손글씨의 가이드를 만들고 폰트를 만들었을 때 균형을 맞출 수 있게 됩니다.

내부적으로 돌아가는 것은 아니고 서버에서 에디터로 배열을 해서 PDF로 손글씨 템플릿 다운로드 받을 수 있게 할 예정입니다.

비슷한 손글씨 폰트가 있다면 그것을 기반으로 x-ray tool 에서 가이드를 생성할 수 있습니다.