한글날 기념으로 폰트 관련된 사이트를 하나 만들었습니다.
보통 한글날이 되면 무료 폰트 들이 공개되곤 하는데요.
저는 프로그래머이기 때문에 좀 더 기술적으로 접근을 하고 싶었습니다.
이미 오폰된 폰트 기술들도 많지만 실제로 쉽게 활용 할려면 공부를 해야하는 부분이 많습니다.
그런 부분을 좀 더 쉽게 할 수 있으면 좋지 않을까 해서 아래의 4가지의 기능을 구성하게 되었습니다.
1. Font Manager
http://www.fontmoa.com/fontmoa/
무료 폰트들을 쉽게 다운로드 할 수 있도록 만들어진 Font Manager 입니다.
현재 지원하는 것은 Google Font 리스트와 저작권 이슈에 걸리지 않을 몇가지 한글 무료폰트 리스트를 통해서 폰트를 다운로드 하고 사용하실 수 있습니다.
로컬에 이미 설치된 시스템 폰트들 리스트도 같이 검색이 가능하고 라벨을 붙여서 자신만의 검색 리스트를 만들 수 있습니다.
제공하는 기능들
* Local Font View
* Google Fonts Preview & Download
* Google Early Access Fonts Download
* Free Font Download
오픈소스 형태로 되어 있으니 필요하시면 수정해서 사용하실 수 있습니다.
https://github.com/fontmoa/fontmoa
2. Font Editor
http://www.fontmoa.com/editor/v1/simple.html
간단한 TTF 폰트를 만들 수 있는 웹으로 만든 폰트 에디터입니다.
폰트 에디터를 생각 한 것은 아이들의 글자를 쉽게 디지털로 바꿀 수 있으면 어떨까 하고 생각했습니다.
어른들에게는 약간은 추억의 대상이 될 수도 있지 않을까 해서요.
그래서 어렵지 않은 폰트 에디터를 만들어서 실제로 활용할 수 있으면 좋겠다는 생각으로 만들게 되었습니다.
한글을 폰트로 만들려면 11,172 라는 엄청난 글자를 만들어야 하는 데요. 하지만 실제로 사용 할 때는 몇 글자 되지 않습니다. 아마도 몇 글자를 만들어서 그걸로 폰트형태로 활용 할 수 있다면 좀 더 재미난 폰트가 되지 않을까합니다.
제공하는 기능들
- TTF 폰트 에디터
- TTF 기반으로 WOFF, SVG, EOT 웹폰트 생성
- 만들어진 폰트 미리보기 기능
- 초보자를 위한 Simple 모드와 전문가를 위한 Advanced Mode 지원
- 기존 ttf 폰트 불러오기
- SVG 파일 폰트로 불러오기
- 아이콘 폰트 만들때 글자 이름으로 CSS 생성해주기
- bitmap 이미지를 벡터형태로 변환해서 글자로 만들어주기
- 한글 자소 템플릿 생성 (230 자 정도)
- 자소 템플릿으로 한글 11,172 자 전체 문자 만들어주기
- Simple 모드에서 다양항 해상도 대응하기 ( 스마트폰, 태블릿에서도 정렬된 화면으로 에디터를 보실 수 있습니다. )
모든 코드는 오픈소스로 되어 있습니다.
https://github.com/fontmoa/fonteditor
현재 메뉴얼도 만들어보고 있어요.
https://fontmoa.gitbooks.io/fontmoa-fonteditor/
아직 다 채우진 못했지만 좀 더 풍성한 메뉴얼이 되도록 노력중입니다.
재미난 폰트 만드는데 관심 있으시면 많은 참여 부탁드립니다. ?
3. Web Font
간단한 웹폰트 변환 툴입니다.
폰트모아의 시작은 이것부터 했었습니다.
하다보니 폰트에 대한 툴을 다 모아보면 어떨까 하는 생각으로 가는 계기가 되었습니다.
제공하는 기능들
- 웹폰트 변환
- 폰트 경량화 기능
4. Icon Font
Bootstrap 이란 CSS Framework 가 뜬 이후로 아이콘 폰트들이 여기저기에서 엄청나게 사용되기 시작합니다.
하지만 각자가 가진 고유한 아이콘을 계속 추가 하다보니 아이콘 폰트의 크기가 엄청나게 커집니다.
실제로 Font Awesome 이라는 아이콘 셋을 보시면 현재 600개가 넘는 아이콘을 가지고 있습니다.
하지만 사이트에서 사용할 때 보통 600개를 다 쓰진 않죠. 다 쓰진 않지만 폰트 파일은 다운로드 받아야 해서 용량이 커지게 됩니다.
그걸 좀 줄여보고자 유명한 무료 아이콘 폰트들을 각자 필요한 것만 선택해서 다운로드 할 수 있게 구성했습니다.
제공하는 아이콘 폰트
- Material Icons
- Font Awesome Icons
- Foundation Icons
- XEICON
- Typicons
- Weather Icons
- Entypo
원하는 아이콘을 선택하고 다운로드를 하시면 실제 줄여진 아이콘 폰트 파일들을 보실 수 있습니다.
앞으로 폰트 관련된 여러가지 기술들을 웹형태로 구현해보고 싶네요.
폰트에 대한 기술적인건 모두 fontmoa 에서 해보고 싶은 생각이 듭니다.
