読者です 読者をやめる 読者になる 読者になる

よなかのはなし

LifeHacks And Hello!Project Blog

手書き風フォントを使って署名が作れるWEBサービスまとめ

ライフハック ウェブ

f:id:hiroseyonaka:20160303221844p:plain

レトロやアナログなサイトデザインを作るとき、手書き風のサインをライティングページの下にちゃちゃと入れたいときがあります。そんな時に役立つサイン作成サービスや、味わいのあるハンドサイン風のフリーフォントをまとめました。

1、署名ドットコムを利用する

ウェブ上で自筆のサインを使いたい時、アナログで書いたものをスキャンして取り込みデジタル化するという方法があります。データ化したサインをブログやサイトの記事末尾に入れているのを最近よく見かけるようになりましたよね。

 

アナログで署名を作るときは自分でサインをデザインするより、ビジネスにも使えるよう「きちんと感」のあるものをプロに依頼することをおすすめします。1つきちんとしたサインを作っておくとフォーマルな場でもマナー違反になりませんし、会社やプライベート問わず長く使うことができるからです。

 

オンラインでのサイン制作は署名ドットコムがおすすめ。安価でデザイン性の高いサインが作れ、漢字にも対応しているので日本人でもOK。

 

f:id:hiroseyonaka:20160911031646j:plain

 画像:署名ドットコム公式サイト

 

署名ドットコム公式サイトへ

 

2、手書き風サインジェネレーターを使う

とにかく手間をかけずにパパっと手書きサインのデータを作りたいときは、手書き風フォントを使ってサイン作成ができるオンラインジェネレーターが便利です。

 

手書き風サインジェネレーターはまだ日本語対応のものが少なく、英語でしかサインを作れない場合がほとんど。ただ、ウェブフォントに比べるとアナログ感は出るし、何より作ったサインをjpegやpngで出力できるため自分で画像に加工する手間が省けるのはメリットです。

 

オンラインジェネレーターでサインを作る

手書き風のサイン画像を簡単に作りたいなら、オンラインジェネレーターのMy live signatureがおすすめです。

 

関連サイト

My live signature

 

サインの作成手順

1、署名ウィザードをクリックすると、下の画面が現れるので、「name」のボックス内に自分の氏名を入力。

 

f:id:hiroseyonaka:20150822211939p:plain

 

2、100種類以上の中から好きなフォントを選択し、下にある「NEXTボタン」でStep3へ。

 

f:id:hiroseyonaka:20150822212106p:plain

 

3、Step3では、サインの大きさを決める。

 

f:id:hiroseyonaka:20150822212212p:plain

 

4、Step4では、画像の背景と文字色の変更が可能。pngで出力されるので、背景を透過させることも出来る。

 

f:id:hiroseyonaka:20150822212324p:plain

 5、Step5では、サインの角度を決める。平行のままでよければ変更せずにすすめてOK。

 

f:id:hiroseyonaka:20150822212441p:plain

 

6、これで完成!「CLICK HERE TO DOWNLOAD YOUR SIGNATURE」をクリックすれば、PCに画像がダウンロードされる。

 

f:id:hiroseyonaka:20150822212546p:plain

 

 

【完成したサイン】

フォントは#9を選び、角度は#3を選択してやや傾けてみました。背景は透過。文字はブラックのままにするとこんな漢字のハンドサインが出来上がります。

f:id:hiroseyonaka:20150822212951p:plain

 

3、Googleフォントを使って手書き風サインを作る

 Googleが提供しているウェブフォントの中にはおしゃれな手書き風のフォントも含まれています。ウェブフォントを使えばCSSでの修正も簡単になるので、頻繁にサイトをカスタマイズし、尚且つ手書き風サインをデザインに組み込みたい人にぴったり。

 

Googleフォントのデメリットは日本語が使えないためどうしても英語での表記になってしまうことと、手書き風のフォント数が少ないこと。この2つを抜きにすればオンラインで手書きサインを作ることができる最も簡単な方法の1つです。

 

手書きっぽさ全開のおすすめGoogleフォント

 Pacifico

f:id:hiroseyonaka:20160911034702j:plain

 

Pinyon Script

f:id:hiroseyonaka:20160911035918j:plain

 

Satisfy

f:id:hiroseyonaka:20160911035939j:plain

 

Tangerine

f:id:hiroseyonaka:20160911035948j:plain

 

4、手書き風フリーフォントを使う

日本人が使う英語のサインは、筆記体を使用していてもすぐに分かるとか。その理由はいかにも学校で習いましたと言わんばかりの高校生が書くような字体をしているから。

 

f:id:hiroseyonaka:20150822214435p:plain

 

↑ちなみに高校生が書くような字体はこういうやつです。

 

英語圏に住んでいる人は、原型を留めないほど字を雑に崩す人が多い傾向にあります。いわゆる日本語で言うところの「草書体」のような感じで、とにかく読める読めないではなく書いときゃ良い的なものが多く、ビジネスマンでもかなり崩しまくっています。

割りと雑に崩した方がかっこよく見えるし、何よりおしゃれに見えるからだYO!だそうなんですが、こういう考えはいかにも欧米っぽいですよね。

 

数あるフリーフォントの中から、完全な独断と偏見で「これはこなれ感が出てセンスが良い!外国人ぽい!」と感じるものを選んでみました。

 

Signerica

f:id:hiroseyonaka:20160911041654p:plain

 出典:Signerica Font | dafont.com

 

 

Autograf

f:id:hiroseyonaka:20160911041712p:plain

出典:Autograf Font | dafont.com

 

 

GOOD KARMA

f:id:hiroseyonaka:20160911041313p:plain

 出典:Good Karma Font | dafont.com

 

 

Dear Joef:id:hiroseyonaka:20160911043039p:plain

出典:Dear Joe Font | dafont.com

 

 

Notera

f:id:hiroseyonaka:20160911041904j:plain

 出典:Notera Font | dafont.com

 

 

PW Signature two Font

f:id:hiroseyonaka:20160911042137p:plain

 出典:PW Signature two Font | dafont.com

 

 

PW Manuel

f:id:hiroseyonaka:20160911041933p:plain

 出典:PW Manuel free Font | dafont.com

 

 

まとめ

というわけで、オンラインでサインが作れるおすすめのサービスはこの4つ!

 

  1. 署名ドットコム公式サイト
  2. Mylivesignature
  3. Googleフォント
  4. 手書き風フリーフォント

 

手書き風のサインはネット上でも用途が広いので、もし興味のある方は利用してみてください。