Adobe ได้บริจาคโค้ด rasterizer ที่ใช้กับฟอนต์แก่โครงการ FreeType โดยการบริจาคครั้งนี้ได้รับการสนับสนุนโดย Google เจ้า rasterizer คือโปรแกรมที่เรนเดอร์ภาพตัวอักษร (glyph) จากรูปแบบเวคเตอร์ให้เป็นบิทแมพ (หรือราสเตอร์ (raster)) ก่อนที่จะถูกนำไปแสดงผลครับ
โค้ดที่ Adobe บริจาคมานั้นจะทำงานเฉพาะกับฟอนต์แบบ OpenType ที่ใช้ภาพตัวอักษร (glyph) แบบ Compact File Format หรือ CFF โดยเป็นการปรับปรุงการทำงานของตัว parser และโปรแกรม hinting ที่เป็นส่วนของการปรับปรุงการวาดภาพตัวอักษรให้ชัดเจนยิ่งขึ้น โดยจะเห็นผลได้ชัดเจนเมื่อตัวอักษรนั้นมีขนาดเล็กมาก ๆ
โปรแกรม rasterizer ตัวใหม่นี้เป็นส่วนหนึ่งของ FreeType เวอร์ชั่น 2.4.12 โดยยังมีสถานะเป็นเบต้าและยังไม่เปิดใช้โดยปริยาย โปรแกรมเมอร์ที่ต้องการจะใช้จะต้องเปิดการใช้งานฟีเจอร์นี้ด้วยตัวเอง
FreeType เป็น library ที่ใช้สำหรับการวาดตัวหนังสือบนหน้าจอที่ได้รับความนิยมอย่างกว้างขวาง โดยถูกใช้ในหลากหลายโปรเจคเช่น Desktop Environment บน Linux แทบทุกเจ้า, Android, iOS, และอื่น ๆ อีกมากมาย
ข้างล่างเป็นภาพเปรียบเทียบกันระหว่าง hinting เดิมของ FreeType และ rasterizer ตัวใหม่ที่บริจาคโดย Adobe ครับ
ตัวอย่างที่ใช้ rasterizer ของ FreeType อย่างเดียว
ตัวอย่างที่ใช้ rasterizer + hinting อัตโนมัติแบบ Light ของ FreeType
ตัวอย่างที่ใช้ rasterizer แบบใหม่ของ Adobe
ที่มา:
Get latest news from Blognone
Follow @twitterapi
Hiring! บริษัทที่น่าสนใจ
Blognone Jobs Premium
Cloudnone
- Kubernetes คืออะไร [Part 1] เกิดขึ้นมาอย่างไร? ทำไมต้องใช้มัน? | Cloudnone EP.14
- CI/CD ยังไงดี ตั้งเซิร์ฟเวอร์เอง vs เช่าคลาวด์ | Cloudnone EP.13
- รู้จักโน้ตบุ๊กบนคลาวด์ เช่าใช้งาน Jupyter Notebook ที่ไหนดี | Cloudnone Ep.12
- สรุปข่าวใหญ่ปี 23 และคาดการณ์เทรนด์ปี 24 ในวงการ Cloud | Cloudnone EP.11
- สรุปของใหม่และสาระสำคัญจาก AWS re:Invent 2023 | Cloudnone Special EP
Comments
เป็นข่าวที่ผมแสดงความเห็นไม่ถูกเลยคับ เพราะความรู้ไม่ถึง (- -")
ช่างไฟสมัครเล่น (- -")
เริ่มจาก สามอันข้างบน อันไหนสวยกว่า ก็ได้นะครับ
แก้ไขแล้วครับ ขอบคุณครับ ;-)
ยังมี "โค๊ด" เหลืออีกนะฮะ
ส่วนตัวผมชอบฟอนต์ตัวอย่างล่างสุด เพราะดูเส้นมันคมชัดดีคับ แต่ผมอ่านข่าวนี้แล้วงงๆ ถ้าเปิดอ่านข่าวนี้ในเครื่องอื่น? หรือในอุปกรณ์อื่นที่ไม่ใช่พีซี มันจะมองเห็นคุณภาพของฟอนต์แบบเดียวกันไหม? ตัวอย่างที่ 3 จะยังชัดที่สุดอยู่หรือเปล่า?
ช่างไฟสมัครเล่น (- -")
น่าจะหมดละครับ - -' แก่แล้วสายตาไม่ดีจริง ๆ 555
ถ้าอ่านข่าวในเครื่องอื่น รูปที่แปะมาอาจจะมีการสเกล (ย่อ-ขยาย) ทำให้เห็นคุณภาพแตกต่างกันออกไปครับ ถ้าจะวัดต้องดูที่ภาพขนาด 100%
อีกอย่างคือการทำ hinting จะเห็นผลความแตกต่างเมื่อใช้กับหน้าจอความหนาแน่นต่ำ ๆ และ/หรือตัวอักษรที่มีขนาดเล็กมาก ๆ ด้วยครับ ดังนั้นถ้าเอาใช้กับหน้าจอประเภท 300ppi+ นี่แทบจะไม่ได้แตกต่างกับการไม่ทำ hinting เลย (iOS ก็ไม่ได้ทำ hinting นะ เท่าที่ได้ยินมา)
แต่ปัจจุบันหน้าจอคอมเราก็ยังใช้ 74-96ppi กันอยู่ซะส่วนใหญ่ hinting ก็เลยยังจำเป็นครับ
ในประกาศของ Adobe จะมีตัวอย่างเปรียบเทียบกันในเรื่องการวาดตัวหนังสือขนาดจิ๋ว (<8pt) อยู่ ลองเข้าไปดูนะครับ
อันล่างสุดในภาพรวมชัดสุด แต่ถ้าซูมแล้ว อันแรกบรรทัดแรกในวงเล็บชัดมากกกกก
รู้จักแต่ TrueType เหอะๆ
ใช้คำว่าอะไรดีครับ หรือทับศัพท์ไปดีกว่า?
ใจจริงอยากเขียนรายละเอียดเยอะกว่านี้แต่กลัวว่าจะเป็นเรื่องทางเทคนิคลึกเกินไป (เกรงว่าจะมีคนธาตุไฟเข้าแทรกเสียก่อน) เรื่องรายละเอียดทางเทคนิคเลยขอพูดถึงในคอมเม้นท์นี้แล้วกัน (จะได้ไม่ถูกสเปล+แกรม่าเช็ค)
ฟอนต์แบบ OpenType เนี่ยเกิดจากการเอาเทคโนโลยี TrueType ของไมโครซอฟท์ (ที่ได้มาจากการเอาอะไรสักอย่างไปแลกกับแอปเปิ้ล... ที่จริงเป็นของแอปเปิ้ลนะ) กับ Type 2 ของ Adobe มารวมร่างกัน โดยตัวโครงสร้างแล้วจะเป็น TrueType แต่ฟีเจอร์ใหม่ ๆ จะมาจาก Type 2
ฟีเจอร์นึงที่ได้มาก็คือ CFF ซึ่งหลัก ๆ ก็คือว่า glyph จะวาดด้วยเส้นโค้งแบบ cubic bezier ซึ่งใช้จุดควบคุม 2 จุด+จุดปลาย 2 จุดต่อหนึ่งเส้นโค้ง ทำให้วาดเส้นโค้งได้อิสระมากกว่า และเมื่อกำหนด glyph ที่หน้าตาเหมือนกันกับ TrueType (ซึ่งใช้ quadratic bezier) แล้วจะใช้จำนวนเส้นโค้งน้อยกว่า ซึ่งมีผลทำให้ไฟล์นั้นเล็กกว่าด้วย (เป็นที่มาของคำว่า Compact)
ปัญหาคือฟอนต์แบบ CFF จะระบุ hinting ลงไปในไฟล์ฟอนต์หยาบกว่า TrueType เดิม (ซึ่งแทบจะระบุเป็นรายจุดในแต่ละขนาด) ก็เลยตกเป็นภาระของ rasterizer ที่ต้องมานั่งคำนวนซับซ้อน ๆ เอาเองเพื่อที่จะทำให้ผลลัพท์มันออกมาสวยงาม
Google คงเซ็งกับคุณภาพของ output ที่ได้จาก FT2 เวลาที่วาดฟอนต์ CFF บน Chrome ก็เลยอยากจะปรับปรุง แต่ไอ้ครั้นจะทำเองก็ขี้เกียจ นึก ๆ ขึ้นได้ว่า Adobe เองคงมีของดีอยู่กับตัวอยู่แล้ว (CFF เองก็เป็นผลงานของ Adobe) ก็เลยไปติดต่อคุยกันขอทีมงานมาทำให้ แล้วก็ได้ตา Dave Arnolds จาก Adobe มาช่วยเขียนโค๊ดส่วนนี้ให้ ตอนนี้อยู่ในสถานะเบต้าก็จริง แต่ว่าจะถูกเปิดเป็น default ในเวอร์ชั่น 2.5 (ยังไม่มีประกาศออกมา แต่ว่ามีอยู่ใน git repository แล้ว)
ตอนนี้ Google เอง ก็ส่ง Behdad Esfahbod (ซึ่งตานี่ดังในฐานะผู้สร้าง harfbuzz) มาช่วยอีกแรง โดยเพิ่มโค๊ดการรองรับ glyph บิทแมพแบบสีลงไปใน OpenType font ด้วย (เอามาแสดงอีโมจิ) ฟังก์ชั่นนี้มาในเวอร์ชั่น 2.5 เหมือนกัน
ปล. เท่าที่รู้ ของ OS ของ Apple จะปิดการทำ Hinting ทั้งหมด เพราะว่าตัวอักษรนั้นถูกวาดบนหน้าจอความหนาแน่นสูงมากอยู่แล้ว ดังนั้นผลของการ hinting ก็เห็นไม่ชัดเจนสักเท่าไหร่
ปลล. เรื่องนึงที่ผมเซ็งมากกับ TrueType/OpenType ก็คือ ... มันเป็นไฟล์แบบ Big-Endian เพราะถูกสร้างโดย Apple ในสมัยที่มันยังใช้ชิพโมโตโรล่า (หรือว่า IBM ?) อยู่ ถ้าจะเขียน parser เองต้องมานั่งกลับ Byte-Order เองอีก เสียเวลาชะมัด (ผมเคยเขียนตัว renderer เองน่ะ)
ขอบคุณสำหรับความรู้ใหม่ครับ
May the Force Close be with you. || @nuttyi
อ่านเสร็จ ธาตุไฟเกือบเข้าแทรก
แกรม่าเช็ค -> แกรมมาร์เช็ค ครับ
ล้อเล่นนะครับ ^_____^
ขอบคุณมากครับ ชอบรายละเอียดเชิงลึก!
ขอบคุณครับ ผมเลยได้เรียนรู้ไปด้วย ^^
เยี่ยม ขอบคุณครับ
Blognone ต้องแบบนี้แหละ
ขอบคุณครับ อ่านแล้วอิ่มเอิบความรู้ใหม่
ขอบคุณสำหรับความรู้ครับ แต่อ่านแล้วก็ยังมึนๆ 55 เรื่องฟ้อนต์นี่เป็นหนึ่งในปัญหาหลักๆ เลยสำหรับคนที่ออกแบบเว็บ
ปลล. นี่ย่อมาจากอะไรครับ
ปัจฉิมลิขิตลิขิต (มั้ง) ฮ่าๆๆ (มีด้วย?)
ของ Adobe คมชัดกว่าเยอะ แต่ FreeType สบายตากว่า
เกี่ยวกับฟอนต์มีข้อสงสัย ฟอนต์ TH Sarabun ที่จะใช้เป็นมาตรฐานไทย ทำไมมันบางเบา และเวลาใช้งานไปถ้าหน้าจอมันมีการเปลี่ยนแปลงแล้วมันเพี้ยนเป็นรอยหยักๆ และหนาขึ้น แต่เวลาพิมพ์ไม่เป็น
อาจจะเป็นที่ตัว hinting ในไฟล์ล่ะมั้ง ? (ต้องถามคนออกแบบฟอนต์)
ที่เวลาพิมพ์ไม่เป็นเพราะว่าเครื่องพิมพ์พิมพ์ออกมาด้วยความหนาแน่นสูงมาก (300dpi) ครับ ดังนั้นมันก็เลยไม่เห็นน่ะ
ผมว่าอีกหน่อย adobe กับ google จะต้องเป็นพี่น้องร่วมธุรกิจกันแน่ๆ ไม่รู้ดิ รู้สึกอย่างงั้น อย่างน้อยก็เพราะ android ที่ยังใช้ flash player ได้ = =!
แต่ chrome บน android รัน flash ไม่ได้นะ
อคติทำให้คนรับเหตุผลด้านเดียว
แต่จริง ๆ ก่อนหน้านี้ Adobe ทำตัว rasterizer ของ CFF ให้ Silverlight มาก่อนนะ :)
ในวงการธุรกิจคงไม่มีมิตรแท้หรือศัตรูถาวรหรอกมั้งครับ
ไม่รู้เรื่องอย่างแรง 555
..: เรื่อยไป
มันเบลอหมดทุกอันเลยครับ อยากได้แบบคมๆ
ในคอมนี่ ผม turn off clear type หมดเลย มันเบลอ -"-
^
^
that's just my two cents.
ปิด antialiasing ให้หมดเลยครับ รับรองคม
แต่ถ้าตัวอักษรเล็กมากจะอ่านไม่รู้เรื่องแทน :-)
บทความสนุกดีครับ (ข่าว+คอมเม้นท์=บทความ) ผมเคยทำฟอนต์เดียวผ่าน Font Lab Studio บอกตรงๆ ไม่รู้เรื่องนี้เลย จำได้แค่ว่า พาร์ทของฟอต์แล็บใช้วาดไม่ถนัดเลย เลยไปลักไก่วาดในอินลัสแล้วก้อบปี้ มาเพลส -..- ใช้แพทเทรินของคุณนายพล สรุปทำออกมาฟอนต์เดียวสำหรับใช้กับหนังสือของตัวเอง มันเหนื่อยมากโดยเฉพาะการทำสระภาษาไทย 55
my blog
ขอย้อนมาหน่อยครับ
ถ้าผมจะเอา library ตัวนี้มาใช้กับแอพฯ ในแอนดรอยด์ได้เลยรึเปล่าครับ?