世界を動かす技術を、日本語で。

自分の手書き文字をフォントにする

概要

  • 個人ウェブサイトをより 個性的 にするための工夫
  • 手書き風フォント 作成の試行錯誤
  • オープンソースツール の課題と限界
  • Calligraphrの 快適な体験 とビジネスモデル
  • フォント作成を通じた 気づきと満足感

個人ウェブサイトを「自分らしく」する工夫

  • サイトに 個性 を出すためのデザイン改善
    • 記事内画像に セロテープ風 の装飾
    • 関連投稿リンクに アニメーション付き波線 ボーダー
  • ヘッダーのフォントを モノスペース から 手書き風 へ変更希望
  • 市販フォントに満足できず、 自作フォント への挑戦

オープンソースツールでのフォント作成苦労

  • フォント作成には ベクター画像 を用意し、 FontForge などで編集
  • Inkscapeで 文字を作成 し、FontForgeに インポート を試みる
  • FontForgeの 直感的でないUI に苦戦
    • 起動時のダイアログ、メニュー操作の不便さ
    • インポート手順の煩雑さ、ベジェ曲線の調整困難
    • 途中で 挫折 し、怒りの終了
  • InkscapeのSVGフォント機能も 複雑 で断念
  • オープンソースの 操作性の限界 を痛感

Calligraphrによる手書きフォント作成体験

  • Calligraphr はテンプレート印刷→手書き→スキャン→アップロードの流れ
  • 無料版と 1ヶ月単発課金 可能な有料版(£8)という 良心的な料金体系
  • テンプレートに Sharpie で記入し、iPhoneで スキャン
  • 必要な文字セットや リガチャ (合字)も追加
  • 使いたくないバージョンを 除外 し、複数バージョンで自然な仕上がりに
  • フォントの プレビュー個別調整 も直感的
    • ベースライン・サイズ・文字間隔の微調整
    • ゴミピクセル の削除で表示の乱れを修正

フォント作成の振り返りとCalligraphrの評価

  • 実際にウェブサイトで利用し、 手書き感判読性 の両立を実感
  • オープンソースツールよりも 短時間で満足度の高い成果
  • サブスクリプション終了後に データのエクスポート を自動で送付
    • JSON形式で将来的な再利用も可能
  • Calligraphrの ユーザー本位なビジネス姿勢 に感動
    • 明朗な価格表示、自動更新なし、データ持ち出し自由
  • 手軽で楽しい体験 として、手書きフォント作成を推奨

Hackerたちの意見

スカイモールには、これをサービスを通じてできるようにするためのフォームがあったんだよね。昔は手書きで記入して、郵送してたんだ。

スカイモール、笑。思い出をありがとう、って感じ。

エイミー・グッドチャイルドのアプローチを実際のフォントファイルに変える方法ってあるのかな? https://www.amygoodchild.com/blog/cursive-handwriting-in-jav...

チャイキンのパスをベジェ曲線に「変換」することになると思う。それからメタフォントのフォントを生成できて、そこからTTFやOTFなどが得られるんじゃないかな。

2013年に自分の結婚式のウェブサイトのために似たようなことをやったよ。郵送サービスを使って、そこそこ良いTTFを作ってもらって、それをWOFFに変換したんだ。今もオンラインで見られるよ、https://ruthandjosh.net/story/ (注意、ミレニアル世代の恥ずかしい話が待ってるよ)

心が温まったよ、素敵な人生を一緒に過ごしてね。

そのク cringe、ありがとう! 週の終わりにぴったりな感じだね。シャバット・シャローム。

ルースは、あなたなしでフライト中にシャンパンを飲んでたって本当?

なんて素敵なんだ! 遅ればせながら、おめでとう!

いやー、楽しかった!

そのサイト、ずっと残してほしいね。リンクが腐る時代に、なんて素晴らしいことなんだ。

大好き!!

いい話だね。ほとんどの人は「運命」みたいな出会いはしないけど、君はしたんだね。

素敵な話だね、全然恥ずかしくないよ。

これ大好き、手作り感が最高だね。

ティーンエイジャーの頃、好きだった女の子の手書きからTTFフォントを作ってプレゼントしたことがあるんだ。あれは本当に大変だったな。コーレルドローのツールを使って、彼女がアルファベットを書いてくれた紙をスキャンして、手作業でベクター化したんだ。めちゃくちゃ時間がかかったよ。あれから四半世紀が経って、あの頃の若さの無邪気な頑固さに驚かされる。誕生日のためだったけど、すごく時間をかけて、ほとんど何をしているのか分からなかった。でも、なんとか成功したのは、きっと無知だったからだね。

それで、彼女はどうなったの? 努力は報われたのかな? 幸せな結末になった?

ミックステープより全然いいね。自分の字を書くのは罰ゲームみたいだ。

自分の手書きはすごく下手で、書くたびに悪化していくんだ。悪循環みたいなもので、手書きが下手だから全部タイピングするし、手書きを練習しないからどんどん下手になる。もし誰かが自分の手書きを基にしたフォントを作ったら、それは暗号ハッシュとして使えるかも。手書きのメッセージをタイピングするのと比べて、あまり個人的じゃない気がするけど、手書きのフォントがあれば少しは解消されるかもね。

これをブラックメタルのアルバムカバー用のフォントに使ったらどうかな。

手書きの方がタイピングよりも記憶に残るって言うよね。そう思う。気になっているのは、タブレットに書いて、その手書きをデジタル化したらどうなるかってこと。手書きのプロセスから同じ効果が得られるのかな?自分の手書きで情報を見ることに価値があると思うから、こういうフォントをデジタル化する方が、手書きしてから伝統的なフォントにデジタル化するよりも良いかもしれないね(それが記憶を高める一因かも)。

視覚的な要素が影響してるかもしれないけど、振り返ってみると、手書きのノートはタイプしたものよりも頭に残りやすかった気がする。大学時代、パートナーと一緒にタブレットでノートを取ってたけど、手書きのノートと同じくらい、いやそれ以上に便利だったよ。紙だと後で参照しなきゃいけないトピックを大きな矢印で繋げるだけで済むから、すごく自由に矢印や視覚的なリンク、余談を使えるしね。8.5x11インチの紙に縛られないから、もっと自由に使えるんだ。

一つ気になっているのは、タブレットに書いて、それがデジタル化されたらどうなるのかってこと。手書きのプロセスから同じ恩恵を受けられるのかな? 私の経験では、受けられるよ。私はBooxのE-inkタブレットを使って書いてるけど、スタイラスで書くことで記憶に定着するのは完全に同意する。タイプしたものは、また見返さないといけないからね。

これは自慢じゃないけど、経験を共有したいんだ。俺は121ワード/分で打てるんだけど、手書きだと全然集中できないんだよね。遅すぎて、考えをまとめたり、言ってることをキャッチしたりするのに集中できなくて、すごくそわそわしちゃう。しかも、字が下手だし。自分が完全に没頭してアイデアを処理してるときの方が、思い出しやすいんだよね。手書きのスキルが足りないだけかも。学校で習ったし、ほとんどの人生で手書きのノートを取ってきたけど、当時はうまくやれてなかった気がする。

手書きの方がタイピングよりも記憶に残るって言うけど、俺もそう思う。書くことは、ADHDの傾向を抑えるためのツールの一つなんだ。いろんなサイズのジャーナルがあって、ゾーンに入ってるときは、自分の言葉でその瞬間をキャッチするんだ。ノートに線やアートを描いて、別の日に数行をスキャンするだけで、そのアイデアや言葉が頭に浮かんだ瞬間にすぐ戻れるんだよね。タイピングが得意な人は、そうする理由がないとは思わないけど、俺にとってはペンと紙なんだ。みんな違うし、「人それぞれ」っていう言葉を強く信じてるよ。

確か、Microsoft Font Makerは今でも(あまり良くはないけど)Windows Inkスタイラスで無料で使えるはず。数十年前に何を使ってたかは覚えてないけど、Windows Tablet PC用のPowerToyだったと思う。 https://apps.microsoft.com/detail/9n9209f8s3vc?hl=en-US&gl=U...

これは02006年にもっと手動でやったことがあるよ:http://canonical.org/~kragen/oilpencil/ 当時やった手順は今でも通用するはずだし、クリスが「自分でやるのに失敗した」で諦めたことに挑戦してるなら、興味があるかもしれないね。代替アプローチの結果に満足してないなら特に。

2000年代に昔のブログでこれやったことあるよ。オンラインサービスを使って、ひどいフォントを作ってもらって、それをFontForgeで何とか見られるものに整えたんだ。面白い新鮮さがあったけど、字が下手だから、時々自分の手書きでコメントで叩かれたりもした。

あなたとその旅に拍手を送りたい。オープンソースの代替を諦めて、安くて自分のものにできる選択肢に切り替えるって、悪いトレードオフじゃないと思う。あなたの話、共感できるよ。私も独学でクリエイティブなことやってるけど、特定の技術やツールを使いたくて頑固になっちゃうことがある。多分、埋没費用バイアスの強迫観念みたいなもんかな。あなたのサイトデザイン、個性があっていいね。PS: Firefoxのブラウザで、フォント、開発者ブログ、クリエイティブサイト、ブティックデザインのタグをつけてブックマークしたよ。