デザイン

デザイン

「親しみ」表現だけじゃない!【手書き風フォント】を使ったWebデザインのアイデア集

161 views

以前ご紹介した「2016年に支持されたタイポグラフィのトレンド」の記事でも「手書き風フォント」が取り上げられていました。

 

手書き風フォントというと、ブランドに対する「親しみやすさ」を表現するものと直感的に感じてしまいますが、事例を見るとクールでスタイリッシュな表現にも向いていることがわかります。

 

そんな手書き風フォントの活用法が広がるWebサイトを各シーンごとに5サイトずつご紹介していきます。

 

手書き風フォントを使っているWebサイト5選

1.Mint Design

mint-design

http://mintdesigncompany.com/

小規模専門店のブランディングとデザインを行う会社で、Webサイトの全ての文字に手書き風フォントを使っています。そのことにより、この企業が制作するWebサイトが大衆化されておらず、クリエイティビティを感じさせ、競合他社と比べて抜きん出たものとなっています。

 

2.Vince and Marlene

vince-and-marlene

http://vinceandmarlene.com/

少し変わった手書き風フォントを使い、ウェディングWebサイトをユニークで楽しいものにしています。新郎新婦のパーソナリティが輝いて見え、ウェディングがとっくに終わっているのにも関わらず、RSVPボタンを押したくなります。

(※編集註:「RSVP」は仏語で「Repondez s’il vous plait.――お返事ください」の略で、ここでは結婚式への参加意思表明のこと)

 

3.We Are Island

island

https://weareisland.com/

Island Collectiveはデザインとマーケティングのエージェントです。こちらのWebサイトには太字のメッセージが手書き風フォントで描かれています。太字にすることでメッセージがより顕著になり人々の注目を集めています。

 

4.Skylark English

skylark-learning

https://skylarkenglish.com

高クオリティかつ楽しい子供教育用のリソースを提供しているWebサイトです。手書き風フォントを使うことでWebサイトを楽しく見せ、また、意図したメッセージが上手く組み合わさっています。

 

5.Serve Seattle

serve-seattle

 

http://serveseattle.org/

手書き風フォントを上手く使い、一番大切なメッセージに注目が集まるようにしています。メッセージが際立ち、Webサイト訪問者に対して強い印象を与えるでしょう。

 

次のWebデザインプロジェクトのための5つの手書き風フォント

1.Briella

briella

https://elements.envato.com/items/type/fonts/briella-QHFVL3

女性的なフォントで、ウェディングの招待状やバースデーカード、女性向けのビジネスのロゴ等に向いています。

 

2.Simplicity

simplicity

 

https://elements.envato.com/items/type/fonts/simplicity-typeface-AX9EHW

名前の通りとてもシンプルなフォントです。アクセントフォントとして有効で、特にナビゲーションメニューやヘッダーなどへの使用がおすすめです。

 

3.Little Wonder

little-wonder

 

https://elements.envato.com/items/type/fonts/little-wonder-font-PQTUP8

ディスプレイフォントとして使うのに十分な太字です。ヘッドライン、ポスター、Webサイトトップ画像との組み合わせなどで使うのに適しています。

 

4.Clarkson

clarkson

 

https://elements.envato.com/items/type/fonts/clarkson-script-DZTDPF

レトロな雰囲気のフォントです。アンティークショップやハンドメイド品を販売しているお店など、ヴィンテージ、レトロなイメージを持ちたいWebサイトにぴったりです。

 

5.Drustic Dialy

druistic-dialy

https://elements.envato.com/items/type/fonts/drusticdialy-JDLP5J

こちらもレトロな雰囲気のフォントです。太字であるため、ポスター、ロゴ、訪問者の目を引きたい箇所への使用をおすすめします。

 

まとめ

いかがだったでしょうか?

「手書き風フォント」と言っても、多様な用例・表現手法があることがわかりますね。ロゴタイプのアイデアのひとつとしてストックしておいてはいかがでしょうか。

 

(※本稿は「Using Handwritten Typography in Web Design」を翻訳・再編集したものです)

関連記事

おすすめ記事