ITエンジニア/デザイナ向けにオープンソースを毎日紹介

デザイン - フォントの記事一覧

プレミアムユーザー限定記事

MOONGIFTプレミアムは、月額500円の有料サービスです。詳細はこちらから

もっと見る

List

  • 2017/03/15

opentype.js - 既存のフォントをちょっと変更。JavaScript製のOpenType/TrueTypeフォントパーサー

フォントをイチから作るのは大変です。日本語フォントはもちろんのこと、英語フォントにおいても多数の文字をデザインしなければなりませんし、それが統一されたデザインになっている必要があります。そこで使ってみたいのがはopentype.jsです。opentype.jsは既存のOpenType/TrueTypeフォントのパーサー...

List

  • 2017/02/09

FiraCode - プログラミングの可読性が上がる(?)なリガチャフォント

プログラミングをしているとよく使う記号が出てきます。例えばES2015を使っていると度々出るのが `=>` でしょう。PHPであれば `->` でしょう。これらはもはやセットで語られるべき存在なのかも知れません。そんなプログラミング言語にマッチしたフォントがFiraCodeです。合字を使って面白い表現ができます。## ...

List

  • 2017/01/13

emoji-extractor - Appleの絵文字フォントを画像化

元々ガラケー辺りからはじまり、iPhoneで一気に花開いた絵文字はemojiとして世界中で使われるようになっています。スマートフォンでは当たり前のように使われますが、そんなスマートフォンで入力された内容をWebページで表示したり、自分のアプリで正しく表示しようと思うとコトです。そこで使ってみたいのがemoji-extr...

List

  • 2016/07/26

mononoki - プログラミング/コードレビュー用フォント

プログラミングをする際にはフォントにも気を配らなければなりません。Oと0がきちんと見分けがつくものでないと、タイポをした際になかなか気付きません。同様にIとlであったり、1とlも見分けが必要です。今回はプログラミング用フォントのmononokiを紹介します。プログラミングおよびコードレビュー用のフォントだそうです。##...

List

  • 2015/06/17

Monoid - 低解像度でも十分使えるプログラミング用フォント

プログラマーは常にディスプレイの文字を見続けています。そのためフォントの可読性はとても大事なことです。可読性の低いフォントや二つの文字が見分けがつきづらいフォントを使っていたらtypoして思わぬバグを生む可能性があります。今回はコーディングのために作られたフォント、Monoid

List

  • 2015/02/19

Myrica - Rictyをベースに視認性を向上したプログラミングフォント

プログラマーであればこだわりたいのがフォントです。特に英語は見やすくても日本語がつぶれてしまったり、誤認しやすいフォントを使っていると余計なバグが入り込む可能性が高まります。個人的にはRictyを使っているのですが、さらにそのRictyを継承してプログラマー向けに進化したフォントがMyricaです。## Myricaの...

List

  • 2015/01/30

keyboard-font – キーボードを表現した記号フォント

キーボードショートカットの説明をしたい時にはどう書くのが良いでしょう。よくあるのはWin + Shiftキーといった具合にテキストでの説明です。より分かりやすくするためにテキストを四角で囲んでキーを表現したりすることもあります。一つ、二つであればそれでもいいですが大量のキーボードショートカットを表現したいとなったらke...

List

  • 2014/08/02

Noto Fonts - 全ての言語をサポートする美しいフォント

オープンソースの日本語フォントは選択肢がとても少ないです。Webシステムと組み合わせたり、Web Fontとして安心して使える日本語フォントがあれば、Web上での表現も向上するでしょう。そこでGoogleとAdobeが協力して開発されたフォントがNoto Fontsです。英語だけでなく、アラビア語や日本語、韓国語、中国...

List

  • 2014/06/02

Sophora – 実際に手で書いて作られた手書きフォント

デザインをラフに仕上げたり、アイディアをメモする際はしっかりとしたコンピュータの文字よりも手書きで走り書きしておくくらいの方が修正する余地があって良いと思っています。最近ではタブレットのようにスタイラスと組み合わせて手書きでメモできる環境もあります。しかしPCでマウスで手書き風に文字を書こうと思ってもなかなかうまくいき...

List

  • 2014/03/06

Glyphr - ここまで出来るとは!Webベースのフォントエディタ

フォントエディタとしては十分な機能ですね!Web Fontの影響もあって、フォント自体の魅力が見直されています。特徴的なフォントはもちろん、プログラミングしやすいフォントや可読性高いフォントなど普段使いできるものを知っていると重宝するでしょう。そんなフォントをWebベースで作成、編集できるのがGlyphrです。HTML...

List

  • 2013/10/30

Ionicons – 必見!iOS 7風、ソーシャル系アイコンも取り揃えたWeb Font

またしても使い勝手の良さそうなアイコンフォントが出てきましたよ!Bootstrapはアイコンの表示に際して画像を使っています。しかしそれでは大きさの変化や色の変更に柔軟に対応できません。そこでFont AwesomeではWeb Fontを使ってアイコンを提供する形をとっています。今回紹介するIoniconsもまた同様に...

List

  • 2013/09/25

等幅なコーディング向けフォント「Anonymous Pro」

Anonymous ProはOpen Font Licenseのオープンソース・ソフトウェアです。プログラミングやWebデザインを行う際にフォントは厳選して選んだ方が良いです。より可読性、品質の高いフォントを選ぶのが良いでしょう。今回はその一つ、Anonymous Proを紹介します。Anonymous Proのレギュ...

List

  • 2013/07/28

Web Fontを使ってフォントデザインの差分表示「Tiff」

Tiffはnode/JavaScript製のソフトウェア(ソースコードは公開されていますがライセンスは明記されていません)です。フォントの世界はとても深く、ぱっと見では分からない詳細なところにまで心が行き届いていたりします。そこで使ってみたいのがTiffです。二つのフォントの差異をビジュアル的に確認できるソフトウェアで...

List

  • 2013/04/24

おすすめ!Photoshopのフォントをもっと選択しやすくする「ConceptualCase」

ConceptualCaseはPhotoshopのフォント表示を階層化し、Font Bookで管理できるようにするソフトウェアです。Mac OSX版のPhotoshopで作業している時に、フォントを選ぶのがとても面倒に感じていました。あれだけ長く並んでいると、多数のフォントをインストールしている場合に大変です。そこで使...

List

  • 2013/02/15

想像力を限界まで引き上げろ!フォントを使ったプロトタイプ作成「BLOKK」

BLOKKは全て塗りつぶしたフォントで、ワイヤーフレームを表現するのに利用できます。BLOKKはフォントですが、単純に真っ黒に塗りつぶしただけのフォントです。さらに言えばどれを入力しても真っ黒な四角が出るだけです。さて、何に使えるのでしょうか。真っ黒です。スペースキーだけは空白文字が出ます。お、何かに見えてきましたか?...

List

  • 2012/12/30

フォントを作るのに最適なフォント専用エディタ「Birdfont」

BirdfontはWindowsやLinuxで動作するフォントエディターです。フォントを作るというのは大変な労力を要すると思われますが、その手助けになりそうなソフトウェアがBirdfontです。メイン画面です。プレビューです。フォントを書く画面です。作成したフォントがここに入っていきます。英語圏のフォント向けになるよう...

43200?type=list&url=http%3a%2f%2fwww.moongift.jp%2fwp-content%2fuploads%2f2012%2f09%2fscreenshot-2012-09-25-21.50.49_thumb

  • 2012/10/06

Webデザイナー、プログラマー向けの可読性高いコーディング用フォント「Source Code Pro」

Source Code ProはAdobe社の開発したコーディング用のフォントです。プログラマー、Webデザイナーは日々コンピュータに向き合ってソースコードを書いています。そんな中でより可読性の高いフォントを用いるのは生産性をあげるためにも大事なことでしょう。そこで使ってみたいのがAdobe社の開発したSource C...

43254?type=list&url=http%3a%2f%2fwww.moongift.jp%2fwp-content%2fuploads%2f2012%2f04%2fscreenshot-2012-04-25-10.09.51_thumb

  • Premium_s 2012/09/28

業務で使えるオープンソース(46)「フォント」

今回のテーマはフォントです。世の中には数万のフォントがあり、デザイナーの方を悩ませています。さらに最近ではWeb Fontsの登場によって開発者まで悩ませる存在になっています。そこで今回はオープンソースのフォントや関連ツール、国内外のWeb Fontsサービスについて紹介します。

42711?type=list&url=http%3a%2f%2fwww.moongift.jp%2fwp-content%2fuploads%2f2012%2f09%2fscreenshot-2012-09-10-11.03.55_thumb

  • 2012/09/19

Webブラウザベースのフォントビューワー「ttf.js」

ttf.jsはJavaScriptでTrueType Fontを表示するソフトウェアです。フォントの世界は奥深く、世界中には無数のフォントが存在します。それらをインストールしたり、専用のフォントビューワーで確認するのではなく、ttf.jsを使って素早くチェックしてみましょう。トップページです。TrueType Font...

41562?type=list&url=http%3a%2f%2fwww.moongift.jp%2fwp-content%2fuploads%2f2012%2f08%2fscreenshot-2012-08-03-10.35.15_thumb

  • 2012/08/16

Adobe製。高品質なフォントファミリー「Source Sans Pro」

Source Sans ProはAdobe社がリリースしたオープンソースなフォントファミリーです。Adobeは言わずと知れたグラフィックス系ソフトウェアの最高峰とも言える企業なので、デザインに対する意識は並々ならぬものがあります。そんなAdobeがはじめてリリースするオープンソースのフォント、それがSource San...