รายงาน

การออ

กแบบ F

ont

ด้วยโปร

แกรม F

ont C

reater

V.5.6

นาย วิศ

รุต เย็น

เจริญ รห

ัสนักศึกษ

า

521131

0890 A

RTD230

4

ออกแบบ

ตัวอักษร

เพื่อการ

พิมพ์

มหาวิทย

าลัยราชภ

ัฎจันทรเ

กษม ปีก

ารศึกษา

25555

จัดทำาโดย

คำานำารายงานเล่นนี้ จัดทำาขึ้นเพื่อ สรุปผลงานและ

การเรียนรู้จากวิชา ARTD2304 ที่เป็นการ

สร้าง Font ของเราขึ้นมาเองเพื่อใช้ในการ

ออกแบบงานและสร้างสรรค์งานออกแบบนาย วิศรุต เย็นเจริญ

ผู้จัดทำา

สารบัญหน้า

สารบัญเรื่อง

หน้า

หน้าปก ก

คำานำา ข

สารบัญหน้า ค

สารบัญเรื่อง ค

สารบัญภาพ ง

บรรณานุกรม จ

ผู้จัดทำา ฉ

ปกหลัง ช

หน้า

ขั้นคอนการออกแบบ Font 5

ขั้นตอนการเปลี่ยนเส้น Font 6

ขั้นตอนการสร้าง Font 8

การติดตั้ง Font 12

การใช้งาน Font 13

Font information 15-17

สารบัญภาพภาพที่ หน้า

ภาพที่1 ดราฟ Font 5

ภาพที่2 เปลี่ยนเส้น Font 6

ภาพที่3 แสดงผลการเปลี่ยนเส้น ภาพที่ 4 Save ภาพเป็น Jpg 7

ภาพที่ 5 สร้าง Font .ใหม 8

ภาพที่ 6 ขั้นตอนสร้าง Font ภาพที่ 7 ขั้นตอนการสร้างใหม่ 2 9

ภาพที่ 8 ทดสอบFont ภาพที่ 9 แก้ไข nameming 10

ภาพที่ 10 การ save font 11ภาพที่ 11 save font ภาพที่ 12 ติดตั้ง font 12

ภาพที่ 13 Font show 13

ขั้นตอนที่ 1 การออกแบบ Fontในขั้นตอนนี้คือ เราจะเริ่มจากกรสร้าง Font สำาหรับสินค้า

ของเราก่อนโดยใช้ โปรแกรม Font creater เป็นตัวสร้าง

ขึ้นมา โดยเริ่มจากการดราฟ เส้นแกนของFont ขึ้นมาโดย

ใช้โปรแกรม Illustrator

ภาพที่1 ดราฟ Font

เมื่อเรา ได้เส้นแกนของ Font แล้ว แยกออกมาแล้วเตรียม

ในขั้นต่อไป

หน้า 5

หน้า 6

ขั้นตอนที่ 2 การเปลี่ยนเส้น Font

ในขั้นตอนนี้เมื่อเราได้ ได้ Font มาให้แยกออกมาอีกหน้า

นึงแล้ว ใช้คำาสั่ง Artistic > Artistic_Paintbrush >

Brush1 แล้วเส้นจะทำาการเปลี่ยนทันที

]ภาพที่ 2 เปลี่ยนเส้น Font

เมื่อเปลี่ยนเส้น Font หมดแล้ว จะได้ภาพตามนี้

หน้า 7

ภาพที่ 3 แสดงผลการเปลี่ยนเส้น

เมื่อเปลี่ยนเส้นแล้วให้ทำาการ Export ภาพเป็น Jpg เพื่อ

เตรียม นำาเข้าสู่ขั้นตอนการจัด ช่องไฟใน Font Creater

ต่อไป

ภาพที่ 4 Save ภาพเป็น Jpg

หน้า 8

ขั้นตอนที่ 3 การสร้าง Fontในขั้นตอนนี้ สำาหรับคนที่เคยใช้ โปรแกรม Font Creater

มาบ้างแล้วไม่น่ามีปัญหาเพราะทำาได้โดยไม่ยากนัก แต่สำาหรับ

มือใหม่นั้นอาจจะงงนิดหน่อยก็ลองดูภาพตามกัน ขั้นตอน

ที่1 เปิดโปรแกรมแล้วไปที่ File > Open > Fontfile > เปิด

เทมเพลตตัวอย่าง Font AAA-watin new ของอาจารย์

ประชิด ทิณบุตร เจ้าของ Font AAA-watin new

ภาพที่ 5 สร้าง Font .ใหม่

นำาภาพ Jpg ไปเปิดในโปรแกรม photoshop แล้วใช้

เครื่องมือ Marquee ครอบแล้ว Copy(Crt+C) และให้

เปิดสลับไปที่โปรแกรม Font Creater

หน้า 9

ภาพที่ 6 ขั้นตอนสร้าง Font

เมื่อเปิดมาที่ Font Creater แล้วให้กดเลือกมาที่ช่องที่เรา

ใช้เครื่องมือครอบ Font .เลือกตัวให้ตรงช่องแล้ว กด Past

(Ctr+V) ลงไปแล้วจัดขนาดตัวอักษร ช่องไฟ กันหน้ากันหลัง

ต่างๆให้เหมาะ สมแล้วกด F5 Testfont ดู

ภาพที่ 7 ขั้นตอนการสร้าง Font 2

หน้า 10

เมื่อจัด ช่องไฟเสร็จแล้วให้เรากด ปุ่มF5 เพื่อทดสอบดูหากยัง

ไม่พอใจหรือระยะห่างยังไม่ดี ให้กลับไปแก้ไขได้ ตามสบาย เมื่อ

เสร็จแล้วก็ทำาการ แก้ไขชื่อเดิมของ font โดยเข้าไปที่ For-

mat - Nameming

ภาพที่ 8 ทดสอบFont

ภาพที่ 9 แก้ไข nameming

หน้า 11

ให้ทำาการแก้ไขในส่วนต่างๆที่ทำาเครื่องหมายไว้ตามภาพ

ประกอบ เว้นช่องสุดท้ายที่ทำาเครื่อหมายลูกศรไว้ เพื่อเป็นการ

ให้ เครดิต แก่เจ้าของเทมเพลตตารางเดิม เพราะเป็นลิขสิทธ์

เดิมของเจ้าของ

การ save font สามารถทำาได้โดยเข้าไปที่ File>Save as

และทำาการตั้งชื่อ File font ของเราโดยตั้งชื่อให้ตรงกับ File

ที่เราตั้งชื่อไว้ใน Nameming เพื่อให้ชื่อ Font ตรงกัน

ภาพที่ 10 การ save font

หน้า 12

ภาพที่ 11 save font

ภาพที่ 12 ติดตั้ง font

ขั้นตอนที่ 3 การติดตั้ง Fontการติดตั้ง Font สำาหรับการใช้งานนั้นคือ เปิดไปที่ Start >

Control Panel > Font แล้วทำาการลากไฟล์ Font ของเรา

ไปใส่ เพื่อติดตั้ง เท่านี้เอง

หน้า 13

ภาพที่ 13 Font show

ขั้นตอนที่ 4 การใช้งาน Font

ภาพนี้เป็นการสร้าง งานกราฟฟิค โดยใช้ต้นแบบของ

ผศ.ประชิด ทิณบุตร เพื่อแสดงถึงรูปแบบของการนำา Font ไป

ประยุกต์ใช้ต่างๆ

หน้า 14

หน้า 15

บรรณานุกรม ผศ. ประชิด ทิณบุตร ที่มาของ ตาราง

เทมเพลต ที่ใช้สำาหรับสร้าง Font Cru-visa-

rut new.ttf

ผู้จัดทำานาย วิศรุต เย็นเจริญ

วิชา ARTD2304

ออกแบบตัวอักษรเพื่อการพิมพ์

มหาวิทยาลัยราชภัฎจันทรเกษม

ปีการศึกษา 2555

รายงานเล่มนี้ สร้างขึ้นเพื่อสรุปผลการเรียนรู้จาก วิชา ARTD2304

ในงานสร้าง Font เป็นงานส่วนหนึ่งของวิชา ออกแบบตัวอักษรเพื่อการพิมพ์