mojiru【もじをもじる】

「mojiru」はこのブログ名。「もじる」は著名な言い回しに似せて表現すること。ブログでは、本・映画・グルメなどのヒット商品や気になったトレンドを文字をもじったりもじらなかったしながら、フォントを使ったり使わなかったりしながら取り上げていく。更新頻度は1日1回が基本です。[もじる使用例]1.吾輩は下戸である。お酒は飲めない。2.太閤がまずしかったから。3.棋士の一二三に惨敗。

変幻自在な未来のフォント「バリアブルフォント」

【スポンサーリンク】

バリアブルフォント/Variable Font

f:id:mojiru:20190122165635p:plain

バリアブルフォント(Variable Font)とは、Adobe・Apple・Google・MicrosoftといったIT業界の巨人ともいえる会社が共同で開発したOpenTypeフォント。かいつまんでいえばフォントの太さや幅、高さ、コントラスト、角丸などを調整できるフォントのこと。

また、バリアブルフォントに関してAdobeタイプデザイナーであるジョン・ハドソン氏は「ひとつのフォントファイルでありながら複数のフォントのように利用できる」フォントと定義している。

通常のフォントはフォントのウェイト(太さ)を変更する場合はそれぞれのフォントファイルを読み込む必要があるが、「バリアブルフォント(Variable Font)」を使用すればアルゴリズムを使用して1つのフォントファイルから太さや高さを変更できるため、データ容量の縮小につながる。ウェイトバリエーションの少ないフォントに関しても、ウェイトのバリエーションを増やせるなどの利点もある。

話題の「バリアブルフォント」がIllustratorとPhotoshopで使えるようになった!

f:id:mojiru:20190122165251p:plain

Illustrator CC 2018とPhotoshop CC 2018にバリアブルフォントが搭載され、簡単にフォントの字幅や線幅、傾斜のデザインの変更が可能になったので実際にIllustratorで使用してみた。

Illustratorには、「Acumin Variable Concept」「Bahnschrift」など2019年1月現在、9書体が搭載されている。

f:id:mojiru:20190122165235p:plain

これらの「バリアブルフォント」は、コントロールパネルでボタンをクリックするとスライダーコントロールを使用して文字を調整できる。

f:id:mojiru:20190122165216p:plain

▼「バリアブルフォント(Variable Font)」線の太さを変えてみた。

f:id:mojiru:20190122164804p:plain

▼「バリアブルフォント(Variable Font)」幅を変えてみた。 

f:id:mojiru:20190122164742p:plain

▼「バリアブルフォント(Variable Font)」傾斜を付けてみた。  

f:id:mojiru:20190122164657p:plain

▼Photoshopでは文字パネルでバリアブルフォントを選択すると属性パネルで幅や傾斜を調整できるようになる。

f:id:mojiru:20190122170220p:plain

Windows 10プレビュー版にVariable Font(バリアブルフォント)「Bahnschrift」が実装

Variable Fontを使ったレスポンシブレンダリングの例

 

米Microsoft Corporationは2017年8月23日に「Windows 10 Insider Preview」Fastリングの参加ユーザーに対してビルド16273を公開した。

このBuildにて、Windowsで初めてVariable Font(バリアブルフォント)Bahnschrift」が実装された。

Variable Font(バリアブルフォント)「Bahnschrift」の特徴 

Variable Font(バリアブルフォント)「Bahnschrift」

従来のフォントは、標準とBOLD(太字)の2種類のウェイトしか使えず、それ以上に細いストロークもしくは太いストロークを使用したい場合は同じフォントファミリーの別フォントを用意する必要があったが、Microsoft、Google、Adobe、Appleらが共同で開発した新しい仕組みのフォント「Variable Font」は、1つのフォントファイルでありながらユーザーがウェイトを自由に変更できる。

Variable Fontを使ったレスポンシブレンダリングの例

Adobe Typekit Blogより引用

 

Variable Fontを使ったレスポンシブレンダリングの例

 

「Variable Font」の特徴として、ウェイトを変更しても文字幅が変わらないためレイアウトの変更が不要になるというメリットやウェイトを変えられるためファイルサイズも小さいといった利点がある。

将来的には静的フォントが「Variable Font」に置き換わることも期待されている。

 

▼外部リンク:バリアブルフォント(Variable Font)参照記事

hacks.mozilla.org

 

ブラウザ「Firefox 62」がVariable Font(バリアブルフォント)に対応

f:id:mojiru:20180928081932p:plain

Mozillaは2018年9月4日に「Variable Fonts Arrive in Firefox 62 - Mozilla Hacks|the Web developer blog」内で、Firefox 62にVariable Font(バリアブルフォント)のデフォルトサポートを追加した事を発表した。

FirefoxがVariable Fontに対応した事で、主要ブラウザのすべてがデフォルトでVariable Font(バリアブルフォント)をサポートしたことになる。

 

f:id:mojiru:20180928081957p:plain

 

 

モリサワ「タイプデザインコンペティション2019」の明石賞でVariable Font(バリアブルフォントを募集

モリサワによる世界中からオリジナルタイプフェイスを募集するモリサワ主催の書体デザインアワード「タイプデザインコンペティション 2019(Morisawa Type Design Competition 2019)」の開催が2018年7月3日に発表された。

その中の賞の1つである明石賞ではOpenTypeの規格で示された「バリアブルフォント(Variable Font)」がテーマに据えられた。入賞者には、表彰状とトロフィー、副賞として次のとおり賞金を授与される。

賞金は50万円で、最大3点まででとなってる。

「タイプデザインコンペティション2019」参照記事

www.mojiru.com

 

ai(人工知能)がフォントを作る時代

www.mojiru.com

 

Adobe製品情報 

▼Adobe Creative Cloud コンプリート 2017年版 | 12か月版 | オンラインコード版

Adobe Creative Cloud コンプリート 2017年版 | 12か月版 | オンラインコード版

Adobe Creative Cloud コンプリート 2017年版 | 12か月版 | オンラインコード版

 

PhotoshopやIllustratorを始めとするデスクトップアプリ。様々なモバイルアプリとクラウドならではのサービスを統合したトータル制作環境になっている。随時リリースされるアップデートを含め、これらすべてを追加料金なしの定額制で利用できる。

 

▼Adobe Creative Cloud コンプリート 2017年版|学生・教職員個人版|12か月版

Adobe Creative Cloud コンプリート 2017年版|学生・教職員個人版|12か月版|オンラインコード版

Adobe Creative Cloud コンプリート 2017年版|学生・教職員個人版|12か月版|オンラインコード版

 

Adobe Creative Cloudの学生・教職員個人版。アカデミック価格なので当然通常価格で購入するより安い。

 

▼Acrobat Standard 2017 アドビ ※パッケージ版【返品種別B】【送料無料】  

[商品価格に関しましては、リンクが作成された時点と現時点で情報が変更されている場合がございます。]

Acrobat Standard 2017 アドビ ※パッケージ版【返品種別B】【送料無料】
価格:42500円(税込、送料無料) (2017/12/3時点)


 

 

▼Acrobat Pro 2017 日本語 Mac 【学生・教職員版】 アドビ ※パッケージ版【返品種別B】【送料無料】  


 

©2017-2019 mojiru All Rights Reserved. | プライバシーポリシー