街中で見かける広告やパンフレットに使われているフォントを、自分のデザインに取り入れたいと思ったことはありませんか。

ですが、印刷されたテキストを見ただけでは、フォント名の特定が難しいこともあります。
そんな時は、カメラで撮影するだけでフォント名を特定できるフォント検索アプリを利用してみてはいかがでしょうか。

今回は、WhatTheFontアプリの使い方を紹介します。
WhatTheFontアプリは、無料で利用できるフォント検索アプリです。検索したフォントをそのまま購入することもできるので、デザインの参考だけでなく実務面でも役立つでしょう。

※本文中では、iOS版のアプリを利用しています。Android版とは表示が異なる可能性があるので注意してください。

WhatTheFontとは

MyFonts__Fonts_for_Print__Products___Screens.png
https://www.myfonts.com/WhatTheFont/mobile/

「WhatTheFont」は、画像を元にしてフォントを検索できるサービスです。
ブラウザ上で起動するデスクトップ版とスマートフォン向けのアプリ版が提供されており、ともに無料で利用できます。

フォント販売サイト「MyFonts」が提供しているサービスであり、検索からフォントの購入までを一貫して行えるのも特徴的です。

ただし検索できるフォントは欧文フォントに限られます。
日本語や中国語などのフォントには対応していないので注意してください。

参考:
雑誌やホームページに使われているフォントを特定できる!フォント調査ツール6選|ferret [フェレット]

WhatTheFontアプリの使い方

スクリーンショット_2017-11-15_17.47.11.png

上記は、WhatTheFontをアプリを使って、10種類のフォントを検索した結果です。
10種類中3種類フォントがほぼ正しいフォント名を予測しました。

WhatTheFontアプリはAIによるディープラーニングを採用しており、アプリが利用されるごとに精度を高められていきます。
今後、利用回数が増えていけば、さらに正解率も上がることが期待できます。

それでは、WhatTheFontアプリの使い方を紹介します。

1.インストールする

WhatTheFontを App Store で
WhatTheFont - Google Play の Android アプリ

上記のURLから、アプリをインストールします。

スクリーンショット_2017-11-15_18.18.36.png

「入手」をクリックして、インストールを開始してください。

なお、WhatTheFontアプリはブラウザアプリのため、ネット回線がつながっていない環境では利用できません。
アプリを利用する際はネットにつながっていることを確認してから立ち上げてください。

2.撮影する

アプリを立ち上げると、以下のようにカメラへのアクセス許可を求められます。
「OK」をクリックして、許可しましょう。

スクリーンショット_2017-11-15_18.14.26.png

カメラの画面に切り替わったら、調べたいフォントにかざして、画面中央の青い丸ボタンをタップして撮影します。

フラッシュを消したい場合は、画面右に表示される雷のアイコンをタップしてください。
続けて、画面左のイラストのアイコンをタップしてみましょう。端末本体に保存されている画像をアップロードしてフォントを検索できます。

スクリーンショット_2017-11-15_18.25.01.png

写真をスマートフォン本体のライブラリに追加していいか許可が求められるので「OK」をクリックしてください。

テキストの識別が終了すると、上記ののようにテキストに枠組みのついた画面が表示されます。

3.写真の傾きを修正する

スクリーンショット_2017-11-15_18.32.07.png

写真が傾いていてテキストがうまく識別できない場合、画面左のアイコンをクリックして傾きを修正します。

スクリーンショット_2017-11-15_18.32.33.png

上記のように編集画面に切り替わります、画面下にある白の縦線より右側にスワイプすると右回りに傾き、左側にスワイプすると左回りに傾きます。

傾きを直しながら、テキストが平行になるよう調整してください。

また、画像のトリミングを行えば、テキスト以外の不要な背景を除外することができます。
白い枠を上下左右に動かして、必要なサイズまで縮めてください。

傾きやトリミングする画像のサイズが定まったら、画面中央の「→」のボタンをタップします。

4.テキストの枠取りを調整する

テキストを正しく識別するには、枠取りをテキストのサイズに合わせて調節する必要があります。
枠取りをタップすれば枠取りのサイズや位置を上下左右に変更できるので、テキストに合わせて調整してください。

また、無駄な枠取りは削除し、枠取りが足りない場合は追加しましょう。

スクリーンショット_2017-11-15_18.38.08.png

削除したい場合:枠取りをタップし、表示されるゴミ箱のアイコンをタップする。
追加したい場合:画面右のアイコンをタップする。

5.調べたいテキストの枠取りをタップし、検索結果を確認する

スクリーンショット_2017-11-15_18.43.57.png

調べたいテキストの枠取りをタップすると画面に「→」のボタンが表示されるので、タップしてください。
自動でテキストが識別され、上記のように画像から推定されるフォント名が複数表示されます。

スクリーンショット_2017-11-15_18.48.24.png

また、画面上に表示されるペンのマークをタップすれば、表示されるテキスト列を編集できます。
画像の中のテキストと見比べながら、どのフォントが正しいか確認しましょう。

6.フォントを購入する

フォントを購入したい場合、検索結果フォント名をタップします。
以下のようにフォントの詳細画面が表示されるので、「購入する」をタップします。

MyFontsのフォント詳細ページに移動するので、購入手続きを行ってください。

スクリーンショット_2017-11-15_18.51.23.png

また、「シェアする」というボタンをタップすると、作成団体名などのフォントの詳細情報をSNSでシェアできます。

参考:
スマホで撮影するだけでディープラーニングのAIがフォント名を教えてくる無料アプリ「WhatTheFont」|GIGAZINE