フォント勉強会 in クリエイティブハント山口2018


フォントを学んでクリエイティブ力を高める(PDF/175頁/約13MB)

▼ ダウンロード ▼

FONTPLUSためし書き遊び方(PDF/2頁/約8MB)

▼ ダウンロード ▼

FONTPLUS導入ガイド(PDF/17頁/約3MB)

▼ ダウンロード ▼

FONTPLUSカタログ(PDF/2頁/約2MB)

▼ ダウンロード ▼


フォントおじさんこと、ソフトバンク・テクノロジーの関口浩之です。ご参加いただき、ありがとうございました。当日のセミナーで使用したスライドに約100ページを追加した「増強版フォントを学ぼう」ってノリの全180ページの資料を公開します。ご一読ください。
導入ガイドやFONTPLUSためし書きの遊び方、FONTPLUSのカタログもダウンロードできます。あわせてご活用ください。各資料の画面キャプチャにはハイパーリンクを設定してますので、クリックするとサイトへリンクします。Webフォントに関する質問などございまいましたら、関口浩之までご気軽にご連絡ください。
hsekiguc@tech.softbank.co.jp

■キルラジェネレータとモーションタイポグラフィ
楽しいWebフォント作品を二つ、共有します。
キルラジェネレータ … フォームに適当なテキスト(最大10文字×4行くらいまでが適当)入れて[送信]ボタンを押してください。FONTPLUSから瞬時にキルラキルで有名な「ラグランパンチ」という書体をWebフォント配信します。
Motion Typography … Twitterのタイムラインを形態素分析して、ランダムでfont-familyを適用して、トランスフォームなどを活用して楽しく閲覧できます。自分のTwitter IDでお楽しみください。他人のTwitter IDでも楽しめます。リクエストが集中すると、Twitter APIが反応しないときがあるので、そのときは暫くしてから試してください。

■FONTPLUSの文字詰め機能
FONTPLUSでは、特定の要素だけピンポイントで文字詰め配信する機能を2015年10月にリリースしました。下記3パターンのサンプルを見比べてください。
見出しも本文もベタ組み … 括弧や中黒などの約物がパラパラしてて読みづらい
見出しも本文も文字詰め配信 … 見出しは読みやすくなったけど、本文も詰めるとビジー感がでて読みづらい
見出しのみ文字詰め配信 … 見出しのみ文字詰めするのがバランスが良い

■Webフォントの表示速度比較動画
次に日本語Webフォントの表示速度のお話です。「日本語Webフォントって遅いし重いよね」と思っている方、まだ多いのではないでしょうか? たしかに4年前までは表示がとても遅かったです。現在のFONTPLUSは非常に高速です。新旧比較動画で実際の速度をお確かめください。左側iPadがサービス開始当初のFONTPLUS、右側iPadが現在のFONTPLUSの表示速度です。同一HTMLページで新旧速度を比較しています。右側(現行のFONTPLUS)の表示では、Webフォントを導入している感じがしないぐらいの表示速度になっています。
FONTPLUS新旧速度比較

■Webフォント表示テストツール
表示テストツール(1~50ピクセル一括表示)
表示したい文字列を入力します。そしてfont-familyを入力し[更新]ボタンを押してください。font-family名は、FONTPLUSで使える886書体リスト(xls形式)をご用意しましたのでご活用ください。ピンポイント文字詰め機能が使える書体はH列に○が付いた書体です。また○が付いた書体はWindows環境でもフォントがスムーズに表示されるよう配信しています。font-familyの後ろに{pm}セレクター付けると文字詰めして表示されます。

■FONTPLUS JavaScriptのオプションパラメータ一覧
表示スタイル:(システムフォントのチラツキが気になる際はお試しください)
 delay=1
 (1 or 2)
 1: Webフォント適用個所のみ非表示にする
 2: Webサイト全体を非表示
文字間の余白削除:(IE8~IE6でも文字詰めしたい場合にご活用ください)
 t=0
 (0のみを利用 pm=1と一緒に利用できません)
プロポーショナルメトリクス:(ページすべてのWebフォント要素を一括指定)
 pm=1
 (1以外の場合はパラメータなしと同じ t=0と一緒に利用できません)
Webフォント適用のタイムアウト時間:
 timeout=1
 (正の整数値 単位:秒)
表示位置ズレの自動調整:
 aa=1
 (1以外の場合はパラメータなしと同じ)
行サイズ切替機能:
 ab=2 Windows仕様に合わせる
 ab=1 Max OS X仕様に合わせる

■FONTPLUS無償API(スマートライセンス用)
非同期コンテンツなどに対応するために、FONTPLUSでは無償で各種APIを公開しています。コンテンツの用途にあわせて、こちらもご利用ください。
FONTPLUS無償API


セミナーフォローアップ情報です。