다른 서비스
NEW
기획
디자인
개발
프로덕트
아웃소싱
프리랜싱
비즈니스
최근 검색어
전체 삭제
최근 검색어가 없습니다.

디자인

구글 폰트보다 더 빠르고 쾌적하게, Bunny Fonts

 

폰트 정보를 떠올릴 때, 우리가 가장 먼저 생각하게 되는 서비스는 ‘구글 폰트'가 아닐까 싶습니다. 그만큼 다양한 폰트가 포함되어 있고, 원하는 조건에 따라 빠르게 찾아볼 수 있기 때문입니다. 아래 이미지에서 볼 수 있는 것처럼 한글 적용이 가능한 폰트가 꽤 많이 담겨 있기도 하고요. 다만, 구글 폰트의 페이지 로딩 속도가 느려질 때가 있다는 점은 종종 불만으로 다가왔습니다. 그러던 중 특별한 프로젝트를 하나 발견하게 되었습니다. 바로 빠른 속도와 쾌적한 환경을 자랑하는 ‘Bunny Fonts’입니다.

 

구글 폰트
 

1492개 폰트 정보를 더 빠르게 찾고 적용할 수 있는 곳

Bunny Fonts
<출처: Bunny Fonts 홈페이지>

 

오늘 소개할 폰트 서비스 ‘Bunny Fonts’는 기존 서비스(구글 폰트 등)에서 느낀 불편을 개선하기 위해 시작된 프로젝트입니다. 이들이 내세우는 두 가지 차별화 포인트는 (1) 구글 폰트보다 더 빠른 속도로 즐길 수 있다는 점 (2) 일반 데이터 보호 규칙(General Data Protection Regulation, GDPR)을 준수해 데이터 추적 등을 하지 않는다는 점입니다. 기본 구성은 구글 폰트의 모습과 비슷해 유사 서비스를 이용해봤으면 큰 어려움 없이 사용할 수 있습니다.

 

Bunny Fonts 메뉴
<출처: Bunny Fonts 홈페이지>

 

1,429개의 폰트를 A-Z 순서에 따라 리스트로 확인할 수 있는데, 특정 조건에 따라 더 빠르게 원하는 폰트를 찾을 수 있습니다. ① 이미 바라는 폰트가 있는 경우 검색 기능을 활용할 수 있습니다. 검색 서비스가 아닌 폰트 제공 서비스에서 검색 기능을 활용할 경우, 텍스트를 미리 입력하거나 사이즈나 유형 등을 빠르게 적용해볼 수 있다는 장점을 그대로 가져갈 수 있습니다.

 

② 기본 제공되는 텍스트가 입력되어 있으며, 몇 가지 샘플을 선택해 폰트에 따라 확인할 수 있습니다. 또 직접 입력할 수 있어 조건에 맞는 폰트를 찾은 뒤 문구에 따라 잘 맞는지 살펴볼 수 있습니다. 물론 문구를 먼저 선택 또는 입력한 뒤 다른 조건을 추가해 폰트별 모습을 보는 것도 가능합니다. ③ 폰트 사이즈는 슬라이드를 조절, 15~40px 범위 내 선택할 수 있으며, 직접 입력하는 것은 어렵습니다.

 

④ 가장 중요한 조건 중 하나인 필터입니다. 필터에는 하나의 폰트가 지닌 스타일의 수는 물론 어떤 타입의 폰트인지 6가지 선택지 중 하나를 입력할 수 있습니다. 다중 선택이 되지 않는 점은 조금 아쉽습니다. 또 지원하는 언어 선택도 가능한데, 한글을 지원하는 폰트를 찾을 때 유용하게 사용할 수 있습니다. ⑤ 정렬 기능도 제공하기에 앞선 조건들과 잘 조합할 경우 탐색을 더 쉽게 가져갈 수 있다고 생각합니다.

 

Bunny Fonts 서비스 주요 메뉴
<출처: Bunny Fonts 홈페이지>

 

검색, 필터 등의 도구 위에는 서비스 주요 메뉴가 자리 잡고 있습니다. 눈에 띄는 기능은 ‘다크 모드'입니다. 다크 모드 지원이 반가운 이유는 라이트, 다크 모드에서 원하는 문구가 적용된 폰트의 모습을 빠르게 확인할 수 있기 때문입니다. 버튼 클릭 한 번으로 다크 모드를 활성화하거나 비활성화할 수 있습니다.

 

Bunny Fonts 리스트 뷰
<출처: Bunny Fonts 홈페이지>

 

폰트를 확인할 수 있는 리스트 뷰는 위의 모습을 기본으로, 1열 목록 형태로 확인할 수 있습니다. 폰트를 한 개 단위로 스크롤을 활용해 보고 싶으면 ‘디스플레이 조건’을 변경해 활용하시면 됩니다. 리스트에 담긴 내용을 하나씩 살펴보면, 먼저 폰트 이름과 폰트에 담긴 스타일의 수 (폰트 이름: Actor, 포함 스타일: 1)를 볼 수 있습니다. 스타일의 수를 리스트에서 미리 알 수 있어, 상세 화면과 리스트를 자주 오가지 않는 것이 가능합니다. 폰트명과 스타일 수 아래로는 사용자가 선택 또는 입력한 문구에 해당 폰트가 적용된 모습을 확인할 수 있습니다.

 

Bunny Fonts 상세 화면
<출처: Bunny Fonts 홈페이지>

 

필요한 폰트를 찾아, 상세 화면으로 들어간 모습입니다. 리스트와 달리 상세 화면에서는 폰트와 관련된 더 자세한 정보를 읽을 수 있습니다. 다른 텍스트를 입력해 스타일에 따른 모습을 볼 수도 있고 사이즈 역시 변경 가능합니다. 폰트별 라이선스 정보 확인이 가능한 링크도 함께 제공하기에 사용 전 어떤 조건을 따라야 하는지 자세히 알 수 있습니다.

 

한글 지원 메뉴
<출처: Bunny Fonts 홈페이지>

 

앞서 살펴본 조건에서 언어를 한국어로 바꾸고, 샘플 텍스트 역시 한글 문장으로 변경한 모습입니다. 같은 문장이라도 적용한 폰트와 스타일에 따라 전혀 다른 모습을 갖기에 개별 폰트를 적용하는 것보다 전체 내용을 빠르게 확인하고 적절한 대상을 선택하는 데 많은 도움을 받을 수 있습니다.

 

한글 지원 폰트 상세 화면
<출처: Bunny Fonts 홈페이지>

 

한글을 지원하는 폰트의 상세 화면에서도 앞서 살펴본 것과 같이 문장을 변경하거나 폰트 사이즈를 쉽게 조절할 수 있습니다. 리스트를 통해서는 조금 넓은 범위 내 조건에 맞는 폰트를 찾을 수 있고, 상세 화면을 통해서는 스타일에 따른 모습을 확인할 수 있는 흐름으로 사용할 수 있도록 구성되어 있습니다. 글의 초반 말씀드린 것처럼, 구글 폰트를 자주 사용한 분들이라면 이전 경험을 해치지 않는 선에서 쉽게 사용할 수 있는 환경을 갖고 있습니다.

 

 

한 번은 꼭 써봐야 하는 이유

Bunny Fonts 차별점
<출처: Bunny Fonts 홈페이지>

 

이미 존재하는 서비스가 있고, 그 서비스를 사용하는 사용자가 많은 경우 굳이 다른 곳으로 이동해야 할 이유를 만들기 어렵습니다. ‘Bunny Fonts’도 그 사실을 잘 알고 있기에 소개 페이지 등에서 본인들의 ‘차별점'을 세 가지로 나눠 설명하고 있습니다. 그중 소스 코드 한 줄로 기존 구글 폰트를 대체할 수 있는 점이 가장 매력적이라고 생각합니다. 웹사이트의 소스 코드에서 ‘https://fonts.googleapis.com/css’ 대신 ‘https://fonts.bunny.net/css’로 교체하기만 하면 되기 때문입니다. 기존 Google Fonts CSS v1 API와 호환이 가능하도록 설계되어 있어 손쉽게 변경이 가능합니다.

 

이렇게 구글 폰트를 변경해 ‘Bunny Fonts’를 적용하면 그 자체로 GDPR 조건을 충족하는 것 역시 만족스러운 기능입니다. 이들은 미국 등 유럽 외 지역이 아닌, EU 지역에서 호스팅하고 있으며 데이터나 로그를 수집하거나 제3자에게 전달하지 않기 때문입니다. 물론 페이지 로드 등에 필요한 시간을 기존 서비스 대비 얼마나 줄여줄 수 있는지는 더 살펴봐야겠습니다. 그렇지만 이 조건까지 완벽하게 충족한다면 한 번의 수고를 투자할만한 가치가 충분히 있는 서비스가 아닐까 생각합니다.

 

요즘IT의 모든 콘텐츠는 저작권법의 보호를 받는 바, 무단 전재와 복사, 배포 등을 금합니다.

댓글 0

지금 써보러 갑니다

작지만 가치 있는 변화를 이끌어내는 서비스를 만들기 위해 노력하고 있습니다. 국내외 다채로운 IT 서비스와 트렌드를 살펴보는 것이 좋아 '지금 써보러 갑니다'를 운영하고 있어요.

다양한 컬러 생성과 활용으로 색 조합을 도와주는 ‘Coolors’

디자인

배경, 효과 등을 마음대로 조합해 아이콘을 만드는 ‘Iconray’

디자인

디자인 아이디어를 구체화할 수 있는 캔버스 ‘Easel’

디자인

이미지를 중심으로 다양한 피드백을 주고받는 ‘Picflow’

디자인

스크린샷을 목업 이미지로 편집하는 서비스, ‘Pika’

디자인

2억 개 이상 조합이 가능한 3D 아바타 생성 서비스, ‘Peeps’

디자인

업무에 바쁜 당신을 위한 기본 아이콘 제공 서비스, ‘heroicons’

디자인

앱 설치율을 높이기 위한 스크린샷 제작 서비스, PWA Screenshots Generator

디자인

“특정 주제 이미지를 한 번에!”…스톡 이미지 제공 사이트 모음

디자인

선택이 어려운 당신을 위한 컬러 조합 서비스, Reverb

디자인

여섯 가지 디자인 패턴을 제작하는 웹 서비스, Heazy Studio

디자인

다섯 가지 프로필을 쉽게 생성하는 피그마 플러그인, Avatarg

디자인

정적인 SVG 파일에 생동감을 더해주는, Designstripe

디자인

당신의 ‘선’ 작업을 돕는 2가지 서비스

디자인

레퍼런스 수집 및 관리가 쉬워지는, Substratum

프로덕트

커버 이미지 제작이 쉬워지는 서비스, Coverview

디자인

애니메이션이 포함된 목업 제작 서비스, ‘Animockup’

디자인

다양한 종류의 화살표 제작을 돕는, 'Fffuel'

디자인

프로필 제작을 위한 매력적인 툴 ‘Boringavatars’와 ‘Avvvatars’

디자인

핸드 스케치를 위한 만능 툴, ‘Printables’와 ‘Sneakpeekit’

디자인

디자이너가 원하는 컬러를 손쉽게, 'Atmos'

디자인

웹 페이지 구성 도우미 ‘Shuffle’

디자인

디자인 시스템에 필요한 UI 컴포넌트 모음

디자인

다양한 UI 설정을 실시간으로 적용하는 서비스 ‘셰이퍼’

디자인

보다 쉬운 웹 접근성을 위한 도우미 : The A11Y Project

디자인

취향에 맞게 아이콘과 일러스트 편집이 가능한: Shape

디자인

원하는 폰트 조합을 쉽게 찾을 수 있는: Archetype

디자인

디자인 패턴 제작 시 유용한 서비스들

디자인

디자인 작업 시 유용한 아이콘 제공 서비스들

디자인

다양한 그래픽 콘텐츠를 제작할 수 있는: Mega Creator

디자인

박스 디자인을 쉽게 생성할 수 있는: Box Shadow Art

프로덕트

웹에서 이미지 및 영상 편집을 쉽게 하고 싶다면?

디자인

피그마 작업 시 유용한 플러그인 Top3

디자인

빠른 목업 제작을 위해 알아두면 좋은 서비스들

디자인

웹사이트와 문서에 대한 피드백을 손쉽게! : Punchlist

프로덕트

디자인 작업 효율을 높여주는 크롬 확장 프로그램 5

디자인

원하는 스타일에 따른 컬러 조합 확인이 가능한: Huemint

디자인

특정 웹페이지의 벡터 콘텐츠를 확인하는: SVG Gobbler

디자인

컬러와 물결 패턴으로 배경을 만드는: Wicked Backgrounds

디자인

다섯 가지 컬러 조합으로 웹디자인 구성을 돕는: Happyhues

디자인

바우하우스 스타일의 패턴 디자인 생성: Bauhaus Art Generator

디자인

글래스모피즘 디자인 구현을 위한 CSS 생성 서비스: Glass UI

디자인

같은 분야를 다룬 글들을 권해드려요.

요즘 인기있는 이야기들을 권해드려요.

일주일에 한 번!
전문가들의 IT 이야기를 전달해드려요.

[구독하기] 버튼을 누르면 개인정보 처리방침에 동의됩니다.

일주일에 한 번! 전문가들의 요즘IT 이야기를 전달해드려요.

[구독하기] 버튼을 누르면 개인정보 처리방침에 동의됩니다.