หน้า: [1]
 
ผู้เขียน หัวข้อ: ฟอนต์ KIDS VF  (อ่าน 5273 ครั้ง)
0 สมาชิก และ 1 ขาจร กำลังดูหัวข้อนี้
เห่อของใหม่จ้า  variable font ตัวแรกของผม  กร๊าก  หลังจากที่อยากจะทำเมื่อ 3 ปีที่แล้ว แต่ไม่สามารถ จนได้รับคำแนะนำจาก Jipatype เทพฟอนต์ สาย opensource ขอขอบคุณมา ณ ที่นี้ด้วย  ไหว้





ฟอนต์ Kids VF เป็นฟอนต์แปลงร่างจากตัวอักษรไปเป็นรูปร่างต่างๆ ที่เราเคยหัดอ่านอักษรสมัยเด็กๆ   (อิอิ)



อีกคนที่ต้องขอบคุณคือ web https://www.axis-praxis.org/specimens/__DEFAULT__  เป็นแหล่งที่ผมใช้ศึกษา variable font และยังเอามาใช้ในการนำเสนอ ฟอนต์ตัวนี้ด้วย  (แจ๋ว แจ๋ว) (แจ๋ว แจ๋ว) (แจ๋ว แจ๋ว)


download ได้ที่ https://mega.nz/#!GIBlHQqb!jQlzPt0axfY5G5xxlky3SUc-5uAAK7jCQxuOInDOLlM
uvSOV
« แก้ไขครั้งสุดท้าย: 01 ก.พ. 2020, 18:56 น. โดย uvSOV » บันทึกการเข้า
ปรกติวิธีการใช้ คือการเขียน web แล้วกำหนดค่า parameter ที่ฟอนต์กำหนดไว้ ก็จะได้รูปร่าง ตามที่เราออกแบบไว้ (แนะนำให้ดูงานของ Jipatype ครับ)





ในรูปตัวอย่าง การเลื่อน bar คือการเปลี่ยนค่า width ของฟอนต์  หมายถึงการเปลี่ยนน้ำหนักของฟอนต์ นั้นเอง
ซึ่งผมทำไว้ในตัวพิมพ์เล็ก และอักษรที่เหลือ
บันทึกการเข้า
 โห กรี๊ดดดดด กึ๋ยๆ
ตัองขอความรู้บ้างเลยครับ  ไหว้ ไหว้ ไหว้
บันทึกการเข้า
โคตรโหดเลยครับบบ อ๊าก ฮือๆ
บันทึกการเข้า

ทำมาหากินด้วยการเปิดร้านสกรีนเสื้อยืด จ้ะ
ed_crub  ได้เลยครับ
--------------------------
เล่าเรื่องเบื้องหลังนิดหน่อยนะครับ

ด้าน technic น้อง Jipatype ได้บอกไว้หมดแล้ว https://www.f0nt.com/forum/index.php/topic,23985.0.html
ขอเล่าเรื่องการออกแบบละกันครับ

ตัวอย่าง การออกแบบอักษร สำหรับ ตัวปรกติ และตัวหนามาก แบบแยกชิ้น
จำนวนจุดต้องเท่ากัน จุดเริ่มต้นต้องกำหนดที่เดียวกัน เมื่อฟอนต์ขยายขนาดจากตัวปรกติไปตัวหนา
สัดส่วนจะยังคงได้เพราะไม่ได้กำหนดจุดตัด แต่กำหนดความหนา และแยกชิ้นจากกันเป็น 2 ส่วน


ตัวอย่าง การออกแบบอักษร สำหรับ ตัวปรกติ และตัวหนามาก แบบชิ้นเดียว
จุดที่มีการหักมุม เพื่อให้คงรูปอาจใช้วิธีนี้ คือกำหนดจุดลึกลงไปในเส้นอักษร เพื่อคงความหนาให้สม่ำเสมอ ปล่อยจุดตัดอิสระ  
และมั่นใจว่าจะไม่ล้น เหมือนแบบแรก


ตัวอย่าง การออกแบบอักษร สำหรับ ตัวปรกติ และรูปภาพ
จำนวนจุดต้องเท่ากัน จุดเริ่มต้นต้องกำหนดที่เดียวกัน  ซ่อนองค์ประกอบอื่นๆไว้ในเส้นของตัวอักษร
อาจจะจับยืด เปลี่ยนความโค้ง หรือกลับ direction เช่นส่วนลูกตาไก่


ตัวอย่าง การออกแบบอักษร สำหรับ ตัวปรกติ และรูปภาพ
แบบที่มีการซ่อนจำนวนจุดไว้ เพื่อปรับรูปได้หลากหลายขึ้น เช่นลำตัวช้างที่กลายร่างมาจากเส้นขีดเดียว กลายเป็นตัว และขา


บันทึกการเข้า
 ไหว้ ไหว้ ไหว้ กรี๊ดดดดด กรี๊ดดดดด กรี๊ดดดดด
บันทึกการเข้า
ชื่อฟอนต์ : SOV_Kids_VF

ลิงก์ : https://www.f0nt.com/forum/index.php/topic,24029.0.html

ข้อมูลการติดต่อ : https://www.facebook.com/worawut.thanawatanawanich

ภาพตัวอย่าง :



ภาพไอคอน :


ภาพโปสเตอร์ :


รายละเอียด :
Variable Font ที่ทำเป็นฟอนต์แปลงร่างจากตัวอักษรไปเป็นรูปภาพ เหมือนสมัยหัดอ่าน ก.ไก่ ข.ไข่ A ant B bird
เหมาะสำหรับแสดงผลบน web เพราะมีการเปลี่ยนรูปร่างได้

download font : https://mega.nz/#!adhn3KpQ!_Mw3Fk_5t1QOETdms95UqxduqYioTmB3IOhlfYsm2h0
ขอบคุณครับ
uvSOV
« แก้ไขครั้งสุดท้าย: 25 เม.ย. 2020, 10:23 น. โดย uvSOV » บันทึกการเข้า
แบบนี้บางโปรแกรมที่ถ้าเจอเส้นเวกเตอร์ซ้อนกันแล้วมันจะกลับเป็น invert ไหมครับ
บันทึกการเข้า

ทำมาหากินด้วยการเปิดร้านสกรีนเสื้อยืด จ้ะ
แบบนี้บางโปรแกรมที่ถ้าเจอเส้นเวกเตอร์ซ้อนกันแล้วมันจะกลับเป็น invert ไหมครับ

เท่าที่เคยลอง ถ้า vector ทิศทางเดียวกัน ซ้อนได้..เนียนๆไป ถ้า ทิศทางกลับกัน ซ้อนกันเมื่อไรก็จะ invert ครับ  ลันล้า
ฟอนต์ที่เคยทำไป ถ้าลืมตรวจสอบ direction ก็จะเห็นผลงานแบบ invert เสมอๆครับ  อี๋~
บันทึกการเข้า
ขอบคุณครับ
บันทึกการเข้า

ทำมาหากินด้วยการเปิดร้านสกรีนเสื้อยืด จ้ะ
หน้า: [1]
 
 
Powered by MySQL Powered by PHP Powered by SMF 1.1.21 | SMF © 2006-2007, Simple Machines | Thai language by ThaiSMF Valid XHTML 1.0! Valid CSS!