誰でも簡単！自作フォント作成の「PaintFont」が、あまりにも手軽だったのでフォントを作ってみました
PaintFont.comというフォント作成サービスを最近知りました。 このサービスは、手書きの文字でも、イラストレーターなどで作成した文字でも、無料で手軽にフォントに変換してくれるサービスです。 僕も、以前からちょっとフォントの作成に興味があったので、試しに作ってみることにしました。 photo by Connie Ma フォント作成の主な手順 PaintFontでフォントを作成するのに必要な、主な手順は以下の6手順です。 必要な文字を追加して選択 不要な文字を削除 テンプレートをダウンロード テンプレートにフォントとなる文字を書き込む 文字を書き込んだテンプレートファイルをアップロード フォーマットを選んでフォントを作成 これだけの手順がありますが、半角英数字のみのフォント作成でしたら、30分ほどで作ることができました。 ※今回僕は、マウスで結構適当に文字を書いたので30分で済みました
文字詰めできるCSSのfont-feature-settingsが凄い！ 日本語フォントこそ指定したい自動カーニング - ICS MEDIA
游ゴシックではプロポーショナルメトリクスは効果的 WindowsやmacOSに搭載されている游ゴシック体は、仮名が漢字に対してかなり小さめにデザインされています。游ゴシック体ではヒラギノ書体より字間が開いて見えてしまうため、プロポーショナルメトリクスを活用する効果は大きいです。 Webフォントにもプロポーショナルメトリクスは効果的 デバイスフォントだけでなく、Webフォントでもプロポーショナルメトリクスに対応したOpenTypeフォントがたくさんあります。Webフォントに関しては記事「Webフォントサービスの徹底比較！ 和文フォントが使える5つのサービスの利点まとめ」を参考ください。 ▲左側は未指定（和文等幅）の状態でカタカナの開きが大きい。右側はプロポーショナル字形を適用した状態で、カタカナが詰まっている。 対応環境：ほぼすべてのブラウザで利用可能 これだけ便利なCSSですが、どれだけの
フォントや文字のデザインをUI上で見やすくするコツをまとめた「Typography for User Interfaces」
by Marco / Zak ウェブサイトやアプリをデザインするにあたって、使いやすい・読みやすいコンテンツを作成するために必ず考えなければいけないのが「情報をどのように配置するのか」ということ。情報の多くは文字や文章で表示されるということで、ウェブデザイナーのViljami Salminenさんが、なぜウェブデザインにとって文字列が重要になるのか、どうすれば読みやすい文字列をデザインできるのかをまとめています。 Typography for User Interfaces | Viljami Salminen https://viljamis.com/2016/typography-for-user-interfaces/ ◆グラフィカルユーザインタフェース(GUI)の成り立ち GUIの歴史の中で重要な転換点にいるのが、マウスによるウィンドウ操作を初めて導入したゼロックスのコンピューター
デザイナーが持っていたい、すごいフリーフォント素材42個まとめ
デザインをしているときに悩んでしまいがちで、全体のイメージを決める重要な要素のひとつ、フォント選び。手持ちのフォントコレクションを定期的にアップデートして、クリエイティブな作品をつくってみましょう。 今回は、最近公開された無料ダウンロードできるフリーフォント素材をまとめてご紹介します。太さに応じて豊富なウエイトが用意された書体から、今年のトレンドでもある手書き、ブラシスタイルの他に、人気の高い美しい筆記体デザインなどが揃っています。 詳細は以下から。 デザイナーが持っていたい、すごいフリーフォント素材まとめ あさご本丸ゴシック 伝統的な雰囲気でありながらも、クルクルとしたループ状の線が個性的でモダンさを感じるエレガントな書体だそうです。 ※ 個人利用可能 Margurite 流れるように美しい筆記体スタイルで、リガチャ合字なども豊富に用意された、プロユースのデザインフォント。 ※ 個人利用
游とMerriweather
少し前にこのサイトのデザインをちょっと変えて、「本文は明朝、ただし見出しや強調などはゴシック」というスタイルにしています。と言っても、本文が明朝で表示されるのは游明朝体かヒラギノ明朝体が使える場合だけで、それ以外の環境ではゴシックになるはずです。 欧文書体は和文の従属欧文ではなくMerriweatherです。セリフとサンセリフのファミリーがあることと、エックスハイトが高く和文との相性が良いことから選びました。ウェイトは和文とのバランスから400ではなく300を使っています。MerriweatherはGoogle FontsやTypekit、Font Squirrelなどで入手できます。 CSSの指定としては、まずデフォルトがMerriweather Sansとゴシック体の組み合わせ。そして游明朝体またはヒラギノ明朝体が使えるかどうかをJavaScriptで検出し、もし使えれば本文でMerr
持っている日本語フォントがそんなに多くなくても、文字デザインの表現の幅を広げる日本語フォントの組み合わせ方
フォントはデザインにおいて、非常に重要な要素です。 プロのデザイナーが当たり前のようにやっていることが、初心者には見落とされていたり、実践されていないこともあります。 持っている日本語フォントがそんなに多くなくても、文字デザインの表現の幅を広げる日本語フォントの組み合わせ方を紹介します。 先週紹介したスライドと同じく、日本語デザイン研究会中部の勉強会でプレゼンされた日本語のタイポグラフィのスライドで、特別に掲載許可をいただきました。 DTPの勉強部屋（名古屋）で登壇しました 日本語デザイン研究会中部は、タイポグラフィの大切さと楽しさを伝えるため・学ぶための交流の場として結成されました。 スライドは全部で51ページ。 フォントに含まれている全ての字形がバランスよく、カッコいいものはあまり多くはありません。多くのデザイナーが使用している各フォントの特徴を理解し、漢字と仮名、そして英数字・約物・
スタイルシート［CSS］/テキスト・フォント/要素の前後に内容を追加する - TAG index
:before と :after について :before … 要素の直前に対する指定 :after … 要素の直後に対する指定 :before と :after に関する詳細は、疑似要素の指定をご覧ください。 追加する内容 ここでは3種類の値を説明しています。（この他に、引用符を挿入することもできます） 文字列を追加する 文字列を追加する場合は、追加したい文字列を次のような形式で指定します。（文字列を引用符で囲みます） content: "追加するテキスト"; 例えば、p要素の直前に文字列を追加したい場合は、次のような指定内容になります。 p:before { content: "追加するテキスト"; } 文字列の中に引用符を入れたい場合は、次のようにバックスラッシュ（ \ ）でエスケープしておきます。 content: "追加する\"テキスト"; 画像等を追加する 画像等を追加する場合
無料でもOK！手軽に使えるTypekitの日本語Webフォント14個 | PRESSMAN*Tech
源ノ角ゴシック・小塚ゴシック・小塚明朝など、AdobeのTypekitにて14種類の日本語Webフォントの提供が始まりました。今までTypekitの日本語フォントはアプリケーションでの利用に限定されていたため、Webフォントとして使えるのは今回が初めてです。 目次：Adobe Typekitとは？日本語フォントを読み込んで重たくならない？TypekitのWebフォントの使い方は？動作環境と注意点日本語Webフォント全14種類源ノ角ゴシック無料りょうゴシック PlusNりょう Display PlusNりょう Text PlusN平成角ゴシック StdN平成角ゴシック Std無料平成丸ゴシック Std無料平成明朝 Std無料平成明朝 StdNかづらき SP2N小塚ゴシック Pr6N小塚ゴシック Pro小塚明朝 Pr6N小塚明朝 Pro※Adobe Typekitのサービス内容は、2015年6
文章の作り方 - 伝わるデザイン 研究発表のユニバーサルデザイン
研究者や研究に関わる大学生や大学院生は、一年を通じて研究室ゼミや学会などで研究成果の発表を行なわなければなりません。また、近年、科学者でない人たちに対する一般向けのプレゼンや講演（アウトリーチ活動）の機会も増えてきています。他にも、研究論文や報告書を書いたり、研究費調達のために予算申請書やプロジェクトの提案書を作成したりすることも、研究者にとって欠かせない仕事です。これらはいずれも情報を他者（研究仲間や審査員、一般市民）へ伝えようとする行為であり、正確かつ効果的な情報の発信が望まれます。しかし、自己流で資料を作成して、闇雲に情報を発信していても、スムーズに情報は伝わりません。ときには誤った情報が伝わってしまい、研究の価値を正当に評価してもらえないことさえ起こりえるのです。 情報を正確にかつスムーズに他者に伝えるためには、情報をデザインすること、つまり文章を読みやすく整えたり、図表を見やすく
厳選！最近公開された日本語のフリーフォント15種類のまとめ
2014年暮れから2015年にリリースされた、個人や商用で利用できる日本語の無料フォントを紹介します。初紹介のものもけっこうあるので、見逃さないように要チェックです！ フォントの利用にあたっては、個人サイトや商用サイト、同人誌や各種印刷物などの紙での利用も確認して明記しました（2015年4月現在）。 フォント紹介の前に各フォント制作者からのお願いごと。 フォントを利用の際には必ず利用条件やライセンスをご確認ください。 もっとフォントをという人は、下記ページもどうぞ！ 2019年用、日本語のフリーフォント 366種類のまとめ フォント：はれのそら明朝 写真：春の青空 個人・商用サイトで無料利用可。同人誌や各種印刷物なども可。 少し墨だまりを含んだ角丸のすっきりしたデザインで、横書きだけでなく縦書きでも楽しめるオールド系明朝体。
連載『嘘じゃない、フォントの話』(supported by モリサワ) 第3回：フォント職人に聞く フォントができるまで | CINRA
何気なく見ている文字が出来るまでに、こんなに時間も手間もかかっていたなんて、本当に驚きました。そこで、ベテランのフォント職人である市川秀樹さんに、普段どんなことを考えながらフォントを作っているのか、現場での話をお伺いしました。 C：フォントを作るって本当に大変ですね！ そうですね。1つのフォントができるまでに何年もかかります。こんな風にフォントが作られているなんて、誰も知らないでしょうね。 C:そもそも、市川さんがこの世界に入ったきっかけは何だったのですか？ 中学校時代に、私の作ったポスターが入選したんです。それが嬉しくて、その後も文化祭のポスターなども作りました。ある時、ポスターカラーを使って手書きで描いたポスターが、公衆浴場に張り出されたんです。しかも女湯に（笑）。それが、張り終わった後に手元に戻ってきたんですが、文字の部分がドロドロになっていました。ポスターの文字を立体に見えるように
ロゴデザインやタイポグラフィのセンスを街中で磨く方法
デザイナーとして多数の作品を手がけ、自身の作品がパリのルーブル美術館に収蔵されているジェームズ・ビクトル氏が、ニューヨークの町中を歩き回りながら、お店の看板のデザインを見てフォントやタイポグラフィについて解説したムービーが「Type Safari with James Victore」です。何の変哲もない街の看板から、いかにしてタイポグラフィやロゴデザインのインスピレーションを得るのか、デザイナーでなくても興味深い内容に仕上がっています。 Type Safari with James Victore - YouTube こちらがジェームズ・ビクトル氏。 ビクトル氏の目に留まったのが、メニューを全て窓に書いているお店です。タイポグラフィに大きく関係するのもではないものの、いいアイデアだとのこと。 鳥よけの針を設置している靴屋の看板。 「鳥よけの針が加わることによって、シュルレアリスム感が溢れ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
https://creative-tweet.net/blog/2017/01/switch-text-spacing-plugin.html
日本語フリーフォントの作者様に感謝！最近リリースされた日本語の無料フォントのまとめ
デザイナーが愛用したい、フリーフォント素材45個まとめ 2016年3月度 - PhotoshopVIP
ウェブ初心者も安心して作成できる、無料HTMLテンプレート素材24個まとめ - PhotoshopVIP
シンプルな美しいフォントからコーディング用・ラーメンまで、フォント選びに迷った時にチェックしたい新作フリーフォント -2015年5月 | コリス
Google Noto Fonts_Noto Sans CJK JP（Googleの日本語フォント）
フォントの選び方の参考になる！世界で活躍している有名デザイナーたちが選んだフォントのランキング -Typographer’s Typefaces | コリス
創英角ポップ体は2014年もアツかった | 教育番組
