variable font

สนุกล่ะทีนี้ feature ใหม่ ของ Open Type Font ครับ (version 1.8)  เพิ่งอ่านเจอเมื่อวันก่อน

สามารถกำหนดความกว้าง และน้ำหนักได้


แล้วยังสามารถปรับเปลี่ยนรูปร่างได้อีกด้วย


วันนี้หา web site ที่ show ความสามารถของ variable font เจอแล้ว สนุกมาก

เพื่อนๆลองไปเล่นดูครับ  งานเข้าคนออกแบบฟอนต์ ล่ะทีนี้  

http://www.axis-praxis.org/

ตัวอย่างใน youtube

คุณพระช่วย

เพิ่มตัวอย่าง การออกแบบ variable font ใน font file เดียว

1. ปรับตัวหนาบาง ความสูงเดียว


2. ปรับตัวหน้าบาง และขนาดความสูงของอักษรตัวพิมพ์เล็ก ในแต่ละระดับ


3. ปรับความหนาบาง และความสูงแบบไปพร้อมกัน


4. ปรับตัวหนาบาง ความกว้าง และความเอียง


5. แปลงร่าง


6. ลองเอา ฟอนต์แปลงร่าง มาขยับไม่พร้อมกัน

ศึกษาเพิ่มจากตัวอย่างใน github

https://github.com/adobe-fonts/adobe-variable-font-prototype
https://github.com/TrueTyper/BuffaloGals
https://github.com/TypeNetwork/fb-Amstelvar
https://github.com/twardoch/varfonts-ofl/tree/master/VotoSerifGX-OFL

แค่นึกว่าทั้งหมดนี่ทำจากฟอนต์เพียวๆ ก็หนาวดึ๋งแล้วครับ

[FontUni]

เพิ่มเติม เผื่อมีคนสนใจว่า Variable Font แบบไทยๆ นะครับ ผมเขียนไว้เมื่อปลายปีที่แล้ว

- https://fontuni.com/articles/2016-12-19-thai-variable-fonts-idea.html
- https://www.facebook.com/FontUni/videos/vb.675293215917931/1167024560078125

เพิ่มเติม เผื่อมีคนสนใจว่า Variable Font แบบไทยๆ นะครับ ผมเขียนไว้เมื่อปลายปีที่แล้ว

- https://fontuni.com/articles/2016-12-19-thai-variable-fonts-idea.html
- https://www.facebook.com/FontUni/videos/vb.675293215917931/1167024560078125

ยอดเยี่ยม กระเทียมเจียวเลยครับ 

What do Variable Fonts mean for Web Developers? – prototypr
https://blog.prototypr.io/what-does-variable-fonts-mean-for-web-developers-2e2b96c66497



สำหรับนักพัฒนาเว็บครับ

ตอนนี้สามารถใช้กับโปรแกรมอะไรบ้างครับ

ที่ลองในเบราว์เซอร์มาตรฐานยังไม่ได้เลยครับ

ตอนนี้สามารถใช้กับโปรแกรมอะไรบ้างครับ

ลองไปที่นี่ครับ http://www.axis-praxis.org/

เขาจะแนะนำให้ว่า How to get variable fonts working in Safari, Chrome and Firefox

เครื่องผมเป็น windows7  ผมใช้ Chrome สีทองครับ  work และสนุกดี

ฟอนต์เกลียดเต้าหู้ออก Variable Font แล้ว แทบทุกภาษา

ของไทย NotoSansThai-VF.ttf, NotoSansThaiUI-VF.ttf, NotoSerifThai-VF.ttf

download ได้ที่ https://github.com/googlei18n/noto-fonts-alpha/tree/master/from-pipeline/unhinted/variable-ttf จ้า

สนุกสนานแค่ไหน ลองดูที่ fb คุณ Sungsit https://www.facebook.com/FontUni/videos/1408324225948156/

โอ๊ย สุดยอด

น่าสนใจมากครับ

อัปเดตล่าสุด Google Chrome 62 รองรับฟอนต์แบบนี้แล้วครับ
ใครอัปเดตโครมแล้วลองเข้าไปเล่นดู http://www.axis-praxis.org/