วันพฤหัสบดีที่ 2 กุมภาพันธ์ พ.ศ. 2555

เทคโนโลยี VIRTUALSTUDIO งาน BOI FAIR 2011


บทนำ

การแสดงนิทรรศการ“บีโอไอแฟร์2011”นั้นเป็นการแสดงเทคโนโลยีและนวัตกรรมของบริษัทชั้นนำที่ลงทุนในประเทศไทย ซึ่งสะท้อนให้เห็นถึงความเชื่อมั่นด้านการลงทุน ของนักลงทุนทั้งไทยและต่างประเทศ     นอกจากนี้ยังเป็นเวทีในการเผยแพร่การดำเนินงานเกี่ยวกับความรับผิดชอบต่อสังคมและการดูแลรักษาและฟื้นฟูสิ่งแวดล้อมของภาคอุตสาหกรรมรวมทั้งเป็นเวทีให้ผู้ประกอบการจากทั่วโลกได้มีโอกาสพบปะเจรจาธุรกิจและสร้างเครือข่ายซึ่งจะช่วยกระตุ้นเศรษฐกิจตลอดจนสร้างความเชื่อมั่นในเศรษฐกิจไทยและเสริมสร้างภาพลักษณ์ที่ดีต่อประเทศด้วย

แนวคิดในการจัดงาน
แนวคิดหลักของงาน “บีโอไอแฟร์ 2011” ภายใต้ รวมพลังน้ำใจ “โลกสดใส ไทยยั่งยืน” หรือ “Going Green fortheFuture”จะสอดคล้องกับทิศทางการพัฒนาของประเทศให้เจริญเติบโตทั้งทางด้านเศรษฐกิจสังคมและสิ่งแวดล้อมเพื่อให้สังคมไทยก้าวไปสู่สังคมที่มีความสุขและมีการพัฒนาอย่างยั่งยืนบนพื้นฐานหลักปรัชญาของเศรษฐกิจพอเพียงการออกแบบพื้นที่ของงานจะสะท้อนให้เห็นถึงความเหนื่อยยากของพระบาทสมเด็จพระเจ้าอยู่หัวที่ทรงปฏิบัติพระราชกรณียกิจมากมายเพื่อให้ประชาชนชาวไทยอยู่อย่างร่มเย็นเป็นสุขสถาปัตยกรรมจะจัดวางอยู่บนทะเลสาบจะเป็นสัญลักษณ์ที่สื่อถึงหยาดพระเสโทของพระองค์ขณะทรงปฏิบัติพระราชกรณียกิจทั่วทุกหนแห่งบนผืนแผ่นดินไทย

VIRTUAL STUDIO

รู้จักกับVIRTUALSTUDIOเป็นการสือสารผ่านหน้าจอโทรทัศน์วิดีโอซึ่งเป็นแนวทางใหม่ให้กับบริษัทหรือองค์กรในรูปแบบของที่ต้องการเผยนำเสนองานออกแบบวิดีโอและงานโทรทัศน์การทำงานของระบบนี้หากมองแต่ภายนอกนั้นจะเห็นแค่ฉากสีเขียวอย่างดียวเท่านั้นโดยตัวละครหรือตัวประกอบภายนอกจะใช้เทคนิดจากvirtualstudioเข้ามาใช้โดยสามารถนำเสนอผ่านทางฉากสีเขียวเพียงแค่นำตัวละครที่จะทำประประกอบเข้ากับฉากนั้นตัดต่อเข้าไปข้างในฉากสีเขียวนั้นและข้างในฉากสีเขียวนั้นเราสามารถสร้างสรรค์งานสามมิติได้เสมือนจริงสร้างงานกราฟฟิกได้อยากหลากหลายโดยในการทำงานเกี่ยวกับระบบนี้จะมีงานกราฟฟิกเข้าไปเกี่ยวข้องในการสร้างถาพสตูดิโอเพื่อใช้ประกอบฉากนั้นเอง
นอกจากนี้ยังสามรถเพิ่มโลโก้สัญลักษณ์ตัวการ์ตูนสภาพแวดล้อมแบบต่างๆได้ไม่ซ้ำแต่ที่สำคัญคือการที่ระบบนี้สามรถนำตัวคนจริงๆมาอยู่ในสภาพแวดล้อมที่เป็นสามมิติได้นั้นเองการถ่ายทำนั้นเป็นการถ่ายทำแบบเรียลไทม์คือการนำเสนอรายการสดตามเวลาจริงต้องมีผู้ควบคุมอยู่ตลอดขณะทำรายการเพื่อให้เป็นหลักในการแก้ไขเปลี่ยนฉากเป็นเทคโนโลยีที่มีคุณภาพสูงแต่ราคาต้นทุนต่ำเหมาะที่จะนำไปใช้กับทุกๆธุรกิจที่สามรถสร้างงานออกอากาศที่เป็นวิดิโอที่มีคุณภาพร่วมกับลูกค้า พนักงาน ผู้ถือห้น หรือผู้ชมผ่านหน้าจอดโทรทัศน์


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

ผลกระทบของเทคโนโลยี virtual studio ที่ผลต่ออาชีพนักออกแบบนิเทศศิลป์
ระบบ virtual studio เป็นระบบการนำเสนอแบบวิดิโอซึ่งฉากในการนำไปประกอบนั้นจะใช้การกราฟฟิกที่เป็นแบบสามมิติ ในการออกแบบ โดยการออกแบบฉากนั้นจะมีต้องมีความสำคัญอย่างมากในระบบ virtual studio หากแนวทางในการพัฒนาระบบนี้มีการนำมาใช้กันมากขึ้นในประเทศไทยภายในอนาคตแล้ว ย่อมส่งผลดีต่อนักออกแบบกราฟฟิกด้วย ปัจจุบันระบบนี้ได้มีการจักการเรียนการสอนที่มหาวิทยาลัยกรุงเทพแล้ว และมีการนำไปใช้ในงานโทรทัศน์ ที่รู้จักกันเช่น ช่อง7 ช่อง9 และช่อง5

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

การลดค่าใช้จ่ายที่คุ้มค่า
หากต้องถ่ายทำภาพยนต์ที่มีฉากเป็นรถบัสในกรุงลอนดอนถ้าต้องไปถึงสถานที่จริงนอกจากจะเสียเวลาในการขอใบอนุญาติ ต้องเจอกับสภาพอากาศฝนตก หมอกหนาบ้างทำให้เสียเวลารอไปอีกคนดูไม่ได้ต้องการไปถึงที่นั้นแต่เขาต้องการแค่ว่าคุณภาพงานดีขนาดไหนค่าใช้จ่ายคุ้มค่าแค่ไหน แต่ถ้าหากซื้อสต็อคภาพที่เป็นภาพรถบัสในกรุงลอนดอนราคาไม่เท่าไหร่แล้วนำมาเป็นฉากใน virtual studio จะลดต้นทุนได้อย่างมาก

ประหยัดเวลาการถ่ายทำ
โดยไม่ต้องกังวลที่จะกลัวแบตกล้องวิดีโอหมดหรือระวังสายไฟช๊อตสายไฟรั่ว ซึ่งหากเกิดเหตุการณ์ดังกล่าวจะส่งผลไปยังงานของคุณค่าใช้จ่ายและลูกค้า
เพิ่มงานที่สร้างสรรค์ได้มากขึ้น
โดยสามรถเปลี่ยนฉากและออกแบบฉากได้อย่างหลากหลายแต่บางทีภาพที่ถ่ายเก็บไว้ก็อาจไม่สำคัญเพราะสามรถนำภาพที่จินตนาการเหนือความจริงมาใช้ได้ด้วย ทำให้ได้ฉากที่มากมายยิ่งขึ้น
เพราะฉะนั้นการมีสต๊อคภาพไว้บางคนอาจคิดว่ามันเป็นภัยต่ออุตสาหกรรมการออกแบบนี้บอกเขาเหล่านนั้นว่าฉันเข้าใจคุณกำลังมีความสุขอยู่กับอุดมการณ์การบริโภคสื่อที่มีค่าใช้จ่ายในการผลิตที่มากเกินไป แต่เป็นคุณ คุณจะยอมนั่งรถเพื่อไปถ่ายแค่ถ่ายรูปกับฉากรถบัสในลอนดอนไหม

หน้าจอแสดงผลสามรภเปลี่ยนฉากได้ตามตามฉากที่นักออกแบบได้ออกแบบไว้รวมเข้าฉากจิริงที่มีอยู่ในสตูดิโอ



ภาพที่ 1 เครื่องในการควบคุมระบบ
ที่มา:ชานนท์ เกษมวรรณกร,2555

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

ภาพที่ 2 แสดงกล้องวิดีโอแต่ละตัวที่ใช้ในการถ่ายทำ
ที่มา:ชานนท์ เกษมวรรณกร,2555


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

ภาพที่ 3 แสดงหน้าตัวอย่างการถ่ายทำจริงและออนแอร์
ผ่านโทรทัศน์หรือเผยแพร่ออนไลน์ผ่านวิดีโอ
ที่มา:ชานนท์ เกษมวรรณกร,2555
ในสตูดิโอนั้นจะต้องมีการจัดไฟจัดเสียงให้ดูสมจริงและเข้ากันกับฉากกราฟฟิกสามมิติที่นำเป็นฉากนั้นด้วยจอ LCD ขนาดใหย่ด้านหน้านั้นเป็น จำนวนสามจอ จอกลางเป็นภาพที่กล้องถ่ายจากฉากในสตูจริงๆส่วนอีกสองข้างนั้นเป็นการแสดงผลแบบการนำภาพมาแทรกและการแสดงผลตัวอย่างเคลื่อนไหวที่มีคนมายื่นประกอบจริงรูปแบบการทำจริงในสตูดิโอแล้วเผยแพร่ถ่ายทอดสดออกทางโทรทัศน์หรือวิดีโอหนัง

ฟอนต์ที่เห็นในงาน จากpavilion ของ KOBUTA

สืบค้นหาฟอนต์ที่เป็นฟอนต์ต้นฉบับหรือมีลักษณะคล้ายฟอนต์ของคูโบต้า จาก http://www.fontspace.com/ โดยทดลองพิมพ์คำว่าKubotaลงไปเพื่อสะดวกต่อการหาฟอนต์ต้นต่อ

ฟอนต์ที่มีลักษณะใกล้เคียงกับฟอนต์ที่เป็นโลโก้ของ Kubota คือ  SF New Republic bold ซึ่งฟอนต์ที่เป็นฟอนต์ในตระกูล sans-serif basic แล้วนำการทำการดาวน์โหลดฟอนต์มาติดตั้งลงในเครื่องคอมพิวเตอร์แล้วทดลองทำการออกพิมพ์และออกแบบคล้ายฟอนต์ Kubota

ปรากฎว่าฟอนต์ SF New Republic bold  กับฟอนต์ที่คูโบต้านำมาออกแบบเป็นโลโก้นั้นมีควมใกล้เคียงกันหากทำการตกแต่งดัดแปลงทางโปรแกรมกราฟฟิกโดยทำการตัดพื้นที่บางส่วยของฟอยต์ไป ทำให้ฟอนต์ทั้งสองตัว มีความคล้ายกันมากหรืออากกล่าวได้ว่าเป็นฟอนต์เดียวกันเลย ส่วนข้อความด้านล่างนั้น เป็นฟอนต์ Tribune



วันอังคารที่ 17 มกราคม พ.ศ. 2555

ขั้นตอนการออกบแบบฟอนต์ลายมือใน Fontself



ขั้นตอนการออกบแบบฟอนต์ลายมือใน Fontself
- เข้าไปที่ Website   http://www.fontself.com/
- หลังจากนั้นสมัครสมาชิกให้เรียบร้อย
- เข้าไปในคำสั่ง myfont

- เลือกคำสั่ง Create a new font
ภาพที่1แสดงหน้าเว็บไซต์ www.fontself.com
ที่มา:ชานนท์ เกษมวรรณกร,2555
- ขั้นตอนต่อไปตั้งชื่อ font ของเราครับ
   - หลังจากตั้งชื่อเรียบร้อยแล้ว ก็เลือก Start your font เพื่อทำขั้นตอนต่อไป
ภาพที่ 2 แสดงหน้าเว็บไซต์ www.fontself.com ขั้นตอนการตั้งชื่อฟอนต์
ที่มา:ชานนท์ เกษมวรรณกร,2555

- หลังจากที่เรา Download ไฟล์ PNG และ แล้วออกแบบฟอนต์ลายมือนั้นลงในไฟล์แทมเพลตให้เรียบ ทำการสแกนที่ที่มีค่า DPI สูงๆเพื่อความละเอียดที่คมชัดขึ้น ออกแบบตัวอักษรด้วยมือหรืออุปกรณ์อื่นๆเสร็จแล้ว
       - ก็นำไฟล์ที่เราทำ มา import ทำการอัพโหลดลงไปในโปรแกรมออนไลน์
ภาพที่ 3 แสดงหน้าเว็บไซต์ ขั้นตอนการดาวน์โหลดเทมเพลตฟอนต์
ที่มา:ชานนท์ เกษมวรรณกร,2555
หลังจากนั้นทางเว็บก็จะสแกน font ที่เราเขียนขึ้นมาโดยอัตโนมัติครับ
  
ภาพที่ 4 แสดงหน้าเว็บไซต์ การอัพโหลดไฟล์ฟอนต์ที่ทำการออกแบบไว้
ที่มา:ชานนท์ เกษมวรรณกร,2555

- สามารถปรับขนาดซ้ายขวา จัดตำแหน่งให้เท่ากัน โดยสามารถยืดขยาย หมุ่นและเลื่อนขึ้นลงได้

ภาพที่ 5 แสดงหน้าเว็บไซต์
ที่มา:ชานนท์ เกษมวรรณกร,2555
ภาพที่ 6 แสดงหน้าเว็บไซต์ เมื่อนำไฟล์ที่ออกแบบอัพโหลดลงในโปรแกรมออนไลน์
ที่มา:ชานนท์ เกษมวรรณกร,2555


ภาพที่ 7 แสดงหน้าเว็บไซต์ การCROPภาพฟอนต์ซึ่งอาจมีบางตัวที่หลุดหรือไม่ได้อยู่ในCROPเหลี่ยม
ที่มา:ชานนท์ เกษมวรรณกร,2555
- จะสังเกตได้ว่า ขณะที่เรายังไม่ได้จัดเรียงตัวอักษร ข้อความตัวอย่างด้านบน ยังติดกันอยู่ และไม่มีทิศทาง
  - การที่เราจะปรับขนาดหรือจัดเรียงตัวอักษรนั้น สามารถดูตัวอย่างด้านบนข้อความด้านบนได้ครับ
  - เมื่อปรับเปลี่ยนทุกอย่างจนลงตัวแล้ว ก็เลือก Save Font ได้เลยครับ

ภาพที่ 8 แสดงหน้าเว็บไซต์ จัดช่องไฟของฟอนต์แต่ละตัว
ที่มา:ชานนท์ เกษมวรรณกร,2555

ภาพที่ 9 แสดงหน้าเว็บไซต์
ที่มา:ชานนท์ เกษมวรรณกร,2555
ภาพที่ 10 แสดงหน้าเว็บไซต์
ที่มา:ชานนท์ เกษมวรรณกร,2555

- หากต้องการเซฟแล้วกลับไปแก้ไข้อีก ให้เลือก Save and Continue editing
  - หรือหากต้องการเซฟและออกไปสู่หน้าหลักให้เลือก Save and Exit
ภาพที่ 11 แสดงหน้าเว็บไซต์
ที่มา:ชานนท์ เกษมวรรณกร,2555


เนื้อหารายงานเล่มนี้เป็นการแนะนำการออกแบบฟอนต์ลายมือตัวผู้ออกแบบเองโดยได้อธิบายขั้นตอนการออกแบบตั้งแต่ขั้นเริ่มต้นจนถึงขั้นตอนการนำไปใช้จริงการออกแบบฟอนต์ลายมือชุดนี้เป็นการออกแบบผ่านโปรแกรมFontselfมีทั้งตัวพิมพ์ที่เป็นภาษาอังกฤษและภาษาไทยสามรถนำไปติดตั้งได้บนเครื่องคอมพิวเตอร์พีซีหรือโน๊ตบุคได้เลย

การออกแบบฟอนต์ลายมือจาก FontCreator


ภาพที่1แสดงหน้าเทมเพลตฟอนต์ลายมือ
ที่มา:ชานนท์ เกษมวรรณกร,2555

2.แสกนภาพที่เขียนลงในเครื่องคอมพิวเตอร์ทำการปรับตกแต่งภาพให้เกิดความคมชัด(หากภาพที่แสกนมาไม่ชัดหรือมีพื้นที่ที่ต้องการตัดลบ)ผ่านทางโปรแกรมแต่งรูปตามถนัดในที่นี้ผู้ออกแบบได้ใช้การปรับตกแต่งผ่านทางโปรแกรม photoshop ซึ่งนักออกแบบส่วนใหญ่คงรู้จักกันดี
ภาพที่ 2 แสดงหน้าการปรับแต่งฟอนต์จากโปรแกรมphotoshop
ที่มา:ชานนท์ เกษมวรรณกร,2555

3.เปิดโปรแกรม High-Logic FontCreator ----file----open----font file—  ขั้นตอนนี้เป็นการเลิกเปิดเทมเพลตฟอนต์เพื่อเป็นต้นแบบในการจัดวางฟอนต์ลายมือของเราผู้ออกแบบควรเลือกฟอนต์ที่จะนำมาเป็นแบบเทมเพลตจากฟอนต์ที่เป็นมาตรฐานที่มีทั้งภาษาไทยและภาษาอังกฤษโดยสังเกตว่าไฟล์ที่จะเปิดต้องเป็นไฟล์.ttfในที่นี่ผู้ออกแบบขอใช้เทมเพลตต้นฉบับจากCRU-Pilasluck.ttfซึ่งเป็นฟอนต์ลายมือที่ผู้สอนได้ทำการออกแบบไว้แล้ว
ภาพที่ 3 แสดงหน้าการเปิดไฟล์โปรแกรม FontCreator
ที่มา:ชานนท์ เกษมวรรณกร,2555
ภาพที่ 3.1 แสดงหน้าการเลือกไฟล์ฟอนต์
ที่มา:ชานนท์ เกษมวรรณกร,2555

ภาพที่ 4 แสดงหน้าของโปรแกรม FontCreator
เมื่อนำไฟล์ฟอนต์มาปรับแต่งหรือออกแบบ
ที่มา:ชานนท์ เกษมวรรณกร,2555
4.จากนั้นจะปรากฎเป็นตารงกริดจำนวนมากซึ่งแต่ละช่องนั้นเป็นฟอนต์ที่ออกแบบไว้แล้ว ในที่นี่เราต้องการที่จะทำการออกแบบฟอนต์ที่เป็นลายมือของเราเอง โดยการดับเบิ้ลคลิกที่ช่องที่มีตัวอักษร พยัญชนะหรือสระนั้นแล้วทำการแก้ไขเป็นฟอนต์ของเราเอง
ภาพที่ 5 แสดงหน้าการเปิดไฟล์ฟอนต์ตัวอักษร F
ที่มา:ชานนท์ เกษมวรรณกร,2555

ภาพที่ 6 แสดงหน้าการcopy ภาพจากดปรแกรม PS
ที่มา:ชานนท์ เกษมวรรณกร,2555
5.วิธีการนำฟอนต์ลายมือของเราลงในโปรแกรมฟอนต์High-LogicFontCreatorนั้นทำได้โดยการcopyฟอนต์ทีละตัวมาจากโปรแกรมแต่งภาพปรับภาพแล้วนำไปpast(ก่อนpastควรดับเบิ้ลคลิกที่ฟอนต์นั้นก่อนและทำการpast)ลงแทนฟอนต์ต้นฉบับใน High-Logic FontCreator ทีละตัว
ภาพที่ 7 แสดงหน้าของโปรแกรม FontCreatorการดัดตัวอักษร
ที่มา:ชานนท์ เกษมวรรณกร,2555


6.ปรับขนาดและสัดส่วนของฟอนต์ให้ถูกต้อง การจัดวางช่องไฟ ตำแหน่งระห่างหน้า-หลัง  ความสูง
- cap height คือ ความสูงของตัวอักษรพิพ์ใหญ่
-medien คือ ความสูงของตัวอักษรพิมพ์เล็ก
- x- height คือระห่างระหว่างเส้นฐานจนถึงเส้น medien ซึ่งเป็นช่วงของตัวพิมพ์เล็ก
-baseline คือเส้นฐาน
7.ในขณะทำการ past ฟอนต์ลงในโปรแกรมหรืออาจรอจน past จนเสร็จ ควรกด test หรือ F8 เพื่อทำการตวจระยะห่าง ช่องไฟ ความสูง โดยตรวจให้ครบถ้านอย่างละเอียดโดยเฉพาะ สระและพยัญชนะในภาษาไทยอาจปรากฎเป็นการซ้อนพยัญชนะได้หากจัดไม่ดี
ภาพที่ 8 แสดงหน้าของการเปลี่ยนชื่อและข้อมูลฟอนต์
ที่มา:ชานนท์ เกษมวรรณกร,2555
8.ทำการเปลี่ยนชื่อฟอนต์และข้อมูลผู้ออกแบบ รวมทั้งข้อมูลเกี่ยวกับฟอนต์ด้วย format---naming
ภาพที่ 9 แสดงหน้าของการเปลี่ยนชื่อและข้อมูลฟอนต์
ที่มา:ชานนท์ เกษมวรรณกร,2555

9.save ไฟล์ไว้โดยตั้งชื่อตามที่ต้องการ ในที่นี้ผู้สอนได้บังคบให้ตั้งชื่อโดยขึ้นต้นด้วย CRUแล้วตามด้วยชื่อตัวเอง โปรดระวังว่าข้อมูลบางอย่างที่ติดมากับฟอนต์นั้นอาจมีลิขสิทธ์ด้วย
ภาพที่ 10 แสดงหน้าของการติดตั้งฟอนต์
ที่มา:ชานนท์ เกษมวรรณกร,2555
10.การติดตั้งฟอนต์ในเครื่องพีซีหรือโน๊ตบุค ทำได้ตามปกติ ติดตั้งได้เลย และทดลองใช้ดูให้สมกับงานที่ต้องการด้วย
11.นำฟอนต์ลายมือไปเผยแพร่แจกใช้ฟรี ทาง www.fontspace.com

ขั้นตอนการนำฟอนต์ไปเผยแพร่ในwww.fontspace.com
1. สมัครสามชิกและทำการ log in เพื่อทำการอัพโหลด
ภาพที่ 11 แสดงหน้าของแสดงขั้นตอนการlog inwww.fontspace.com
ที่มา:ชานนท์ เกษมวรรณกร,2555
2.คลิกเลือก up load
ภาพที่ 12 แสดงขั้นตอนการอัพโหลดฟอนต์ในwww.fontspace.com
ที่มา:ชานนท์ เกษมวรรณกร,2555
3. เลือกไฟล์ฟอนต์ที่ต้องการอัพโหลดลง
ภาพที่ 13 แสดงขั้นตอนการอัพโหลดฟอนต์ในwww.fontspace.com
ที่มา:ชานนท์ เกษมวรรณกร,2555
ตั้งชื่อและอธิบายรายละเอียดเกี่ยวกับฟอนต์รวมทั้งข้อมูลของผู้ออกแบบด้วย
ภาพที่ 14 แสดงขั้นตอนการอัพโหลดฟอนต์ในwww.fontspace.com
ที่มา:ชานนท์ เกษมวรรณกร,2555
หน้าสำหรับเผยแพร่เพื่ออัพโหลดนำไปใช้
ภาพที่ 15 แสดงหน้าเว็บไซต์ fontspace
ที่มา:ชานนท์ เกษมวรรณกร,2555


เนื้อหารายงานเล่มนี้เป็นการแนะนำการออกแบบฟอนต์ลายมือตัวผู้ออกแบบเองโดยได้อธิบายขั้นตอนการออกแบบตั้งแต่ขั้นเริ่มต้นจนถึงขั้นตอนการนำไปใช้จริงการออกแบบฟอนต์ลายมือชุดนี้เป็นการออกแบบผ่านโปรแกรมHigh-LogicFontCreatorมีทั้งตัวพิมพ์ที่เป็นภาษาอังกฤษและภาษาไทยสามรถนำไปติดตั้งได้บนเครื่องคอมพิวเตอร์พีซีหรือโน๊ตบุคได้เลย
ขั้นตอนการออกแบบฟอนต์ลายมือ จาก FontCreator
1.ดาวน์โหลดแทมเพลตที่เป็น grid สำหรับเขียนฟอนต์ลายมือโดยในที่นี้ผู้ออกแบบได้ประสบปัญหาว่าตารางที่ดาวน์โหลดมานั้นช่องในการเขียนเล้กเกิดไปสร้างปัญหาในการแสกนไม่ชัดจึงได้ปรับปรุงโดยการขยายเทมเพลตให้ใหญ่ขึ้นเพื่อง่ายต่อการเขียนและเพื่อความละเอียดที่ชัดขึ้นเมื่อนำไปแสกน

วันอาทิตย์ที่ 15 มกราคม พ.ศ. 2555

สัปดาห์ที่ 6

สรุปผลการเรียนรู้รายสัปดาห์
1.สั่งานให้ศึกษาดูงานจาก BOI FAIR
-BOI คืออะไร
-งานเกี่ยวกับอะไร
-เทคโนโลยีที่เกี่ยวข้องกับการออกแบบมีอะไรบ้าง
-มีการนำเสนออย่างไร
-เห็นฟอนต์ในการแสดงมีอะไรบ้าง
2.งานออกแบบฟอนต์ลายมือจาก font creator ทำการเปลี่ยนชื่อเจ้าของและผู้ออกแบบเป็นชื่อตัวเอง
3.อัพโหลดฟอนต์ลายมือที่ fontspace.com
4.ออกแบบหรือปรับปรุงฟอนต์เก่าให้ดีขึ้นเป็นversion 1
5.สรุปผลและรายงานส่งผู้สอน ทาง google document

สรุปงานและผลการเรียนรู้ที่ได้รับ
1.แนะนำวิธีการทำงานของโปรแกรม font creator
2.สร้างตัว Master Hxdp
ถาพที่ 1 แสดงกริด Glyp Structure ใน font creator

3.สร้าง grid ใหม่ใน  font creator ตั้งชื่่อเป็น Glyp Structure
4.การตั้งชื่อ ฟอนต์ ให้ขึ้นต้นด้วย CRU-JANON-HAND WRITTEN
ถาพที่ 2 แสดงการตั้งชื่อฟอนต์

วันพฤหัสบดีที่ 5 มกราคม พ.ศ. 2555

สัปดาห์ที่ 5 Free Online GooglrApps Tools Assisted Design : Preliminary Design Research


1.แนะนำการใช้โปรแกรม Font Creator เพิ่มเติม
2.เมื่อได้ฟอนต์ออกแบบสำเร็จเรียบร้อยแล้ว ให้ไปอัพโหลดลง fontspace.com
3.ฟอนต์ลายมือที่ีสำเร็จแล้วให้ติดตั้งลงเครื่องแล้วทดลอง และให้เขียนเป็นเวอร์ชั่น 0
4.ปรับเปลี่ยนแก้ไขหรือสร้างฟอนต์ใหม่โดยเปลี่ยนเป็นเวอร์ชั่น1
5.ส่งฟอนต์ออกแบบทั้งสองเวอร์ชั่นใน Google Document และส่งรายงาน
Boifair2011
6.สั่งงานดูงาน BOI FAIR แบบเจาะลึก รายเลียด ความหมาย BOI ,เทคโนโลยีที่เกี่ยวข้องกับการออกแบบมีอะไรบ้าง มีการนำเสนออย่างไร เห็นฟอต์แล้วถ่ายรูปมาด้วย เป็นฟอนต์ที่ออกแบบเองมาใหม่หรือไม่
7.สรุปผลการดูงาน BOI FAIR แล้วทำรายงานส่งผู้สอน ผ่านทางGoogle Document และสรุปลง Blogger
 เว็บไซต์งานนิทรรศการ http://www.boifair2011.com/view/th/home/home.jsf
ติดตามข้ออัพเดตผ่านทางสังคมออนไลน์ http://th-th.facebook.com/boifair2011,http://twitter.com/#!/boifair2011

สัปดาห์ที่ 4 Free Online Tools Assisted Design

ติดตั้งการและสอนการใช้โปรแกรมออกแบบฟอนต์ font creator


โดยการออกแบบฟอนต์ต้องเริ่มต้นการดาวน์โหลดแทมเพลตแบบตารางกริดมาก่อน โดยโปรแจคนี่ผู้สอนได้แจกเทมเพลตที่เป็นทั้งไทยและอังกฤษให้เพื่อนำไปเขียนเป็นลายมือตัวเองแล้วมาแสกน บันทึกและแชร์เอกสาร ผ่านทางgoogle document
เขียนลายมือตัวเองลงด้วยหมึกดำ ดดยให้ศึกษาถึงตำแหน่งในการเขียนให้ถูกต้อง แล้วนำมาแสกนในResalution สูง แล้วบันทึกเป็นไฟล์PNG


เปิดโปรแกรม font creator ขึ้นมาแล้วเปฺดไฟล์แทมเพลตขึ้นในโปรแกรม PHOTOSHOPหรือโปรแกรมเปิดรูปใดก็ได้แล้วทำการคัดลอกฟอนต์ลายมือลงใน font creator จนครบทุกตัว เมื่อเสร็จสิ้นให้ทำการตั้งชื่อฟอนต์โดยขึ้นต้นด้วยCRU-ชื่อตัวเอง แล้วบันทึกเป็นไฟล์ttf และติดตั้งลงเครื่องนำไปใช้ได้เลย แต่ให้ระวังเรื่องลิขสิทธิ์ด้วย

วันเสาร์ที่ 24 ธันวาคม พ.ศ. 2554

สัปดาห์ที่ 3 computer assisted design: Online Tools





ศึกษาสัดส่วนและการจัดวางช่องไฟของการออกแบบฟอนต์
1.Font Kerning
2.Font Mpping
3.Bearing ชาน
4.Baseline เส้นตรงกลาง
5.X-Height
6.Cap-Height
7.Glyph รูปอักขระ
8.Font Template
9.Program Font
10.Tye Aranging
11.Asender
12.Descender




ที่มา:http://arti3319.blogspot.com/2011/07/blog-post.html

สรุปงานสัปดาห์ที่3
-ดาวน์โหลดtemplate จาก http://sites.com/site/arti2035/fontfile หรือจากที่ผู้สอนแชร์เอกสารผ่านทางGoogel doc
-เขียนฟอนต์ลายมือลงในเทมเพลตโดยใช้หมึกดำ ประมาณสามแผ่นแล้วอัพโหลดลง http://www.fontself.com/ พร้อมรายงานสรุป
-ดาวน์โหลดฟอนต์th ,sipa font :ซึ่งเป็นฟอต์แห่งชาติพยัญชนะไทย ศึกษาลักษณะและรายละเอียดของฟอนต์
-ศึกษาฟอนต์ภาษาอังกฤษ ขนาด ลักษณะ การจัดช่องไฟ ฯลฯ และนำมาวิเคราะห์เปรียบเทียบกับพยัญชนะไทย โดย ต้องมีการเปรียบเทียบสระ วรรณยุกต์ด้วย

-สรุปงานโปรเจคคือ English-Thai-Font Mathing
 -ฟอนต์ลายมือทำด้วยโปรแกรม Font Creator