IT NURSE & 
INFOGRAPHIC

SUMONTHIRA

1

¡Í§¡ÒþÂÒºÒÅ Êํҹѡ§Ò¹»ÅÑ´¡ÃзÃǧÊÒ¸ÒóÊØ¢ Ñ̈´»ÃЪØÁàªÔ§» Ô̄ºÑµÔ¡ÒÃ
 àÃ×่ͧ “¡ÒþѲ¹ÒÈÑ¡ÂÀÒ¾¾ÂÒºÒÅÊÒÃʹà·È” ÃÐËÇ่Ò§Çѹ·Õ่ 14-15 ¸Ñ¹ÇÒ¤Á 2560 
 «Ö่§ã¹¡ÒûÃЪØÁ¤ÃÑ้§¹Õ้ à¾×่;Ѳ¹ÒÊÁÃö¹Ð´้ҹ෤â¹âÅÂÕÊÒÃʹà·È·Ò§¡ÒþÂÒºÒÅ 
 ÊÃÒ้§¤ÇÒÁÃÙ¤้ÇÒÁà¢Ò้ã¨ã¹¡Ò÷ํÒ§Ò¹Âؤ´Ô̈ Ô·ÑÅ áÅÐÊÒÁÒöà»็¹¼Ù้¹ํÒãËà้¡Ố ¡ÒÃà»ÅÕÂ่¹á»Å§
 ÊÙ่âç¾ÂÒºÒÅä´้ ª่Ç»ÃÐÊÒ¹§Ò¹ ¤ÇÒÁà¢้Ò㨠à»็¹¾×้¹·Õ่áÅ¡à»ÅÕ่¹àÃÕ¹ÃÙ้¢Í§à¤Ã×Í¢่Ò 
 áÅÐà»็¹áËÅ่§¢้ÍÁÙŢͧÊ่ǹ¡ÅÒ§ à¾×่Í»ÃСͺ¡ÒõѴÊÔ¹ã¨ÊํÒËÃѺ¼Ù้ºÃÔËÒÃä´้ 
 㹡ÒûÃЪØÁ¤ÃÑ้§¹Õ้ÁÕËÅÒÂàÃ×่ͧ·Õ่¹่Òʹ㨠áÅÐ Infographic : ¡ÒÃà»ÅÕ่¹¢้ÍÁÙÅ·Õ ่ 
 à¢้Òã¨ÂÒ¡ãË้à»็¹ÀÒ¾·Õ่·Ã§¾Åѧà¾×่Í¡ÒâѺà¤Å×่͹ ¡็à»็¹àÃ×่ͧ¹Ö§·Õ่¹่Òʹ㨹ํÒÁÒ½Ò¡¡Ñ¹

ต้นกำเนิด 
อินโฟกราฟิก

2

INFOGRAPHICINFOGRAPHIC

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

INFOGRAPHIC

ที่โด่งดังเกิดขึ้นในปี ค.ค.1857 โดย ฟลอเรนซ์ ไนติงเกล (Florence Nightingale) ที่อธิบายถึงสาเหตุการตายของทหารในแต่ละเดือน ซึ่งจัดทำขึ้นเพื่อเสนอต่อราชินีวิคตอเรีย 


ผลงานชิ้นนี้เรียกว่า Nightingale Rose Diagram

1

อินโฟกราฟิกแบบภาพนิ่ง (Static infographics)การสรุปเนื้อหาในหนึ่งหน้า โดยใช้ ไอคอน รูปภาพ และข้อความ 
ข้อดี : ผลิตได้ง่าย ต้นทุนต่ำ สามารถแชร์ได้ง่าย ข้อเสีย : หากข้อมูลสามารถจัดแบ่งได้หลายกลุ่มจะยากต่อการทำความเข้าใจ ไม่ดึงดูด

01

มีปฏิสัมพันธ์โต้ตอบกับผู้ชม เปลี่ยนการแสดงผลได้ตามที่เลือก มักใช้ในเวปไซด์ ข้อดี. : เข้าใจง่าย หากข้อมูลมีหลายกลุ่ม สามารถปรับปรุงข้อมูลได้ตลอดเวลา ข้อเสีย : ผู้ผลิตต้องมีความเข้าใจในการเขียนโปรแกรมและการจัดการฐานข้อมูล

02

03

ประเภทของอินโฟกราฟิก

อินเตอร์แอ็คทีฟอินโฟกราฟิก (Interactive infographics)

อินโฟกราฟิกที่มีการเคลื่อนไหว เช่น VDO หรือไฟล์เคลื่อนไหวอื่นๆ กลุ่มคนเล่นเวฟ มักใช้ในการเล่าเรื่องหรืออธิบายกลไกต่างๆ ข้อดี. : ดึงดูดความสนใจได้มาก ข้อเสีย : ต้นทุนการผลิตสูง มีขนาดไฟล์ใหญ่ที่สุด

โมชั่นอินโฟกราฟิก (Motion infographics)

อินโฟกราฟิกเป็นสารสนเทศที่ต้องสร้างขึ้นมาอย่างเป็นระบบในเอกสารนี้ 
อ.กฤษณพงศ์ เลิศบำรุงชัย จะอธิบายแนวคิดในการผลิตอินโฟกราฟิกให้เข้าใจง่ายๆ

ÊØÁŸÔÃÒ

อินโฟกราฟิกและหลักการออกแบบ

วิทยากร : อ.กฤษณพงศ์ เลิศบ ารุงชัยสาขาวิชาเทคโนโลยีมัลติมีเดีย คณะเทคโนโลยีสื่อสารมวลชน มหาวิทยาลัยเทคโนโลยีราชมงคลธัญบุรี

คัดข้อมูลให้โดนใจ จุดไอเดียให้ปัง

Kridsanapong.ler@hotmail.comTouchPoint.in.th | Khaooat.comfacebook.com/TouchPoint.in.th

ความหมายของ Infographic

หมายถึง สื่อความหมายด้วยเส้น

สัญลักษณ์ รูปวาด ภาพถ่าย กราฟ

แผนภูมิ การ์ตูน ฯลฯ เพื่อให้

สามารถสื่อความหมายข้อมูลได้

ถูกต้องตรงตามที่ผู้สื่อสารต้องการ

Informationหมายถึง ข้อมูลที่ถูกยอ่ยในลักษณะ

ของสารสนเทศ

Graphic

ความหมายของ Infographic

หมายถึง การน าข้อมูลมาสรุปเป็น

สารสนเทศ ในลักษณะของกราฟิก

เพื่อสื่อความหมายที่เข้าใจง่าย ตรง

ตามที่ผู้สื่อสารต้องการ

Infographic

ขั้นตอนการท า Infographic

ก าหนดประเด็น

รวบรวมข้อมูลที่เกี่ยวข้อง

1 32 4 5 6 7 8 9

คัดเลือกสาระส าคัญ

จัดหมวดหมู่

สร้างไอเดียการเล่าเรื่อง

วางเลยเ์อาท์

หาภาพประกอบ

ท าให้สวยงาม

เผยแพร่ผลงาน

ขั้นตอนการท า Infographic1. ก ำหนดประเด็น

• Who >> กลุ่มผู้อ่านเป็นใคร (มีผลต่อการออกแบบ)• What >> ท าเรื่องเกี่ยวกับอะไร• Why >> ท าไปท าไม ท าด้วยเหตุผลใด ท าเพื่อ...• Where >> ท าที่ไหน หรือเหตุการณ์ของสิ่งที่ท าอยู่ที่ไหน• When >> ท าเมื่อไหร่ เสร็จเมื่อไหร่• How >> ท าอย่างไร ใช้เครื่องมืออะไร

ขั้นตอนการท า Infographic2. รวบรวมข้อมูลที่เกี่ยวข้อง

เมื่อได้เรื่องที่จะท าแล้ว จะต้องรวบรวมข้อมูลและข้อเท็จจริงที่เกิดขึ้นทุกอย่างให้ละเอียด

ไม่ว่าจะเป็นข้อความ หรือข้อมูลทางสถิติ

ขั้นตอนการท า Infographic3. คัดเลือกสำระส ำคัญ

คัดแยกข้อมูลที่ส าคัญและจ าเป็นต้องใช้ โดยพิจารณาจาก อะไรที่คนอยากรู้หรือไม่อยากรู้ จดหรือไฮท์ไลท์

ประโยคหรือค าที่เราอ่านแล้วรู้สึก Wow แล้วลองถามเพื่อนว่า Wow เหมือนเราหรือไม่

ขั้นตอนการท า Infographic4. จัดหมวดหมู่

น าข้อมูลที่กระจายมาจัดเป็นกลุ่ม เช่น ความหมาย สาเหตุ วิธีแก้ไข เทคนิค เป็นต้น

ขั้นตอนการท า Infographic5. สร้ำงไอเดียกำรเล่ำเรื่อง

การสร้าง Infographic ให้ปัง ควรตั้งชื่อเรื่องให้กระชับ น่าฟัง ชวนอ่าน และควรน าเสนอเป็นภาพด้วยการเล่าเร่ือง เพื่อความไม่น่าเบื่อจากการ

เล่าตรงๆ คิดถึงการเชื่อมโยงระหว่างข้อมูลกบัรูปภาพให้ได้ จะได้รู้ว่า

ควรใช้ภาพแบบใดในการเล่าเร่ือง

ขั้นตอนการท า Infographic6. วำงเลยเ์อำท์

แบ่งสัดส่วนข้อมูล ภาพประกอบ และที่ส าคัญ

ต้องค านึงถึงพื้นที่ว่างด้วย เพราะพื้นที่ว่างจะ

ช่วยให้รู้สึกสบายตา และช่วยให้ผู้อ่านโฟกัส

ข้อมูลส าคัญได้ง่ายมากขึ้น

ขั้นตอนการท า Infographic7. หำภำพประกอบ

ภาพประกอบมีความส าคญัมาก ภาพ 1 ภาพ ใช้แทนค าพูดได้มาก ต้องเป็นภาพที่สัมพันธ์กับข้อมูล

รวมถึงไอคอนต่างๆ ด้วย เว็บภาพประกอบฟรี freepik.com และ flaticon.com แต่วาดเองจะดีกว่า

ขั้นตอนการท า Infographic8. ท ำให้สวยงำม

ควำมสวยงำมขึ้นอยู่กับ

เลยเอาท์ | รูปภาพประกอบ | โทนสี ฟอนต์ | ที่ว่างโปรแกรมที่ใช้ เช่น Adobe Photoshop | Adobe Illustrator | Piktochart

ขั้นตอนการท า Infographic9. เผยแพร่ผลงำน

น า Infographic ที่สมบูรณ์เผยแพร่สู่โลกออนไลน์ เช่น Website | Facebook พร้อมแคปชั่นที่น่าดึงดูดติด TAG หรือ HASHTAG # เพื่อให้ Search Engine หาเจอได้ง่าย

กิจกรรมที่ 1ฝึกหำข้อมูลเพิ่มเติมแล้วย่อยข้อมูลจำกเรื่องที่ก ำหนดให้

FoMO (Fear of Missing Out) อาการที่คนรุ่นใหม่มักจะเป็น คือ กลัวตกกระแส กลัวเชย และกลัวไม่เข้ากับเพื่อนๆ

แนวความคิด FoMO ไม่ใช่เรื่องใหม่ที่เพิ่งเกิดขึ้นในช่วงเวลา 2-3 ปีมานี้ แต่ได้ถูกกล่าวถึงครั้งแรกในปี 1996 โดย Dan Herman เขาได้กล่าวว่า FoMO เป็นประสบการณ์ที่ได้รับจากความกลวัที่จะรู้สึกว่าตัวเองล้มเหลวหรือตนเองพลาดโอกาส คนที่มีอาการ FoMO ถ้าเปรียบเสมือนมีน้ าอยู่ครึ่งแก้ว จะรู้สึกกังวลอย่างรุนแรงต่อการมีน้ าเหลือครึ่งแก้วอยู่เสมอ และให้ความสนใจไปในการที่จะเติมน้ าให้เต็มพื้นที่อีกคร่ึงหนึ่งที่วา่งเปล่าของแก้วอยูต่ลอดเวลา

รูปแบบของภาพ

1. ภำพแบบเวกเตอร์ (Vector)เป็ น รู ปแบบภาพที่ ป ระมวลผลด้ วยการค านวณทาง

คณิตศาสตร์ มีสีและต าแหน่งของสีที่แน่นอน สามารถย่อหรือขยายได้

โดยไม่เสียคุณภาพไฟล์

2. ภำพแบบรำสเตอร์ (Raster/Bitmap)เป็นรูปแบบภาพที่ค่าสีจะถูกเก็บไว้ในแต่ละพิกเซล มีการเก็บ

ค่าสีที่เฉพาะเจาะจงในแต่ละต าแหน่ง หากย่อหรือขยายรูปภาพก็จะเสีย

คุณภาพของไฟล์ไป

โหมดสีของภาพ

RGB ประกอบด้วยสีหลักคือ Red (สีแดง), Green (สีเขียว), Blue (สีน้ าเงิน) ผสมกัน เหมาะส าหรับ

ภาพที่ใช้แสดงผลบนจอภาพ

CMYK ประกอบด้วยสีหลักคือ Cyan (สีฟ้าอมเขียว) , Magenta (ชมพูอมม่วง), Yellow (สีเหลือง), Black (สีด า) เหมาะส าหรับภาพที่ใช้ในงานพิมพ์

ความละเอียดของภาพ (Resolution)

Resolution คือ ความละเอียดในการแสดงผลของภาพ ยิ่งมีค่ามากยิ่งมีความละเอียดสูงและมีขนาดไฟล์ที่ใหญ่ เช่น หากภาพมีความละเอียด 150 Pixels/Inch หมายความว่าใน 1 ตารางนิ้วประกอบด้วยเม็ดสี 150 พิกเซล

• ส าหรับงานในจอภาพควรปรับ 72 Pixels/Inch• ส าหรับงานในจอภาพ Retina Display ควรปรับ 150 Pixels/Inch• ส าหรับงานพิมพ์ควรปรับ 300 Pixels/Inch

ชนิดของภาพที่นิยมใช้ในงานกราฟิก

Photoshop (.psd) เป็นไฟล์มาตรฐานของ Adobe Photoshop สามารถบันทึกและเปิดเพื่อแก้ไขได้ตลอดเวลา โดยยังรักษาคุณสมบัติต่างๆ เช่น สี เอฟเฟกต์ เลเยอร์ เอาไว้

Illustrator (.ai) เป็นไฟล์มาตรฐานของ Adobe Illustrator สามารถบันทึกและเปิดเพื่อแก้ไขได้ตลอดเวลา โดยยังรักษาคุณสมบัติต่างๆ เช่น สี เอฟเฟกต์ เลเยอร์ เอาไว้

Bitmap (.bmp) เป็นไฟล์มาตรฐานของระบบปฏิบัติการ Windows มีขนาดใหญ่JPEG (.jpg) เป็นไฟล์ที่ถูกบีบอัดข้อมูลให้มีขนาดเล็ก แต่ยังคงความคมชัด นิยมใช้สร้างเว็บไซต์

ชนิดของภาพที่นิยมใช้ในงานกราฟิก

PNG (.png) เป็นไฟล์ที่ถูกบีบอัดข้อมูลให้มีขนาดเล็ก แต่สูญเสียรายละเอียดของภาพน้อยมาก และสามารถท าภาพโปร่งใสได้ด้วย นิยมใช้บนเว็บไซต์

GIF (.gif) เป็นไฟล์ภาพที่ถูกบีบอัดข้อมูลให้มีขนาดเล็กมาก แต่จ ากัดสีเพียง 256 สีเท่านั้น สามารถท าภาพโปร่งใสและภาพเคลื่อนไหวได้

TIFF (.tiff) เป็นไฟล์ที่ไม่บีบอัดข้อมูล มีความคมชัดสูงมาก มีขนาดไฟล์ที่ใหญ่ เหมาะกับงานสื่อสิ่งพิมพ์

RAW (.raw) เป็นไฟล์ภาพที่ได้จากกล้องดิจิตอลที่ไม่มีการบีบอัด เก็บค่าแสงและสีทุกค่า ท าให้ไฟล์มีขนาดใหญ่ เหมาะกับการน าไปปรับแต่ง

องค์ประกอบของงานกราฟิก

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

1. เส้น

องค์ประกอบของงานกราฟิก

รูปร่างเกิดจากการน าเส้นมาต่อกันจนได้รูปร่าง 2 มิติที่มีความกว้างและความยาว หรือความสูง รูปร่างแบ่ง

ออกเป็น 2 ลักษณะ ได้แก่

• รูปร่างที่คุ้นตา คือ แบบที่เห็นแล้วรู้ว่าคืออะไร เช่น ดอกไม้หรือคน• รูปร่างแบบฟรีฟอร์ม คือ แบบที่ไม่มีรูปร่างแน่นอน แต่ดูแล้วเกิดจินตนาการถึงอารมณ์ที่ต้องการสื่อได้

2. รูปร่ำง

องค์ประกอบของงานกราฟิก

รูปทรง เป็นรูปร่างที่มีมิติเพิ่มขึ้นมากลายเป็นงาน 3 มิติ คือ มีความลึกเพิ่มเข้ามาด้วย

3. รูปทรง

องค์ประกอบของงานกราฟิก

น้ าหนักเป็นส่วนที่เสริมให้รูปทรงมีน้ าหนัก เบาหรือหนัก ทึบหรือโปร่งแสง โดยน้ าหนัก

จะเกิดจากการเติมแสงและเงา

4. น้ ำหนัก

องค์ประกอบของงานกราฟิก

พื้นผิว คือ สิ่งที่แสดงให้รู้ว่ารูปร่างหรือรูปทรงที่น ามาใช้งานมีสัมผัสอยา่งไร โดยแบ่งเป็น 2 สัมผัส ได้แก่

• ส าผัสได้ด้วยมือ เช่น พื้นผิวขรุขระของรูปปั้นที่แสดงออกถึงความแข็งแกร่ง หยาบกระด้าง• สัมผัสได้ด้วยสายตา เช่น พื้นผิวของส่วนต่างๆ ในภาพที่เพียงมองเห็นก็รู้ว่าหมายถึงผิวสัมผัสแบบใด

5. พื้นผิว

องค์ประกอบของงานกราฟิก

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

6. ที่ว่ำง

องค์ประกอบของงานกราฟิก

สี ถือเป็นหัวใจส าคัญของงานกราฟิก เพราะการเลือกใช้สีจะแสดงถึงอารมณ์ที่ต้องการได้อย่างชัดเจนมากกว่า

ส่วนประกอบอื่นๆ ทั้งหมด เช่น

7. สี

สีโทนร้อน ส าหรับงานที่ต้องการ

ความตื่นเต้น ท้าทาย

สีโทนเย็น ส าหรับงานที่

ต้องการให้ดูสุภาพ สบายๆ

องค์ประกอบของงานกราฟิก

ตัวอักษร เป็นสิ่งส าคัญในงานกราฟิกดีไซน์ บางครั้งเพียงใช้แค่ตัวอักษรและสีเป็นส่วนประกอบ

เพียงสองอย่าง ก็สามารถสร้างสรรค์งานที่สื่อความหมายอกมาได้ในดีไซน์ที่สวยงาม

8. ตัวอักษร

ความหมายของสี

• สีแดง ให้ความรู้สึกอันตราย เร่าร้อน รุนแรง มั่นคง อุดมสมบูรณ์• สีส้ม ให้ความรู้สึกสว่าง เร้าร้อน ฉูดฉาด• สีเหลือง ให้ความรู้สึกสว่าง สดใส สดชื่น ระวัง• สีเขียว ให้ความรู้สึกงอกงาม พักผ่อน สดชื่น• สีน้ ำเงิน ให้ความรู้สึกสงบ ผ่อนคลาย สง่างาม• สีม่วง ให้ความรู้สึกหนัก สงบ มีเลศนัย• สีน้ ำตำล ให้ความรู้สึกเก่า หนัก สงบเงียบ

ความหมายของสี

• สีขำว ให้ความรู้สึกบริสุทธิ์ สะอาด ใหม่ สดใส• สีด ำ ให้ความรู้สึกหนัก หดหู่ เศร้าใจ ทึบตัน• สีทองเงินและสีที่มันวำว แสดงถึงความรู้สึกมั่นคง• สีด ำที่อยู่กับสีขำว แสดงถึงความรู้สึกทางอารมณ์ที่ถูกกดดัน• สีเทำปำนกลำง แสดงถึงความน่ิงเฉย สงบ• สีเขียวแก่ผสมกับสีเทำ แสดงถึงความสลด รันทด ชรา• สีสดและสีบำงๆ ทุกชนิด แสดงความรู้สึกกระชุ่มกระชวย แจ่มใส

เทคนิคการน าสีไปใช้งาน

เทคนิคการเลือกสีไม่ได้มีสูตรส าเร็จตายตัว แต่โดยมากแล้วจะเลือกจากวธิีโยงความสมัพันธ์จากวงล้อ

ความสัมพันธจ์ากวงล้อสี ก่อนจะท างานทุกคร้ัง แนะน าว่าให้เปิดวงล้อสีขึ้นมา แล้วเลือกสีหลักๆ ส าหรับใช้ในการ

ท างานกันก่อน เทคนิคที่นิยมใช้มีอยู่ 4 รูปแบบ ได้แก่

เทคนิคการน าสีไปใช้งาน

• Mono เป็นการใช้สีโทนเดียวกันทั้งหมด เช่น จุดเด่นเป็นสีแดง สีส่วนที่เหลือจะใช้สีที่ใกล้เคียงกับสีแดง โดยใช้วิธีลดน้ าหนักความเข้มของสีแดงลงไป

• Complement คือสีที่ตัดกันหรือสีตรงกันข้ามกันในวงจรสี เช่น สีฟ้าจะตรงข้ามกับสีส้ม หรือสีแดงจะตรงข้ามกับสีเขียว สามารถน ามาใช้งานได้หลายอย่าง ไม่ควรใช้ปริมาณเท่ากัน ควรใช้ 80/20 หรือ 70/30

โดยประมาณ ท าให้พื้นที่น้อยกลายเป็นจุดเด่นของภาพ

• Triad คือ การเลือกสีสามสีที่มีระยะห่างเท่ากันเป็นสามเหลี่ยมด้านเท่ามาใช้งาน• Analogic คือ การเลือกสีใดสีหนึ่งขึ้นมาใช้งานพร้อมกับสีที่อยู่ติดกันอีกข้างละสี หรือสีสามสีที่อยู่ติดกันใน

วงจรสีนั่นเอง

เทคนิคการน าสีไปใช้งาน

ส ำหรับยุคปัจจุบัน วงล้อสีพร้อมวิธีเลือก

มีให้ใช้งำนสะดวกกว่ำสมัยก่อนมำก เช่น

โปรแกรม Kuler ของ Adobe ที่เป็นโปรแกรมในกำรเลือกสีในอำรมณ์ต่ำงๆ

หรือเว็บไซต์ที่มีวงล้อสีส ำเร็จรูปพร้อม

โ ค้ ด สี ส ำ ห รั บ น ำ ไ ป ใ ช้ ง ำ น เ ช่ น

http://paletton.com/

ตัวอักษร

1. Body & Proportion

• Body หลักๆ จะประกอบไปด้วย Body และแขนขา สิ่งส าคัญที่สุดจะส่งผลถึงการเลือกใช้งานฟอนต์• Proportion หมายถึง ลักษณะของตัวอักษร ได้แก่ ตัวปกติ (Regular) ตัวหนา (Bold) และตัวเอียง (Italic)

ในบางครั้งอาจจะมีแยกย่อยลงไปอีก เช่น ตัวหนาเอียง (Bold Italic) เป็นต้น

ตัวอักษร

2. รูปแบบของตัวอักษร

• Serif เป็นตัวอักษรแบบมีเชิงหรือมีฐานอยู่ตรงปลาย ดูเป็นระเบียบ เป็นทางการ เหมาะจะใช้ในงานที่เป็นทางการ และ

ต้องการความน่าเชื่อถือ

• San Serif เป็นตัวอักษรที่ไม่มีเชิงหรือไม่มีฐานตรงส่วนปลาย อ่านง่าย ดูทันสมัยมากกว่าแบบอื่นๆ เหมาะจะใช้ในงานที่ต้องการ

ความทันสมัย ไม่เป็นทางการมากนัก

AA

ตัวอักษร

2. รูปแบบของตัวอักษร

• Antique เป็นตัวอักษรประดิษฐ์แบบโบราณ เหมาะกับงานที่ต้องการความชัดเจนของยุค

สมัย หรือต้องการอารมณ์ย้อนยุคนิดหน่อย

• Script เป็นตัวอักษรที่มีลักษณะเหมือนลายมือ เหมาะกับงานที่ไม่เป็นทางการ ต้องการความเป็น

กันเองและดูสนุกสนานมากกว่าแบบอื่นๆ

A B C

การเลือกฟอนตไ์ปใช้ในงาน Infographic

กำรเลือก Font ไปใช้งำนในกำรออกแบบมีอยู่ 2 ข้อ ได้แก่

• ควำมหมำยต้องเข้ำกัน หมายถึง ความหมายของค าและฟอนต์ที่เลือกใช้ควรจะไปด้วยกันได้ เช่น ค าว่าน่ารักก็ควรใช้ฟอนต์ที่ดูน่ารักไปด้วย ไม่ควรใช้ฟอนต์ที่ดูเป็นทางการ

• อำรมณ์ของฟอนต์ หมายถึง อารมณ์ของงานกับฟอนต์ที่เลือกใช้ควรไปในทิศทางเดียวกัน เช่น งานที่ต้องการความน่าเชื่อถือจะเลือกใช้ฟอนต์แบบ San Serif ที่ดูหนักแน่น น่าเชื่อถือ ส่วนงานที่ต้องการความฉูดฉาดอบ่างป้ายโปสเตอร์ลดราคาจะเลือกใช้ฟอนต์ที่ไม่เป็นทางการมากนักอย่างฟอนต์ในกลุ่ม Script

การวางต าแหน่งตัวอักษร

• ธรรมชาติการอ่านของคนไทยจะอ่านจากซ้ายไปขวาและบนลงล่าง ถ้าอยากให้อ่านง่ายควรจะวางเรียงล าดับให้ดี ไม่เช่นนั้นจะเป็นการอ่านข้ามไปข้ามมาท าให้เสียความหมายของข้อความไป

• จุดเด่นควรจะมีเพียงจุดเดียว มีตัวอักษรตัวใหญ่ๆ อยู่เพียงชุดเดียว จึงจะเป็นจุดเด่นที่มองเห็นได้ง่าย ไม่สับสน ส่วนจุดอื่นๆ ขนาดควรจะเล็กลงมาตามล าดับความส าคัญ

• ไม่ควรใช้ฟอนต์หลากหลายรูปแบบมากเกินไป เนื่องจากการใช้ฟอนต์หลากหลายรูปแบบท าให้อ่านยาก แนะน าให้ใช้ Font เดิมแต่ไปตกแต่งขนาด ก าหนดความหนาหรือความเอียง เพื่อเพิ่มความน่าสนใจจะดีกว่า

Kridsanapong.ler@hotmail.comTouchPoint.in.th | Khaooat.comfacebook.com/TouchPoint.in.th

สอบถามข้อมูลเพิ่มเติม

ขอบคุณส าหรับการรับชม

Kridsanapong.ler@hotmail.comTouchPoint.in.th | Khaooat.comfacebook.com/TouchPoint.in.th