WEB業界で働く人や興味がある人に役立つ情報サイト“qam(カム)”

スーザン

2015/05/22

無料で作れる!自作フォントでもっとデザインを楽しもう♪

投稿者: スーザン
カテゴリー: デザイン >フォント

以前ご紹介したWEBフォント無料でダウンロードできるフォントなど、自由に使用できるフォントが増え、文字を表現するのが手軽になってきました。

フォントの数が増えるとデザインや表現の幅が広がります。

しかし、数多くあるフォントの中からしっくりとくるものを探すのにもなかなか一苦労することも。
既存のフォントを使用し、そこに装飾をしていくのもいいのですが、文字が修正されたりするとまた調整し直し・・・なんてことも。

そんな時、デザインにより合ったフォントを自分で作ることで時間短縮と修正対応も簡単に!

今回は無料で簡単にオンライン上で作ることができる、自作フォントサイトと作り方をご紹介したいと思います。

PaintFont

Paint Fontは、手書き文字やイラストレーター、フォトショップなどを使って自作した文字を、無料でフォントに変換してくれるオンラインサイトです。

手順

言語を選択

1

上記の中から使用したい言語のフォントを選択します。
選択しない場合はデフォルトで表示されている言語になります。

文字を決める

フォントにしたい文字を以下のような手順で選んでいきます。

2

  1. 不要な文字を削除
  2. 青い四角に囲まれている文字の中から作成したい文字だけを残します。
    不要な文字をクリックして削除します。

    今回は0~9までの数字フォントを作ることにしました。

  3. 拡張子を選択
  4. 手書きの文字にしたい場合はPDF。イラストレーターやフォトショップなどを
    使用して作成する場合はPNGを選択するとよいです。

  5. ファイル名を決める
  6. 任意のものでも、デフォルトのものをそのまま使用してもOKです。

  7. テンプレートを出力
  8. create template(s)ボタンを押し、テンプレートを出力します。

文字を作成

3

こちらが先程ダウンロードしたテンプレートです。

4
テンプレートに沿って文字を作っていきます。
今回はひげのイラストと手書き風数字を組み合わせています。

PDFの場合は印刷をして紙に文字を書いていきます。
PNGの場合は画像の上に文字を作っていきます。

作成が完了したら、jpg、png、pdf いずれかの拡張子で保存をします。

フォントに変換

先程のテンプレートデータをアップロードし、フォントファイルへ変換をします。

5

  1. タブを選択
  2. Upload filled out templatesタブを選択します。

  3. データをアップロード
  4. 先程作成し、jpg、png、pdf のいずれかで保存したデータをアップロードします。

  5. フォント名を決める
  6. 任意のものでも、デフォルトのものをそのまま使用してもOKです。

  7. フォーマットを選択
  8. フォントのフォーマットを選択します。

  9. フォントを作成
  10. Send fileボタンを押し、フォントを作成します。

6

このようにプレビュー画面が出てきたら、Download myfont.otf(.ttf)ボタンを押してフォントをダウンロード。

完成

7

先程ダウンロードしたotfファイルをパソコンに読み込ませ、フォントとして使用した画像です。
今回は少々ふざけた文字を作成しましたが、かわいらしい手書き文字や筆文字など用途に合わせて使ってみてくださいね。

コーディング業務のご依頼、ご相談の詳細についてはこちらから

最後までお読みいただき、ありがとうございました。

よろしければシェアしていただければ幸いです。

  • このエントリーをはてなブックマークに追加

関連記事

よろしければこちらの記事もお読みください。

WEB業界ならqam!qam(カム)はWEB業界で働く人や興味がある人に役立つ情報サイトです。
マーケティングやデザイン、マークアップ(コーディング)、プログラム、トレンドなどの情報をqamライター陣が執筆。噛めば噛むほど(読めば読むほど)制作・開発や運営・運用、業界知識やノウハウを学ぶことができます。

トップへ