2.infographic

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

โดย สมชาย เมอื งมลู
คณะครศุ าสตร์ มหาวทิ ยาลัยราชภฏั ลาปาง

การออกแบบและพฒั นาอินโฟกราฟกิ | 1

สารบญั
1. ความหมายของอินโฟกราฟิก .......................................................................... 3
2. องคป์ ระกอบของงานอินโฟกราฟิก ................................................................. 4
3. ประเภทของอนิ โฟกราฟกิ ............................................................................... 5
4. ขนาดของอนิ โฟกราฟิก ................................................................................... 7
5. รูปแบบของอนิ โฟกราฟิก ................................................................................ 9
6. ข้ันตอนการพัฒนาอนิ โฟกราฟิก....................................................................11
7. การสร้างอินโฟกราฟิกใหม้ ีประสิทธิภาพ.......................................................13
8. เคร่อื งมอื ที่ใชใ้ นการพัฒนาอินโฟกราฟกิ .......................................................14
9. ประโยชนข์ องอนิ โฟกราฟิก...........................................................................16
10. ขอ้ มูลพน้ื ฐานเวบ็ ไซต์แคนวา ......................................................................17
11. การสมคั รใชง้ าน..........................................................................................19
12. ส่วนประกอบของหนา้ จอหลกั ....................................................................20
13. ส่วนประกอบของหน้าจอสร้างผลงาน ........................................................21
14. การสร้างอนิ โฟกราฟิก ................................................................................25
15. การส่งออกผลงานอินโฟกราฟิก..................................................................33

2 | การออกแบบคอมพวิ เตอร์กราฟิก

1. ความหมายของอินโฟกราฟกิ
อินโฟกราฟิก (Infographic) เป็นคาทับศัพท์จากภาษาอังกฤษ ซึ่งเป็นการผสมคาระหว่างคา

ว่า Information ที่แปลเป็นภาษาไทยว่าข้อมูล และคาว่า Graphic ที่แปลเป็นภาษาไทยว่าการสร้าง
ภาพให้ปรากฏขึ้น มีความหมายรวม หมายถึง การนาข้อมูลหรือความรู้ มาสรุปเป็นสารสนเทศใน
ลักษณะของข้อมูลและกราฟิก เช่น ลายเส้น สัญลักษณ์ กราฟ แผนภูมิ ไดอะแกรม แผนที่ เป็นต้น
ส่วน ใจทิพย์ ณ สงขลา (2561, หน้า 164) กล่าวว่า อินโฟกราฟิกเป็นข้อมูลหรือสารสนเทศความรู้ที่
นามาแสดงในลักษณะของภาพนิ่งหรือภาพเคลื่อนไหว ทาให้เข้าใจง่ายและรวดเร็วขึ้น ส่วน รัฐพล
ประดับเวทย์ และนิพาดา ไตรรัตน์ (2563) กล่าวว่า อินโฟกราฟิกเป็นการบ่งชี้ถึงข้อมูลในรูปแบบ
“การแปลงข้อมูลให้เป็นภาพ” เพื่อให้เข้าใจได้ง่ายและสื่อสารกับผู้คนด้วยสิ่งที่จับต้องได้ โดยอาศัย
กระบวนการของการสร้างภาพข้อมูลหรือแนวคิดท่ีนาข้อมลู ท่ีซบั ซ้อนไปสู่ผู้รบั สารในลักษณะของการ
แสดงข้อมูลในรูปแบบกราฟิก ด้วยส่วนผสมระหว่าง “ภาพ”และ“ข้อความ” ที่ลงตัว ช่วยเพิ่ม
ประสบการณ์การเข้าถึงข้อมูลได้ง่ายด้วย “Message content” สอดคล้องกับ จุติพงศ์ ภูสุมาศ
(2560, หน้า 2) กล่าวว่า อินโฟกราฟิกเป็นการนาข้อมูลมาสรุปและจัดทาเป็นสื่อกราฟิก โดยจะช่วย
ให้ผู้อ่านเข้าใจเนื้อหามากขึ้น สามารถเปลี่ยนข้อมูลที่ดูยุ่งยาก ซับซ้อนให้เข้าใจง่าย ผ่านภาพกราฟิก
รูปแบบต่างๆ โดยไม่จาเป็นต้องมีใครมาเสนอเพิ่มเติม นอกจากนี้ (Vital, 2018) กล่าวว่า อินโฟ
กราฟิกเป็นการผสมผสานระหวา่ งขอ้ มลู และการออกแบบ โดยขอ้ มลู นั้นเปน็ ทง้ั ตัวเลขและขอ้ เท็จจริง

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

ภาพท่ี 1 แนวความคดิ ของอินโฟกราฟิก
ทม่ี า : https://blog.adioma.com/what-is-an-infographic/

การออกแบบและพัฒนาอินโฟกราฟิก | 3

2. องค์ประกอบของงานอนิ โฟกราฟกิ
การพัฒนาอินโฟกราฟิก ในปัจจุบันมีการพัฒนาอยู่หลายรูปแบบ โดยส่วนใหญ่จะมี

องค์ประกอบทค่ี ลา้ ยกัน (สธุ าพร ล้าเลศิ กุล, 2561, หนา้ 47); (จงรกั เทศนา, 2562, หนา้ 21) ดงั น้ี
1

2

34

ภาพที่ 2 ตัวอยา่ งภาพองคป์ ระกอบของอนิ โฟกราฟกิ
ทีม่ า : http://www.thaihealth.or.th/Infographic

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

2. เนื้อหา เป็นส่วนที่ขยายข้อมูลหลังจากที่ผู้อ่าน อ่านชื่อเรื่อง เนื้อหาส่วนใหญ่จะเป็นการ
แสดงภาพกราฟิก ตัวเลขและตวั หนังสือ

3. แหล่งที่มาของข้อมูล ผู้พัฒนาต้องระบุแหล่งที่มาของข้อมูลที่ปรากฏเพื่อแสดงถึงความ
นา่ เช่ือถือของข้อมลู เชน่ ชอ่ื ผูเ้ ขียน ชื่อหนงั สือ ชื่อเว็บไซต์ หนว่ ยงาน องคก์ รตา่ งๆ เปน็ ตน้

4. ผ้พู ัฒนาหรือผเู้ ผยแพร่ ผพู้ ฒั นาตอ้ งเพ่ิมโลโก้ เว็บไซตห์ รือหน่วยงาน เพือ่ ทผี่ อู้ ่านทราบว่า
ใครเป็นผูจ้ ัดทาและเผยแพร่ ส่วนใหญจ่ ะใสไ่ ว้ในตาแหน่งด้านล่างของงาน ดังภาพท่ี 5-5

4 | การออกแบบคอมพวิ เตอร์กราฟิก

3. ประเภทของอินโฟกราฟกิ
การแบ่งประเภทของอินโฟกราฟิก ครัม (Krum, 2014) และจุติพงศ์ ภูสุมาศ (2560, หน้า

10) ไดอ้ ธบิ ายถึงประเภทของอนิ โฟกราฟิก ดงั น้ี
1. อินโฟกราฟิกแบบภาพนิ่ง (Static Infographics) คือ อินโฟกราฟิกที่เป็นภาพน่ิง

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

2. อินโฟกราฟิกแบบขยายเข้าใกล้ (Zooming Infographics) คือ อินโฟกราฟิก
ท่ีสามารถเพิ่มขนาดของการปฏิสัมพันธ์ให้มีขนาดใหญ่ มีลักษณะเป็นภาพนิ่งออนไลน์และทาให้ผู้ชม
สามารถขยายให้ใกล้มากขึ้นเพื่ออ่านรายละเอียดเพื่อที่ภาพที่ออกแบบนั้นสามารถชมได้ในครั้งเดียว
ของจอภาพและมีการควบคุมการขยายภาพเพอ่ื ทจ่ี ะสามารถชมรายละเอยี ดขนาดเลก็ ได้อย่างชัดเจน
เช่น การแสดงประวัติของรถจักรยานยนต์ตั้งแต่ยุคเริ่มแรกจนถึงปัจจุบัน โดยผู้ชมสามารถคลิก
เพอ่ื ดชู ่วงเวลาในการพัฒนาได้ตามความต้องการ ดังภาพท่ี 5-6

ภาพท่ี 3 อนิ โฟกราฟิกแบบขยายเขา้ ใกล้ประวัติของรถจักรยานยนต์
ทม่ี า : https://historyshots.com/collections/pop-culture/products/motorcycles

การออกแบบและพฒั นาอินโฟกราฟกิ | 5

3. โมชั่นอินโฟกราฟิก (Motion Infographics) คือ อินโฟกราฟิกที่มีการเคลื่อนไหว
ในรปู แบบของวิดีโอ มักถูกใชใ้ นการเล่าเร่ืองหรืออธิบายกลไกต่างๆ ขอ้ ดี คอื ดึงดูดความสนใจ เข้าใจ
ไดง้ า่ ย เชน่ การสร้างโมช่นั อนิ โฟกราฟกิ “รู้ สู้ COVID-19” เพอ่ื ให้ความรู้กับประชาชนในการป้องกัน
การแพรข่ องโรคติดเช้ือไวรสั โคโรนาสายพันธุใ์ หม่ 2019 ดังภาพที่ 5-7

ภาพท่ี 4 โมชนั่ อนิ โฟกราฟิก เรื่อง รสู้ ู้ COVID-19
ท่ีมา : https://www.youtube.com/watch?v=lchEVmOq2_Q

4. อินโฟกราฟิกแบบมีปฏิสัมพันธ์ (Interactive Infographics) คือ อินโฟกราฟิก
ที่มีปฏิสัมพันธ์และเปลี่ยนการแสดงผลได้ตามสิ่งที่ผู้ชมเลือก มักนาไปใช้งานบนเว็บไซต์ ข้อดี คือ
เข้าใจง่าย หากข้อมูลสามารถแบ่งได้หลายกลุ่มหลายรูปแบบ ข้อเสีย คือ ต้องมีความเข้าใจ
ในการพัฒนาหรือการเขียนโปรแกรม และมีข้อจากัดในการแสดงผลบนอุปกรณ์แต่ละชนิด เช่น การ
สรา้ งอินโฟกราฟิกแบบมีปฏิสมั พันธ์ในการคน้ หาบคุ คลช่ือ วอเลซ (Wallace) ดงั ภาพท่ี 5-8

ภาพท่ี 5 อนิ โฟกราฟกิ แบบมปี ฏิสมั พนั ธใ์ นการคน้ หาบุคคลชือ่ วอเลซ
ท่มี า : http://whereswallace.theringer.com/

6 | การออกแบบคอมพวิ เตอร์กราฟิก

4. ขนาดของอนิ โฟกราฟกิ
การกาหนดขนาดของอินโฟกราฟิกนั้นขึ้นอยู่กับหน้าจอแสดงผล ซึ่งจะมีขนาดและความ

เหมาะสมทแี่ ตกตา่ งกัน (จุตพิ งศ์ ภสู มุ าศ, 2560, หนา้ 97) สามารถสรุปหนา้ จอแสดงผล ดงั น้ี
1. หน้าจอสมาร์ทโฟน สมาร์ทโฟนเป็นอุปกรณ์ที่ถูกใช้ในเข้าถึงอินเทอร์เน็ตและโซเชียล

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

ภาพที่ 6 ขนาดหนา้ จอสมาร์ทโฟน
ที่มา https://gs.statcounter.com/screen-resolution-stats/desktop/worldwide/2020

2. หน้าจอคอมพิวเตอร์ พฤติกรรมของผู้ใช้งานหน้าจอคอมพิวเตอร์มีความแตกต่างจาก
สมาร์ทโฟน เนื่องจากการใชง้ านคอมพิวเตอรม์ กั คงที่ ระยะห่างระหวา่ งสายตากับหนา้ จอค่อนข้างคงท่ี
และการซูมเข้าไปดูเนื้อหาทาได้ยากกว่าการใช้สมาร์ทโฟนหรือแท็บเล็ต แต่มีข้อได้เปรียบด้านขนาด
ของหน้าจอทใี่ หญ่ มพี น้ื ทใ่ี ชง้ านมากกว่า ดังน้นั การออกแบบอินโฟกราฟิกสาหรบั แสดงผลบนหน้าจอ
คอมพิวเตอร์มักเป็นแนวนอน ระบบสี RGB อัตราส่วน 16 : 9 สาหรับการแสดงผลเต็มหน้าจอบนจอ

การออกแบบและพฒั นาอินโฟกราฟกิ | 7

แบบ Wide Screen ซึ่งเป็นมาตรฐานหน้าจอในปัจจุบันและอัตราส่วน 4 : 3 สาหรับการแสดงผล
เต็มหน้าจอบนจอแบบดง้ั เดิม

ภาพท่ี 7 ขนาดหนา้ จอคอมพิวเตอร์
ทมี่ า : https://www.rtings.com/monitor/tests/inputs/resolution-size

3. เว็บไซต์ อินโฟกราฟิกบนเว็บไซต์สามารถเข้าถึงผ่านหน้าจอคอมพิวเตอร์และสมาร์ทโฟน
มีจุดเด่น คือ ความยาวที่ไม่จากัด ผู้ชมสามารถใช้นิ้วหรือเลื่อนเมาส์เพื่อดูอินโฟกราฟิกทั้งหมดได้
ดังนั้นอินโฟกราฟิกสาหรับเว็บไชต์นี้จะมีความกว้างคงที่ไม่จากัดความยาวเว็บไชต์ Benjamintravis
(2562) ได้สรุปข้อเท็จจรงิ 5 ประการเก่ยี วกบั อินโฟกราฟิกสาหรับเวบ็ ไซต์ ดงั น้ี

1. 81% ของอนิ โฟกราฟิกสาหรบั เว็บไชต์นั้นอยู่ในแนวตงั้
2. อินโฟกราฟกิ บนเวบ็ ไชต์แนวตัง้ สว่ นใหญม่ ีความกว้างอยูใ่ นช่วง 600 ถึง 1,100 พกิ เชล
3. 22% ของอินโฟกราฟกิ สาหรบั เว็บไซต์มคี วามยาวเกนิ 5,000 พกิ เชล
4. อัตราสว่ นความกวา้ งต่อความยาวของอนิ โฟกราฟิกมักเท่ากับ 1 : 4
5. อนิ โฟกราฟกิ สาหรับเว็บไซต์ไมไ่ ด้มีการกาหนดมาตรฐานตายตวั

4. สิ่งพิมพ์ อินโฟกราฟิกสาหรับสิ่งพิมพ์ ส่วนใหญ่จะมีขนาดตามมาตรฐานกระดาษ เช่น
A4 B3 C3 โดยมีความละเอียดไม่ต่ากว่า 300 dpi และใช้ระบบสี CMYK สามารถออกแบบได้ท้ัง
แนวตั้งและแนวนอนและจะมสี ่วนของค่าจัดพมิ พ์ท่ีต้องนามาพจิ ารณาประกอบทั้งในส่วนของกระดาษ
และสีที่ใช้ในการพิมพ์ ซึ่งการพิมพ์แบบสี่สีจะมีค่าใช้จ่ายที่สูงกว่าการพิมพ์แบบขาวดา ดังนั้นต้อง
ประเมินสมดลุ ระหวา่ งคุณภาพและราคาใหเ้ หมาะสมกอ่ นเริ่มดาเนินการ

8 | การออกแบบคอมพิวเตอร์กราฟิก

5. รูปแบบของอนิ โฟกราฟกิ

การกาหนดรูปแบบหรือเลย์เอาท์ (Layout) โครงสร้างของอินโฟกราฟิก เป็นส่วนที่ผู้พัฒนา
ต้องพิจารณาเป็นอันดับแรก เนื่องจากรูปแบบนั้นจะเหมาะสมกับข้อมูลแต่ละประเภทแตกต่างกันไป
(บริษัทอินโฟกราฟิกไทยแลนด์, 2557) (จุติพงศ์ ภูสุมาศ, 2560, หน้า 104) (ถนอมพร (ตันพิพัฒน์)
เลาหจรสั แสง, 2561, หน้า 137) ไดก้ าหนดเปน็ 9 รูปแบบ ไดแ้ ก่

1. รูปแบบแสดงข้อมูลแบบบทความ (Visualized Article)
เป็นรูปแบบที่เหมาะสาหรับการทาอินโฟกราฟิกแบบเรื่องเล่า บทความหรือ
เนื้อหาเชิงบรรยาย โดยต้องการสรุปเนื้อหาและเลือกประเด็นก่อนจะแปลง
เปน็ ภาพที่เขา้ ใจไดโ้ ดยง่าย

2. รูปแบบแสดงข้อมูลแบบมีหัวข้อย่อย (Listed) เป็นรูปแบบ
ที่เหมาะสาหรับการอธิบายเนื้อหาที่มีหัวข้อหลักเพียงหัวข้อเดียวและมีหัวข้อ
ย่อยหลายหัวข้อ ซึ่งเนื้อหาในแต่ละหัวข้อจะไม่ยาวมากนักและเข้าใจได้ง่าย
ผู้พัฒนาควรเลือกหัวข้อย่อยที่สาคัญๆ ซึ่งอาจรวมหัวข้อที่ใกล้เคียงกัน
เข้าดว้ ยกนั เพือ่ ป้องกันไม่ใหจ้ านวนหัวข้อย่อยมากจนเกินไป

3. รูปแบบเปรียบเทียบข้อมูล (Comparison) เป็นรูปแบบที่ใช้
การเปรียบเทียบของสิ่งหนึ่งกับสิง่ อื่น ส่วนมากมักมีการนาเสนอคู่กันช้ายขวา
และมีการออกแบบที่คล้ายกัน หัวข้อเปรียบเทียบอยู่ในระดับสายตาเดียวกัน
แบ่งแยกแต่ละสิ่งด้วยการใช้เส้นหรือสี เพื่อให้ผู้ชมสามารถกวาดสายตา
เปรียบเทยี บได้อยา่ งรวดเรว็

4. รูปแบบอธิบายส่วนประกอบ (Structure) เป็นรูปแบบที่ใช้
ในการอธิบายส่วนประกอบของสิ่งใดๆ เพื่อขยายรายละเอียดในแต่ละส่วน
ให้เห็นชัดเจนยิ่งขึ้น โดยอาจเป็นได้ทั้งการสแกนเข้าไปดูภายในหรือแยก
แตล่ ะส่วนใหข้ าดออกจากกนั

การออกแบบและพฒั นาอินโฟกราฟิก | 9

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

6. รูปแบบอธิบายล าดับขั้นตอน (Flowchart) เป็นรูปแบบ
การนาเสนอที่สามารถแตกแขนงออกไปหรือยุบรวมได้ตามการตัดสินใจเลือก
ของผู้ชม ซึ่งจะสามารถกระตุ้นให้ผู้ชมมีส่วนร่วมในการตัดสินใจไปได้เรื่อยๆ
จนสิ้นสุดที่คาตอบใดคาตอบหนึ่ง ซึ่งอาจเลือกใช้สีหรือลักษณะของเส้น
ทีแ่ ตกต่างกนั

7. รูปแบบอธิบายขั้นตอนการทางาน (Road Map) เป็นรูปแบบ
ที่เหมาะสาหรับการอธิบายกระบวนการ มีลักษณะคล้ายรูปแบบแสดงข้อมูล
ตามลาดับเวลา แต่มีการลงรายละเอียดมากกว่าเพื่อให้ผู้ชมอ่านและเข้าใจ
ได้ทันทแี ละบางครง้ั ขอ้ มลู ทแ่ี สดงอาจไมเ่ ป็นไปตามลาดบั เวลา

8. รูปแบบอธิบายวิธีการทา (Useful Bait) เป็นรูปแบบที่แสดง
ให้เห็นวิธีทาบางสิ่งบางอย่าง โดยที่ผู้ชมเห็นแล้วสามารถนาไปใช้ได้โดยทันที
ให้ความสาคญั กบั การอา่ นและเข้าใจงา่ ยมากกว่าความสวยงาม

9. รูปแบบแสดงข้อมูลที่เป็นตัวเลข (Number Illustrator)
เป็นรูปแบบที่เหมาะสาหรับการแสดงข้อมูลเชิงตัวเลขจานวนมาก โดยใช้
แผนภมู ใิ นการแสดงขอ้ มลู รูปแบบลกั ษณะนี้ไม่ไดห้ มายถงึ การมีขอ้ มูลตัวเลข
จานวนมากเพียงอย่างเดียว ตัวเลขดังกล่าวต้องมีความสาคัญ น่าสนใจและ
มีความหมายสาหรบั ผชู้ ม

ภาพท่ี 8 รูปแบบหรอื เลย์เอาทโ์ ครงสร้างของอนิ โฟกราฟกิ
ทมี่ า : http://infographic.in.th/infographic/ออกแบบ-infographic-ดว้ ย-9-layout

10 | การออกแบบคอมพิวเตอร์กราฟิก

6. ขนั้ ตอนการพั ฒนาอนิ โฟกราฟกิ

จุติพงศ์ ภูสุมาศ (2560, หน้า 38) ได้กาหนดขั้นตอนการสร้างอินโฟกราฟิกไว้ 10 ขั้นตอน
ซึ่งแต่ละขั้นตอนจะเกี่ยวข้องกับ 3 ตาแหน่ง คือ บรรณาธิการ (Editor) นักวิเคราะห์ข้อมูล (Data
Analysis) และนักออกแบบ (Designer) แตล่ ะขน้ั ตอนมีวิธกี ารดงั นี้

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

2. สารวจและวิจัย (บรรณาธิการ) เป็นการสารวจว่ามีข้อมูลใดบ้างที่สัมพันธ์กับหัวข้อ
ดังกล่าว การกาหนดขอบเขตของการสารวจและวิจัยจะชว่ ยให้เหน็ ภาพรวมขอ้ มูลและรู้ว่าจะหาข้อมูล
จากแหลง่ ใดได้บ้างชว่ ยให้ประหยดั เวลาและลดต้นทุนในการทาอนิ โฟกราฟิก

3. รวบรวมและประเมินความน่าเชื่อถือของข้อมูล (บรรณาธิการ นักวิเคราะห์ข้อมูล)
เป็นการรวบรวมและประเมนิ ความนา่ เช่อื ถือของข้อมูล

4. วิเคราะห์ข้อมูล (บรรณาธิการ นักวิเคราะห์ข้อมูล) ข้อมูลที่ได้มาจากขั้นตอนที่สาม
บางครั้งยังเป็นข้อมูลดิบที่ยังไม่ได้ผ่านการกรองและวิเคราะห์ข้อมูล การวิเคราะห์ข้อมูลจึงเป็นสิ่ง
ทจ่ี าเปน็ ในการสกัดขอ้ มูลทีเ่ ปน็ ประโยชนใ์ ห้สามารถนาไปใชง้ านต่อได้ง่ายข้อมูลทวั่ ไป

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

การออกแบบและพัฒนาอนิ โฟกราฟิก | 11

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

7. ปรับแต่ง (บรรณาธิการ นักวิเคราะห์ข้อมูล นักออกแบบ) เป็นการปรับแต่งรูปแบบ
ซึ่งต้องประชุมร่วมกนั ระหว่างบรรณาธิการ นักวิเคราะห์ข้อมูลและนักออกแบบ ซึ่งบางคร้ังอาจพบว่า
ข้อมูลยังมีขาดหรือเกินอยู่ จึงจาเป็นต้องหาข้อมูลเพิ่มหรือตัดข้อมูลที่ไม่เกี่ยวข้องออกไปก่อน
จะออกแบบอนิ โฟกราฟกิ จริง

8. ออกแบบอินโฟกราฟิก (นักออกแบบ) เป็นการออกแบบอินโฟกราฟิกตามสไตล์และชุดสี
ท่ีกาหนดเอาไว้ การกาหนดขนาดและความละเอียดของอินโฟกราฟิกขน้ึ อยู่กับจุดประสงค์ว่าต้องการ
นาเสนอทใ่ี ด เช่น บนส่งิ พิมพ์ บนเวบ็ ไซต์ เปน็ ต้น

(ก) รา่ งไอเดยี อินโฟกราฟกิ (ข) อินโฟกราฟกิ ที่ออกแบบเสรจ็ แล้ว

ภาพที่ 9 อินโฟกราฟิก เรือ่ ง ดมื่ น้าตอนไหน..ดที ส่ี ุด

ที่มา : ผลงานของ ปภัสสร ก๋าเขยี ว

12 | การออกแบบคอมพวิ เตอรก์ ราฟิก

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

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

7. การสร้างอนิ โฟกราฟกิ ใหม้ ีประสทิ ธภิ าพ

อนิ โฟกราฟิกเปน็ ทน่ี ิยมแพรห่ ลายในปัจจุบันเพราะสามารถถ่ายทอดข้อมูลโดยท่ีไม่มีขอบเขต
และขีดจากัดในการเล่าเรื่องผ่านภาพ การสร้างอินโฟกราฟิกให้มีประสิทธิภาพ จงรัก เทศนา (2562)
ไดส้ รปุ วิธีการสร้างอนิ โฟกราฟิกใหม้ ีประสิทธิภาพ ดงั น้ี

1. เน้นที่หัวข้อหลักหัวข้อเดียว หัวข้อหลักในการสร้างอินโฟกราฟิก ควรตอบคาถามเดียว
งานจะชดั เจนถ้ารูท้ ิศทางของสิ่งท่จี ะทา จะขจัดความย่งุ ยากสาหรับผูช้ ม

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

3. ข้อมูลเป็นสิ่งสาคัญ การสร้างอินโฟกราฟิกต้องคานึงถึงข้อมูลที่เกี่ยวกับหัวข้อเปน็ สาคญั
การออกแบบตอ้ งไม่ทาเกนิ ขอบเขตของหัวข้อ

4. เป็นข้อเท็จจริง การทาข้อมูลให้ถูกต้องเป็นสิง่ สาคญั หากไม่ถูกต้องจะลดความน่าเช่ือถือ
ของอนิ โฟกราฟิก ดงั นั้นกอ่ นทีจ่ ะสร้างอนิ โฟกราฟิกต้องแน่ใจว่าข้อมลู ถูกต้อง

5. ให้อินโฟกราฟกิ เป็นตัวเล่าเรอื่ ง สามารถเล่าเรอื่ งราวดว้ ยภาพวาดหรือกราฟิก ซ่ึงสามารถ
บอกบางสิง่ บางอย่างและสามารถถ่ายทอดข้อมลู ได้ ถึงแม้วา่ ผ้ชู มจะไม่ได้อ่านข้อมูลมาก่อน

6. การออกแบบที่ดีทาให้มีประสิทธิภาพ การบรรยายด้วยภาพถ้ามีการออกแบบที่ดี
จะดงึ ดดู ใจผูช้ ม ตอ้ งใช้ความคดิ สรา้ งสรรคอ์ อกแบบใหน้ ่าสนใจทัง้ ภาพ กราฟิก สี ชนดิ และช่องวา่ ง

การออกแบบและพฒั นาอินโฟกราฟิก | 13

7. ใช้สีที่ดึงดูดความสนใจ ควรเลือกใช้สีที่กระตุ้นดึงดูดความสนใจผู้ชม ผู้พัฒนาควรศึกษา
ทฤษฎีการใชส้ ใี หถ้ ูกตอ้ งเหมาะสม อนิ โฟกราฟิกบางช้ินมสี เี พยี งเลก็ นอ้ ยก็มีประสทิ ธภิ าพได้

8. ใช้คาพูดที่กระชับ การออกแบบจาเป็นต้องสรุปข้อความให้สั้นกระชับตรงกับจุดหมาย
ท่ตี อ้ งการนาเสนออาจใช้แผ่นป้ายหรอื ขอ้ มลู สนั้ ๆ มาสนบั สนุน

9. ตรวจสอบตัวเลขข้อมูล ถ้านาเสนอข้อมูลด้วยตัวเลขผ่านกราฟและแผนผัง ตรวจสอบ
ความถูกตอ้ งของตัวเลขและภาพวาดและผู้พฒั นาต้องเขา้ ใจว่าตัวเลขไหนควรใชแ้ ละไม่ควรใช้งาน

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

8. เครอื่ งมือทใี่ ช้ในการพั ฒนาอนิ โฟกราฟกิ

เคร่ืองมือที่ใช้ในการจัดทาอินโฟกราฟิก คือ เคร่ืองมือที่สามารถพัฒนาอินโฟกราฟิก
ในรูปแบบภาพนิ่งและภาพเคลื่อนไหว ฝ่ายตาราวิชาการคอมพิวเตอร์ (2557, หน้า 24) ได้แบ่ง
ประเภทซอฟตแ์ วรส์ าหรับงานอินโฟกราฟิก ออกเปน็ 4 ประเภท ดงั ต่อไปนี้

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

2. ซอฟตแ์ วร์แก้ไขภาพ เป็นซอฟตแ์ วร์ทสี่ ามารถสร้างผลงานอินโฟกราฟิกในรปู แบบภาพนิ่ง
เป็นได้ทั้งโปรแกรม Painting หรือ Drawing ถูกพัฒนาและออกแบบมาเป็นพิเศษ เพื่อใช้ในการ
ตกแตง่ หรอื รีทัชภาพ การปรบั ความคมชัด ความสว่าง การกาจดั ตาแดงบนภาพถา่ ย การปรบั ภาพการ

14 | การออกแบบคอมพิวเตอร์กราฟิก

ขยายหรอื ยอ่ สว่ นภาพรวมถงึ การใช้ฟลิ เตอร์ และการใช้เทคนิคพิเศษเพ่ิมเติมต่างๆ ตวั อย่างซอฟต์แวร์
เชน่ Adobe Photoshop Adobe InDesign Inkscape GIMP เปน็ ต้น

3. ซอฟต์แวร์แก้ไขวิดีโอ เป็นซอฟต์แวรท์ ี่สามารถสร้างผลงานอินโฟกราฟิกในรูปแบบโมช่ัน
อินโฟกราฟิก โดยข้อมูลได้ทั้งภาพพนิ่ง ภาพเคลื่อนไหว ข้อความ เสียง เอฟเฟกต์ ต่างๆ ตัวอย่าง
ซอฟตแ์ วร์ เช่น Adobe After Effect Adobe Flash เปน็ ต้น

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

เครอ่ื งมือสร้างอนิ โฟกราฟิก เชน่
➢ https://www.canva.com
➢ https://infograpia.com
➢ https://www.easel.ly
➢ https://infogram.com
➢ https://piktochart.com
➢ https://venngage.com

เครอื่ งมือสร้างโมชน่ั กราฟิก เชน่
➢ https://www.powntoon.com
➢ https://www.animaker.com/
➢ https://crello.com/
➢ https://biteable.com/
➢ https://www.toonboom.com/

การออกแบบและพัฒนาอินโฟกราฟกิ | 15

9. ประโยชน์ของอนิ โฟกราฟกิ

อินโฟกราฟิกเป็นวิธีการนาเสนอข้อมูลที่ชัดเจนและทันต่อเหตกุ ารณ์ในโลกปัจจุบัน (จุติพงศ์
ภูสุมาศ (2560, หน้า 25) และ ณิชมน หิรัญพฤกษ์ (2558, หน้า 27) ได้สรุปประโยชน์ของอินโฟ
กราฟกิ ไดด้ ังน้ี

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

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

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

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

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

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

16 | การออกแบบคอมพวิ เตอร์กราฟิก

10. ข้อมูลพ้ื นฐานเวบ็ ไซต์แคนวา

แคนวาเป็นเว็บไซต์และแอปพลิเคชั่นด้านกราฟิกดีไซน์ ในปี ค.ศ. 2007 เมลานี เพอร์กินส์
(Melanie Perkins) เป็นนักศึกษาจาก University of Western Australia ที่มีความสนใจศิลปะและ
การใช้โปรแกรมออกแบบ เช่น Adobe InDesign และ Adobe Photoshop โดยเธอพบว่าโปรแกรม
เหล่านี้มีประโยชน์ในการสร้างสรรค์งานศิลปะอย่างมาก แต่ในขณะเดียวกันก็เรียนรู้ที่จะใช้งานให้
ชานาญไดย้ ากเช่นกัน ทาใหท้ ้งั การเรยี นรูแ้ ละการสอนโปรแกรมเหล่าน้เี ป็นเร่ืองน่าเบอื่ จึงเกิดไอเดียที่
จะสร้างแพลทฟอร์มที่คนสามาถเข้ามาออกแบบและสั่งพิมพ์ผลงานง่ายๆ ซึ่งแคนวาก่อตั้งอย่างเป็น
ทางการเมื่อวันท่ี 1 มกราคม ค.ศ.2012 และได้รับความนยิ มการใช้งานอยา่ งแพรห่ ลายท้ังโลก

จดุ เดน่ ของเวบ็ ไซตแ์ คนวา
1. มแี มแ่ บบ (Template) งานกราฟิกรปู แบบต่างๆ ที่กาหนดขนาดเปน็ มาตรฐานเอาไว้

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

2. สาหรับผู้ใช้งานที่ไม่มีพื้นฐานในการใช้ซอฟต์แวร์ด้านกราฟิก เช่น Adobe
Photoshop Adobe Illustrator สามารถใชง้ านไดง้ ่ายเพียงเลอื กวัตถแุ ล้วลาก วางและแกไ้ ขงานได้

3. มีระบบบันทึกภาพอัตโนมัติ เมื่อเกิดเหตุฉุกเฉิน เช่น ไฟดับ อินเทอร์เน็ตขาดการ
เช่อื มตอ่ เว็บไซตจ์ ะบันทกึ งานบนระบบคลาวด์ของเวบ็ ไซต์ให้ทุกครัง้ ท่ีหยดุ คลกิ เมาส์

4. สามารถแชรผ์ ลงานได้หลายรูปแบบและสะดวกตอ่ การแชร์
5. สามารถสร้างทีมงานในการพัฒนางานกราฟกิ ซงึ่ สามารถทางานได้พรอ้ มกัน
6. สามารถใช้งานผา่ นสมาร์ทโฟนทีใ่ ช้ระบบปฏบิ ัติการแอนดรอยด์หรือระบบปฏิบัติการ
ไอโอเอส ผา่ นแอปพลิเคชนั แคนวา
7. สถาบันการศึกษาสามารถใช้งานแคนวาเพือ่ การศึกษา ซึ่งจะไม่เสียค่าใช้จ่ายในการ
ใชง้ าน สมัครโดยใช้อเี มลของสถาบนั
8. มีเครื่องมือในการช่วยให้ผู้ใช้งานออกแบบสี ให้เหมาะสมกับเนื้อหาหรือความ
ต้องการได้ เช่น การเลือกพาเลตของสี วงล้อสี สามารถทดลองใช้งานได้ที่เว็บไซต์
https://www.canva.com/colors

การออกแบบและพัฒนาอนิ โฟกราฟิก | 17

ภาพที่ 10 เคร่ืองมอื ช่วยการออกแบบสขี องเว็บไซตแ์ คนวา
ที่มา : เอกสารประกอบการฝึกอบรมครสู ังกัดสานกั งานศึกษาธกิ าร จงั หวดั ลาปาง โดย สมชาย เมอื งมลู

18 | การออกแบบคอมพิวเตอร์กราฟิก

11. การสมัครใช้งาน
1. ไปที่เวบ็ ไซต์ https://www.canva.com ผู้ใชส้ ามารถสมคั รใชง้ านดว้ ยบัญชผี ู้ใช้

Facebook, G-mail หรอื สมคั รด้วยอีเมลขององค์กร

2.เลอื กอเี มล Gmail

1.สมัครด้วย Google Gmail

เลอื กการใชง้ านเป็น Teacher

ภาพที่ 11 หนา้ จอการสมัครใชง้ านเวบ็ ไซตแ์ คนวา
ทมี่ า : เอกสารประกอบการฝกึ อบรมครูสังกัดสานักงานศกึ ษาธกิ าร จงั หวดั ลาปาง โดย สมชาย เมืองมลู

การออกแบบและพัฒนาอนิ โฟกราฟกิ | 19

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

ส่วนที่ 1
สว่ นท่ี 2

สว่ นท่ี 3

ภาพที่ 12 สว่ นประกอบหลกั ของหน้าจอหลกั ของเว็บไซตแ์ คนวา
ทม่ี า : เอกสารประกอบการฝกึ อบรมครสู ังกัดสานักงานศึกษาธกิ าร จังหวดั ลาปาง โดย สมชาย เมอื งมลู
ส่วนที่ 1 ประกอบดว้ ย เมนูราคา เมนูแม่แบบ เมนูค้นหา
สว่ นที่ 2 ประกอบดว้ ย เมนกู ารตง้ั คา่ การใชง้ าน เมนกู ารสรา้ งผลงาน เมนผู ใู้ ช้
สว่ นท่ี 3 ประกอบดว้ ย

1. เมนูแนะนารูปแบบผลงานสาหรบั ผู้ใช้
2. เมนทู เี่ ก็บผลงานอกแบบทัง้ หมดของผูใ้ ช้
3. เมนทู จ่ี ัดเกบ็ โลโก้ของผใู้ ช้
4. เมนูการสร้างทีมงานในการพฒั นาผลงาน
5. เมนูโฟลเดอร์ของผู้ใช้
6. เมนทู เ่ี ก็บผลงานที่ถูกลบ

20 | การออกแบบคอมพิวเตอร์กราฟิก

13. สว่ นประกอบของหน้าจอสร้างผลงาน

หลังจากท่ผี ู้ใช้งานสร้างผลงาน จะปรากฏหน้าจอสร้างผลงาน ดังน้ี

ส่วนท่ี 1 สว่ นท่ี 2

ส่วนที่ 3 ส่วนท่ี 4

ภาพท่ี 13 ส่วนประกอบหลักของหน้าจอสร้างผลงาน
ทม่ี า : เอกสารประกอบการฝกึ อบรมครูสงั กดั สานักงานศกึ ษาธกิ าร จงั หวัดลาปาง โดย สมชาย เมืองมลู

ส่วนที่ 1 เมนพู น้ื ฐาน ประกอบดว้ ย
1. เมนูหน้าหลกั เป็นเมนูท่ีกลับเข้าสูห่ นา้ หลกั การทางาน
2. เมนไู ฟล์ เป็นเมนูจัดการข้อมูลพ้นื ฐาน เช่น สร้างผลงานใหม่ การดาวนโ์ หลด เปน็ ตน้
3. เมนปู รบั ขนาด เป็นเมนูปรบั ขนาดผลงานให้ใหญข่ นึ้ (ใชไ้ ด้กับระดับพรเี ม่ียมเท่านั้น)
4. เมนเู ลิกทา เป็นเมนูย้อนกลับการทางานไปทีละขั้นตอนเพอ่ื ย้อนงานที่ทาผิดพลาด

ส่วนที่ 2 เมนพู น้ื ฐาน ประกอบด้วย
1. งานออกแบบทไี่ ม่มีชื่อ เปน็ เมนูสาหรับต้ังช่ือผลงาน
2. เมนูลองแคนวาพรเี ม่ียม เปน็ เมนใู ห้ผู้ใช้ไดท้ ดลองใช้แคนวาพรเี มยี่ ม ระยะเวลา 30 วนั
3. เมนูแชร์ เป็นเมนูแชร์ผลงาน ไปยัง Facebook, twitter หรอื ส่งทางอเี มล
4. เมนูดาวน์โหลด เป็นการสง่ ออกผลงานได้หลายรูปแบบ เชน่ รปู ภาพ วิดีโอ PDF เปน็ ต้น

การออกแบบและพัฒนาอินโฟกราฟกิ | 21

สว่ นที่ 3 เมนกู ารทางานหลกั ประกอบด้วย
1. เมนูแม่แบบ เป็นเมนูเลือกรูปแบบผลงาน โดยผู้ใช้สามารถสร้างรูปแบบหรือดัดแปลงจาก

รูปแบบที่เลอื กได้
2. เมนูอัปโหลด เป็นเมนูอัปโหลดรูปภาพจากคอมพิวเตอร์หรือคัดลอกลิงค์จากเว็บไซต์

สอื่ สังคมออนไลน์ แล้วนามาเพมิ่ ในผลงานได้
3. เมนภู าพถา่ ย เปน็ เมนทู ร่ี วบรวมภาพถา่ ย ผใู้ ช้สามารถค้นหาแลว้ คลกิ เลอื กเพ่อื ใช้งาน
4. เมนอู งค์ประกอบ เป็นเมนูเพิม่ ภาพกราฟิก ไอคอน สญั ลักษณ์ตา่ งๆ เพอ่ื ประกอบผลงาน

(ก) หนา้ จอเมนแู มแ่ บบ (ข) หน้าจอเมนูอปั โหลด

(ค) หนา้ จอเมนภู าพถ่าย (ง) หน้าจอเมนูภาพองค์ประกอบ

ภาพท่ี 14 หน้าจอเมนกู ารทางานหลกั

ทม่ี า : เอกสารประกอบการฝกึ อบรมครูสังกดั สานกั งานศึกษาธกิ าร จงั หวัดลาปาง โดย สมชาย เมืองมลู

22 | การออกแบบคอมพวิ เตอร์กราฟิก

5. ขอ้ ความ เป็นเมนูเพ่ิมขอ้ ความ โดยมีรปู แบบให้เลอื กหลากหลาย สามารถคัดลอกข้อความ
จาก Microsoft Office เพอื่ วางในผลงานได้

6. วดิ ีโอ เปน็ เมนทู ี่รวบรวมวิดโี อแบบสั้นๆ ผู้ใช้สามารถ คน้ หาแล้วคลกิ เลอื กเพอื่ ใช้งาน
7. พื้นหลัง เป็นเมนูเลือกภาพพื้นหลัง ผู้ใช้สามารถเลือกพื้นหลังแบบสีเดียว หรือพื้นหลัง
ท่ีเปน็ ภาพถ่าย ภาพกราฟิก
8. โฟลเดอร์ เป็นเมนูจัดการบันทึกงานให้อยู่ในโฟลเดอร์เพื่อความสะดวกต่อการจัดการ
ผลงาน

(ก) หน้าจอเมนูขอ้ ความ (ข) หนา้ จอเมนวู ดิ ีโอ

(ค) หน้าจอเมนูพน้ื หลัง (ง) หนา้ จอเมนโู ฟลเดอร์

ภาพที่ 15 หนา้ จอเมนูการทางานหลกั

ทีม่ า : เอกสารประกอบการฝึกอบรมครูสงั กดั สานักงานศกึ ษาธกิ าร จงั หวัดลาปาง โดย สมชาย เมืองมลู

การออกแบบและพฒั นาอินโฟกราฟิก | 23

ส่วนที่ 4 พ้ืนทกี่ ารทางาน ประกอบดว้ ย
เปน็ ขอบเขตของพืน้ ทีก่ ารทางาน ตามขนาดท่ผี ูใ้ ชก้ าหนดหรือตามแมแ่ บบทีเ่ ลือก

ภาพที่ 16 หน้าจอพ้นื ทก่ี ารทางาน
ท่ีมา : เอกสารประกอบการฝึกอบรมครูสงั กดั สานักงานศึกษาธกิ าร จงั หวัดลาปาง โดย สมชาย เมืองมลู

ปุ่มเพม่ิ หมายเหตุของหน้าผลงานน้นั ๆ
เปน็ ปุ่มทาซ้าหน้าผลงาน
ปุ่มสร้างหน้าใหม่
ปุ่มเลื่อนหน้าผลงาน
ปุ่มลบหนา้ ผลงาน
ปุ่มสรา้ งหน้าใหม่

24 | การออกแบบคอมพวิ เตอรก์ ราฟิก

14. การสรา้ งอินโฟกราฟกิ
การสร้างอินโฟกราฟิกจากเว็บไซต์แคนวา สามารถสร้างได้ตามความต้องการของผู้สรา้ งหรือ

กลมุ่ เป้าหมายในการเผยแพร่ ดังน้ี
1. การสร้างอนิ โฟกราฟิกดว้ ยแม่แบบโปสเตอร์ (แนวนอน)
เปน็ การสร้างอินโฟกราฟกิ ด้วยแมแ่ บบโปสเตอร์ ซ่งึ จะมีขนาดท่ีเหมาะสาหรับการเผยแพร่

ในรปู แบบส่งิ พิมพ์ มขี ั้นตอนการสร้าง ดงั น้ี
ขั้นตอนที่ 1 คลิก สร้างงานออกแบบ (1) จากแผงด้านข้างของเครื่องมือแก้ไข เลือก

ขนาดผลงาน สามารถเลือกได้ 2 รูปแบบ คือ 1. ขนาดที่กาหนดเอง 2. ขนาดที่แคนวา กาหนดให้
อัตโนมตั ิ เลอื กโปสเตอร์ (2)

1. เลอื กสรา้ งงานออกแบบ

2. เลือกโปสเตอร์

ภาพท่ี 17 หนา้ จอการสรา้ งงานในรูปแบบของแม่แบบอินโฟกราฟิก
ที่มา : เอกสารประกอบการฝึกอบรมครสู ังกดั สานักงานศึกษาธกิ าร จงั หวดั ลาปาง โดย สมชาย เมืองมลู

ข้นั ตอนท่ี 2 จะปรากฏหนา้ จอการสร้างผลงาน ให้ผใู้ ช้ตั้งชื่อผลงานท่ี งานออกแบบที่ไม่มี
ชอ่ื ให้คลิกแล้วพิมพ์ชือ่ ผลงานท่ีตอ้ งการ

ตัง้ ชื่อผลงาน

การออกแบบและพัฒนาอินโฟกราฟกิ | 25

ขนั้ ตอนที่ 3 ให้ผใู้ ช้เลือกแม่แบบผลงาน โดยสามารถเลอื กได้ 2 รูแปบบ คอื
1. แม่แบบเปลา่ เป็นแม่แบบทีม่ ีแตพ่ น้ื หลงั สขี าว ไม่มีข้อความหรือภาพกราฟิก
2. แมแ่ บบที่แคนวาออกแบบ คลิกจากแม่แบบทแ่ี นะนาหรอื คลิกช่อง ค้นหาแม่แบบ

1.เลอื กแม่แบบผลงาน

2.เลือกแม่แบบ ฟรี

ภาพที่ 18 หน้าจอการเลอื กแมแ่ บบฟรี
ทม่ี า : เอกสารประกอบการฝกึ อบรมครูสังกัดสานักงานศึกษาธกิ าร จงั หวดั ลาปาง โดย สมชาย เมอื งมูล

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

พ้นื ทกี่ ารทางาน

ภาพท่ี 19 หน้าจอพื้นท่ีการทางานทส่ี ร้างดว้ ยแมแ่ บบ
ที่มา : เอกสารประกอบการฝึกอบรมครสู ังกัดสานักงานศกึ ษาธกิ าร จงั หวดั ลาปาง โดย สมชาย เมอื งมูล

26 | การออกแบบคอมพวิ เตอร์กราฟิก

ขั้นตอนที่ 5 หากผู้ใช้ต้องการสร้างผลงานให้มีหลายหน้าและมีขนาดเท่ากัน อยู่ในไฟล์
เดียวกัน คลิก + เพ่มิ หน้าใหม่ หรอื คลกิ สญั ลกั ษณท์ าสาเนาเพ่อื ทาสาเนาหน้าผลงาน

คลิกเพื่อสาเนาหน้า
ผลงาน

คลิกเพอ่ื เพ่ิมหนา้ ผลงาน
ภาพที่ 20 หน้าจอพื้นที่การทางาน
ทมี่ า : เอกสารประกอบการฝึกอบรมครสู ังกัดสานักงานศกึ ษาธกิ าร จังหวดั ลาปาง โดย สมชาย เมอื งมูล

ขัน้ ตอนที่ 6 การเพ่ิมรปู ภาพใหก้ บั ผลงาน สามารถทาได้ 2 รปู แบบ ดังน้ี
1. อัปโหลดจากคอมพิวเตอร์ คลิกเมนูอัปโหลด (1) คลิกปุ่มอัปโหลดรูปภาพหรือวิดีโอ
(2) เลือกแหล่งที่มาของภาพ ได้แก่ อุปกรณ์ (คอมพิวเตอร์ของผู้ใช้) Facebook Google Drive
Instagram Dropbox

2.เลือกอัปโหลดรปู ภาพ

1.เลือกเมนูอัปโหลด

ภาพที่ 21 การเพ่ิมรปู ภาพใหก้ บั ผลงานด้วยภาพถา่ ยในคอมพวิ เตอร์
ทมี่ า : เอกสารประกอบการฝึกอบรมครูสังกดั สานกั งานศกึ ษาธกิ าร จงั หวดั ลาปาง โดย สมชาย เมอื งมูล

การออกแบบและพัฒนาอินโฟกราฟิก | 27

2. ภาพถ่ายที่อยู่ในเว็บไซต์แคนวา ให้คลิก เมนูภาพถ่าย (1) สามารถเลือกรูปภาพที่แนะนา
หรือพมิ พช์ ื่อภาพในช่อง ค้นหาภาพถ่าย (2) แลว้ เลือกรปู ภาพที่ต้องการ (3) กรณีท่ีผู้ใช้สถานะไม่เป็น
แคนวาแบบพรีเมียม ในบางรูปภาพอาจเสียเงินในการใช้งาน หากต้องการใช้รูปภาพฟรี ให้ผู้ใช้นา
เมาส์ไปวางยังรูปภาพ หากมีขอ้ ความฟรปี รากฏข้ึนแสดงวา่ สามารถใช้งานได้แบบไม่เสยี เงิน (4)

2.ค้นหารูปภาพทต่ี ้องการ

1.เลือกเมนภู าพถ่าย 3.เลอื กรปู ภาพ

4.รปู ภาพจะปรากฏในผลงาน
ภาพที่ 22 การเพมิ่ รูปภาพใหก้ ับผลงานดว้ ยภาพถา่ ยในเว็บไซต์แคนวา
ทีม่ า : เอกสารประกอบการฝกึ อบรมครูสงั กดั สานกั งานศกึ ษาธกิ าร จงั หวัดลาปาง โดย สมชาย เมอื งมลู

ขั้นตอนที่ 7 การเพิ่มองค์ประกอบให้กับผลงาน เป็นการเพิ่มภาพประกอบต่างๆ เช่น
ภาพเคลอ่ื นไหว ภาพเวคเตอร์ เพ่อื เพมิ่ ความนา่ สนใจและทาใหผ้ ลงานมีความสมบูรณ์ขึน้ ให้คลกิ เมนู
องคป์ ระกอบ (1) เลอื กรปู ภาพทีต่ ้องการ (2) จะปรากฏภาพ คลกิ เลอื กภาพทีต่ ้องการ

1.เลอื กองคป์ ระกอบ

2.เลอื กรูปภาพทตี่ ้องการ
3.รูปภาพจะปรากฏในผลงาน
ภาพที่ 23 การเพ่มิ องค์ประกอบให้กบั ผลงาน
ทมี่ า : เอกสารประกอบการฝึกอบรมครสู ังกดั สานักงานศึกษาธกิ าร จงั หวัดลาปาง โดย สมชาย เมอื งมูล

28 | การออกแบบคอมพิวเตอรก์ ราฟิก

ขั้นตอนที่ 8 การเพิ่มข้อความให้กับผลงาน ให้คลิก เมนูข้อความ (1) เลือก รูปแบบการ
แสดงผลของฟอนต์ (2) แล้วคลิกเพื่อพิมพ์ข้อความ นอกจากนี้ผู้ใช้สามารถคัดลอกข้อความจาก
Microsoft Office โดยพิมพท์ ี่แป้นพิมพ์ CTRL+C เพือ่ คดั ลอก และ CTRL+V เพอื่ วางข้อความ (3)

3.ข้อความจะปรากฏในผลงาน

2.เลอื กรปู แบบที่ตอ้ งการ

1.เลือกเมนูขอ้ ความ
ภาพท่ี 24 การเพ่ิมข้อความใหก้ ับผลงาน
ทม่ี า : เอกสารประกอบการฝกึ อบรมครูสงั กดั สานกั งานศึกษาธกิ าร จงั หวัดลาปาง โดย สมชาย เมืองมูล

ข้นั ตอนท่ี 9 การเพม่ิ พื้นหลงั ให้กบั ผลงาน ให้คลกิ เมนูพื้นหลัง (1) สามารถเลือกพื้นหลังที่
แนะนาหรอื พิมพ์ชื่อภาพในช่อง คน้ หาพ้ืนหลงั (2) กรณีท่ผี ใู้ ชส้ ถานะไมเ่ ปน็ แคนวาแบบพรีเมียม บาง
พื้นหลังอาจเสียเงินในการใช้งาน หากต้องการใช้พื้นหลังฟรี ให้นาเมาส์ไปวางยังพื้นหลัง หากมี
ขอ้ ความ ฟรี ปรากฏขึ้นมาแสดงวา่ สามารถใช้งานไดแ้ บบไมเ่ สียเงิน (3)

2.คน้ หาพน้ื หลังทต่ี ้องการ

3.พ้ืนหลังที่ใชง้ านไดฟ้ รี

1.เลือกเมนพู ืน้ หลงั

ภาพที่ 25 การเพมิ่ พื้นหลงั ให้กบั ผลงาน
ทมี่ า : เอกสารประกอบการฝกึ อบรมครูสังกดั สานกั งานศึกษาธกิ าร จงั หวัดลาปาง โดย สมชาย เมอื งมลู

การออกแบบและพฒั นาอินโฟกราฟกิ | 29

ภาพท่ี 26 อินโฟกราฟกิ ที่สรา้ งด้วยแมแ่ บบโปสเตอร์
ทม่ี า : เอกสารประกอบการฝึกอบรมครสู งั กดั สานักงานศึกษาธกิ าร จังหวดั ลาปาง โดย สมชาย เมืองมูล

2. การสรา้ งอินโฟกราฟิกดว้ ยแมแ่ บบอนิ โฟกราฟกิ
เป็นการสร้างอินโฟกราฟิกด้วยแม่แบบอินโฟกราฟิก ซึ่งจะมีขนาดที่เหมาะสาหรับการ

เผยแพร่บนเวบ็ ไซต์ มขี ้นั ตอนการสร้าง ดงั นี้
ขั้นตอนที่ 1 ใหผ้ ู้ใช้คลกิ สร้างงานออกแบบ (1) เลือก อินโฟกราฟกิ (2)

1.เลือกสร้างงานออกแบบ

2.เลือกอินโฟกราฟกิ

ภาพที่ 27 อนิ โฟกราฟกิ ที่สรา้ งด้วยแม่แบบอนิ โฟกราฟิก
ทีม่ า : เอกสารประกอบการฝกึ อบรมครสู งั กดั สานกั งานศกึ ษาธกิ าร จงั หวดั ลาปาง โดย สมชาย เมืองมูล

30 | การออกแบบคอมพวิ เตอรก์ ราฟิก

ขั้นตอนท่ี 2 จะปรากฏหนา้ จอการสร้างผลงาน ใหผ้ ู้ใช้ตั้งชื่อผลงาน ทีเ่ มนู งานออกแบบ
ท่ีไม่มชี อ่ื ใหค้ ลกิ แล้วพิมพ์ชอ่ื ผลงานทต่ี อ้ งการ

ต้งั ชอ่ื ผลงาน

ภาพที่ 28 การตั้งช่ือผลงาน
ทมี่ า : เอกสารประกอบการฝึกอบรมครูสังกดั สานกั งานศกึ ษาธกิ าร จังหวัดลาปาง โดย สมชาย เมอื งมูล

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

1.เลอื กแม่แบบผลงาน

2.แมแ่ บบเปล่า

3.เลือกแม่แบบ ฟรี

ภาพที่ 29 การเลือกแมแ่ บบผลงาน
ทีม่ า : เอกสารประกอบการฝึกอบรมครสู งั กัดสานักงานศกึ ษาธกิ าร จังหวัดลาปาง โดย สมชาย เมอื งมูล

การออกแบบและพฒั นาอนิ โฟกราฟิก | 31

ขั้นตอนที่ 4 หากผู้ใช้เลือกแม่แบบผลงานที่แคนวาออกแบบ ให้คลิกแม่แบบที่ต้องการ (1) จะปรากฏ
แมแ่ บบทเ่ี ลอื ก ในสว่ นของพืน้ ท่กี ารทางาน (2) ผใู้ ช้สามารถแก้ไขหรอื เพ่มิ ข้อมลู ได้ตามต้องการ

1.เลอื กแมแ่ บบผลงาน

2.ผลงานที่สร้างขนึ้ มา

ภาพที่ 30 การเลอื กแมแ่ บบผลงานแบบฟรี
ทีม่ า : เอกสารประกอบการฝกึ อบรมครูสงั กดั สานักงานศกึ ษาธกิ าร จงั หวดั ลาปาง โดย สมชาย เมืองมลู

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

1.เลอื กเมนอู งคป์ ระกอบ

3.รูปภาพจะปรากฏในผลงาน

2.เลอื กรูปภาพที่ตอ้ งการ
ภาพท่ี 31 การเพิ่มขอ้ มูล
ทีม่ า : เอกสารประกอบการฝึกอบรมครูสงั กดั สานักงานศึกษาธกิ าร จังหวดั ลาปาง โดย สมชาย เมอื งมูล

32 | การออกแบบคอมพิวเตอรก์ ราฟิก

15. การส่งออกผลงานอินโฟกราฟกิ

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

1. การแชร์ เป็นวิธีการการส่งออกผลงานด้วยลิงก์เว็บไซต์ ที่สะดวก รวดเร็วและสามารถ
กาหนดสิทธิในการเข้าชมว่าจะให้ดูผลงานเพียงอย่างเดียวหรือสามารถแก้ไขผลงาน ซึ่งเป็นที่นิยมกนั
อย่างแพร่หลาย เพยี งแค่คดั ลอกลิงก์แล้วส่งไปยงั ส่ือสังคมออนไลน์ สง่ อีเมล หรอื โพสในเว็บไซต์ต่างๆ
ให้กับผู้ใชง้ าน โดยให้คลิกที่ เมนูแชร์ (1) เลือกการเข้าถึงไปทีห่ ัวขอ้ แชร์ลิงก์ไป เลือกมุมมอง (2) เพื่อ
เปิดดผู ลงานไดอ้ ย่างเดียว แล้วคลกิ คดั ลอก (3) จะปรากฏตัวอย่างลงิ ก์ทไี่ ด้ ดังภาพที่ 6-24

1.เลือกเมนูแชร์

2.เลอื กสิทธิในการใช้งาน 3.คัดลอกลงิ ก์ผลงาน

ภาพที่ 32 การแชร์ผลงานอินโฟกราฟกิ ดว้ ยลิงกเ์ วบ็ ไซต์
ทีม่ า : เอกสารประกอบการฝึกอบรมครสู ังกัดสานักงานศึกษาธกิ าร จงั หวดั ลาปาง โดย สมชาย เมืองมลู

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

การออกแบบและพฒั นาอนิ โฟกราฟิก | 33

3. การดาวน์โหลดผลงาน เป็นวิธีการส่งออกในรูปแบบของไฟล์คอมพิวเตอร์ โดย
ผู้ใช้สามารถดาวน์โหลดไฟล์ผลงาน คือ ไฟล์เอกสารนามสกุล .PDF ไฟล์รูปภาพนามสกุล .JPG .PNG
.GIF และไฟลว์ ิดีโอนามสกุล .MP4 โดยให้คลกิ ทเ่ี มนดู าวนโ์ หลด เลอื กประเภทไฟล์ท่ีต้องการ ตัวอย่าง
จะเลือกดาวน์โหลดไฟล์ .PDF ซึ่งจะมีตัวเลือกอยู่ 2 รูปแบบ คือ 1) มาตรฐาน PDF จะเป็นการสร้าง
ไฟล์ PDF ในมาตรฐานท่วั ไป 2) PDF สาหรบั งานพิมพ์ จะเป็นการสร้างไฟลส์ าหรบั พมิ พ์ ซง่ึ จะมีความ
ละเอียด โดยให้คลิกที่ เมนูดาวน์โหลด (1) เลือกประเภทไฟล์ PDF สาหรับงานพิมพ์ (2) เลือกเส้นตัด
และระยะตัดตก (3) เพื่อความสะดวกหลังจากที่พิมพ์ออกมาแล้วจะมีเส้นตัดให้ แล้วคลิกปุ่มดาวน์
โหลด (4) ดงั ภาพท่ี 6-25

1.เลือกเมนูดาวน์โหลด

2.เลือก PDF สาหรับพมิ พ์
3.เลือกเสน้ ตัดและระยะตดั ตก

4.คลกิ ดาวน์โหลด

5.เสน้ ตัดหรอื ระยะตัดตก

ภาพที่ 33 การแชรผ์ ลงานอินโฟกราฟกิ ด้วยการดาวนโ์ หลด
ทีม่ า : เอกสารประกอบการฝึกอบรมครูสงั กัดสานกั งานศึกษาธกิ าร จังหวดั ลาปาง โดย สมชาย เมอื งมลู

34 | การออกแบบคอมพิวเตอร์กราฟิก

ข้อมูลอา้ งองิ

Vital, A. (2018). What Is an Infographic. Retrieved 11 14, 2020, from
https://blog.adioma.com/what-is-an-infographic/

ใจทิพย์ ณ สงขลา. (2561). การออกแบบการเรียนอย่างดิจิทัล = Digital Learning Design.
กรงุ เทพฯ: โรงพิมพ์แห่งจุฬาลงกรณ์มหาวทิ ยาลัย.

จงรัก เทศนา. (12 เมษายน 2562). อินโฟกราฟิกส์ (Infographics). เข้าถึงได้จาก
http://www.krujongrak.com/infographics/infographics_information.pdf

จตุ ิพงศ์ ภูสมุ าศ. (2560). Priniples Infographic. นนทบุรี: ไอดีซีฯ.
ณชิ มน หริ ัญพฤกษ์. (2558). Basic Infographic. นนทบรุ ี: ไอดซี ี พรีเมียร.์
ถนอมพร (ตันพิพัฒน์) เลาหจรัสแสง. (2561). นวัตกรรมและเทคโนโลยีสารสนเทศเพื่อการศึกษาใน

ยคุ การเรยี นรู้ 4.0. เชยี งใหม่: ตองสาม ดีไซน.์
บริษัทอินโฟกราฟิกไทยแลนด์. (2557, กรกฏาคม 31). ออกแบบ Infographic ด้วย 9 Layout.

Retrieved from http://infographic.in.th: http://infographic.in.th/infographic/
ออกแบบ-infographic-ดว้ ย-9-layout
รัฐพล ประดับเวทย์, & นิพาดา ไตรรัตน์. (2563, มีนาคม 2). การออกแบบ Infographic
(Infographic Design). Retrieved from https://lms.thaimooc.org/courses/course-
v1:SWU+SWU011+2018/course/
สุธาพร ล้ำเลิศกุล. (2561). พูดด้วยภาพ พรีเซ็นต์อย่างไรใหถ้ ูกใจคนฟัง by BetterPitch. กรุงเทพฯ:
ปัญญามติ ร.

การออกแบบและพฒั นาอนิ โฟกราฟกิ | 35