สมมติว่าฟอนต์ไทยแปลงร่างได้

Fig. 1: Weight Axis (คลิกที่ภาพเพื่อดาวน์โหลดไฟล์ SVG)

เห็นนักออกแบบฟอนต์หลายสำนักกำลังเห่อความสามารถใหม่ใน OpenType v1.8 คือ Variable Fonts หรือ ฟอนต์แปลงร่างได้ เลยอยากทดลองกับตัวอักษรไทยบ้าง แต่ปัจจุบันยังไม่มีเครื่องมือที่จะทำหรือใช้ความสามารถของฟอนต์แบบนั้นได้อย่างสมบูรณ์ เลยลองใช้ SVG-SMIL มาเขียนโค้ดสำหรับทดลองความเป็นไปได้ในเว็บบราวเซอร์ดูก่อน (เห็น Glyphs 2.4 โฆษณาว่าเริ่มรองรับแล้ว และ FontLab VI ก็วางแผนจะรองรับเหมือนกัน แต่ผมไม่ได้ใช้ทั้งสองโปรแกรม)

อธิบายแบบสั้นๆ ได้ว่า Variable Font คือ ฟอนต์ไฟล์เดียวที่สามารถแสดงผลได้หลากหลายรูปแบบ แล้วแต่ว่า “เราจะปรับค่า” ให้มันแสดงผลแบบไหน ส่วนคำอธิบายอื่นๆ ลองหาอ่านเพิ่มเติมเอาเองในอินเตอร์เน็ต ถ้าต้องการรู้เชิงลึกก็อ่านใน OpenType Specification ไปเลยครับ

ผมอ่านบทความใน TypeNetwork เห็นเขาใช้ไฟล์ SVG แสดงตัวอย่าง เลยนึกขึ้นได้ว่าปกติผมก็วาดตัวอักษรเป็นไฟล์ SVG ก่อนทำเป็นฟอนต์อยู่แล้ว และ SVG-SMIL ก็แสดงภาพแอนิเมชั่นแบบง่ายๆ ได้ดีด้วย เลยลองเอามาแสดงตัวอย่างให้พอนึกภาพออก (แต่ IE/EDGE แสดงผลไม่ได้นะฮะ)

ภาพ SVG ด้านบนคือ การ Interpolate ฟอนต์ F0nt จากน้ำหนักบางสุดไปถึงหนาสุด ในภาษาของ Variable Fonts คือ weight axis แปลว่า ผมวาดตัวอักษรแค่ 2 น้ำหนัก ส่วนน้ำหนักที่อยู่ระหว่างบางสุดกับหนาสุดให้ซอฟต์แวร์ที่มีความสามารถคำนวณจากค่าตัวแปร แต่ Variable Fonts ยืดหยุ่นกว่านั้นมาก ไม่ได้จำกัดแค่ แกนน้ำหนัก อย่างเดียว ลองดูในบทความของ TypeNetwork ก็ได้ครับว่ามีแกนอะไรที่เป็นไปได้อีกบ้าง เช่น width axis, contrast axis, xHeight axis หรือแม้แต่ serif axis

เอาไว้เครื่องมือพร้อมกว่านี้คงได้เอาจริงเอาจังกับ Variable Fonts ในอนาคต

เพิ่มเติม (Dec 20 2016)

หลังจากทำแค่แกนน้ำหนักอย่างเดียวแล้วมันไม่สะใจ เพื่อให้เห็นภาพว่าแกนอื่นๆ ก็ interpolate ได้ เลยลองเพิ่ม แกนความกว้าง (width axis) สำหรับทำฟอนต์แบบ condensed และ แกนความต่าง (contrast axis) สำหรับสร้างความรู้สึกโปร่งทึบหรือสะโอดสะองไม่เหมือนกัน ตามภาพ Fig. 2 & 3 เลย

Fig. 2: Width Axis (คลิกที่ภาพเพื่อดาวน์โหลดไฟล์ SVG)

Fig. 3: Contrast Axis (คลิกที่ภาพเพื่อดาวน์โหลดไฟล์ SVG)

และเมื่อรวมทั้ง 3 แกนเข้าด้วยกัน ก็ได้แบบภาพ Fig. 4 ด้านล่างนี้

Fig. 4: Multiple Axes (คลิกที่ภาพเพื่อดาวน์โหลดไฟล์ SVG)

ส่วน Fig. 5 คือ การระเบิดความเป็นไปได้ออกมาดูทีละตัวเลย โดยมีน้ำหนัก 10 ระดับ มีคอนทราสต์ 5 ระดับ และมีความกว้าง 5 ระดับ รวมเป็น 10 x 5 x 5 = 250!

Fig. 5: Multiple Axes Explosion (คลิกที่ภาพเพื่อดาวน์โหลดไฟล์ SVG)

คงไม่มีใครบ้าทำฟอนต์ 250 ตัวสำหรับตระกูลเดียว แต่สำหรับ Variable Fonts มันไม่ได้จำกัดแค่ 250 ตัว! เพราะมีความเป็นไปได้ไม่รู้จบ โดยวาดมาสเตอร์ไม่กี่แบบ นั่นคือเหตุผลที่คนทำฟอนต์เขาตื่นเต้นกันครับ!