Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
ผศ.ดร.ศยามน อินสะอาด อาจารย์ภาควิชาเทคโนโลยีการศึกษา มหาวิทยาลัยรามคําแหง
อินโฟกราฟิก (infographic) หมายถึง การนําข้อมูล (information) ความรู้ (knowledge) ที่มีปริมาณมาก หรือซับซ้อน มาสรุปเป็นสารส...
หัวใจหลัก ในการทําอินโฟกราฟิก “การเปลี่ยนข้อมูลที่ยาก ให้เข้าใจง่าย ได้อย่างเร็วสุด”
VARK Model
องค์ประกอบของอินโฟกราฟิก ข้อมูล ภาพ อินโฟกราฟิก
องค์ประกอบของอินโฟกราฟิก • ข้อมูล – ตัวหนังสือ – ข้อความ – ตัวเลข • ภาพกราฟิก – รูปทรงเรขาคณิต –ภาพไอคอน –ภาพการ์ตูน –ชาร์...
ประโยชน์ของอินโฟกราฟิก • นําเสนอข้อมูล • นําเสนอข่าวสาร • ดึงดูดความสนใจ • ใช้ภาพกราฟิกเล่าเรื่อง • เข้าใจเนื้อหาสาระได้ง่...
จุดเด่นของการสื่อสารด้วยอินโฟกราฟิก • ง่ายต่อการทําความเข้าใจ • ดึงดูดความสนใจได้มากกว่า • ประหยัดเวลาในการศึกษาข้อมูล • ช...
ทักษะที่จําเป็นในการทําอินโฟกราฟิก ทักษะการ วิเคราะห์ ทักษะการ เรียบเรียง ทักษะด้าน ดีไซน์
อินโฟกราฟิกที่ดี • ข้อมูลในอินโฟกราฟิกต้องสั้นกระชับ • อินโฟกราฟิกไม่เหมาะในการให้ข้อมูลจํานวนมาก • ภาพที่ใช้เข้าใจง่าย นิ...
การนําอินโฟกราฟิกไปใช้งาน • งานออกแบบเว็บไซต์ • งานออกแบบหนังสือ โปสเตอร์ โชว์ชัวร์ สิ่งพิมพ์ • Social Network • TV,  VDO ...
Elements and principles of art
The Color Theory infographic
https://www.motocms.com/blog/wp-content/uploads/2014/08/justimagine-psychology-colors-best-infographics.jpeg
ประเภทของอินโฟกราฟิก Types of Infographics • Mixed charts แบบผสมผสาน • Informational / List แบบอธิบายข้อมูล • Timeline แบบ...
ประเภทของอินโฟกราฟิก Types of Infographics • Comparison แบบเปรียบเทียบข้อมูล • Location แบบแผนที่ สถานที่ตั้ง • Photograph...
Mixed charts
Mixed charts
Mixed charts
Mixed charts
Informational / List
Informational / List https://infograph.venngage.com/infograph/
Informational / List
Timeline
Timeline
Timeline
How-to
Comparison
Location
Location
Location
Photographic
Photographic
Photographic
Hierarchical
Hierarchical
Single chart
Single chart
ประเภทของอินโฟกราฟิก • Static infographic สื่อสารสนเทศรูปแบบภาพนิ่ง สรุปเนื้อหาใจความชัดเจน สามารถเผยแพร่ จัดทําเป็น ข้อมู...
ประเภทของอินโฟกราฟิก • Presentation infographic สื่อสารสนเทศรูปแบบ การนําเสนอเคลื่อนไหวเป็นขั้นตอนลําดับเหตุการณ์
ประเภทของอินโฟกราฟิก • Motion infographic สื่อสารสนเทศแบบภาพเคลื่อนไหว มีองค์ประกอบของการบรรยายภาพและเสียง
ประเภทของอินโฟกราฟิก • Interactive infographic สื่อสารสนเทศรูปแบบเว็บไซต์ที่ สามารถกําหนดค่า เพิ่มลูกเล่นให้กับสื่อให้อยู่...
ประเภทของอินโฟกราฟิกตามวัตถุประสงค์การใช้งาน • ข่าวเด่น ประเด่นร้อน และสถานการณ์วิกฤต • สอน ฮาวทู (How to) • ให้ความรู้ • ...
การเตรียมข้อมูลสําหรับอินโฟกราฟิก • ส่วนประกอบของข้อมูลใน อินโฟกราฟิก • หัวใจของการเตรียมข้อมูลสําหรับทําอินโฟกราฟิก • ข้อ...
ภาพกราฟิกที่มักใช้ในอินโฟกราฟิก • ภาพไอคอน • ภาพการ์ตูน • ภาพสัญลักษณ์ • ภาพกราฟิก • ภาพถ่าย • รูปทรงเรขาคณิต
ภาพกราฟิกที่มักใช้ในอินโฟกราฟิก • เส้นและลูกศร • ชาร์ตและไดอะแกรม • แผนที่ • แบล็กกราวด์ • กราฟิกอื่นๆ
หลักสําคัญในการออกแบบ • ออกแบบเหมาะกับกลุ่มเป้ าหมาย • ออกแบบให้ง่ายเข้าไว้ • สร้างความสมดุลระหว่างตัวหนังสือกับภาพกราฟิก ...
กระบวนการที่ดีในการออกแบบอินโฟกราฟิก 1. รวบรวมข้อมูล 2. อ่านข้อมูลทั้งหมด 3. ค้นหาวิธีการเล่าเรื่อง 4. ระบุปัญหาและความต้อ...
กระบวนการที่ดีในการออกแบบอินโฟกราฟิก 7. เลือกรูปแบบอินโฟกราฟิก 8. กําหนดภาพให้ตรงกับหัวข้อ 9. ตรวจสอบข้อมูลและทดลองใช้ 10....
ขั้นตอนการสร้างอินโฟกราฟิก 1. หาข้อมูล - Useful ต้องเป็นข้อมูลที่มีประโยชน์และเปลี่ยน ชีวิตคนไปในทางที่ดีขึ้น - Insightful...
ขั้นตอนการสร้างอินโฟกราฟิก 2. คัดแยกเนื้อหา 3. จัดหมวดหมู่ 4. คิดไอเดีย 5. ร่างแบบ 6. ออกแบบ 7. เผยแพร่
การสร้างอินโฟกราฟิกให้มีประสิทธิภาพ 1. เน้นที่หัวข้อหลักหัวข้อเดียว 2. ออกแบบให้เข้าใจง่าย 3. ข้อมูลเป็นสิ่งสําคัญ 4. แน่ใ...
การสร้างอินโฟกราฟิกให้มีประสิทธิภาพ 6. การออกแบบที่ดีทําให้มีประสิทธิภาพ 7. ใช้สีที่ดึงดูดความสนใจ 8. ใช้ข้อความที่สั้นๆ 9...
สไตล์การออกแบบอินโฟกราฟิก • แบบแบนราบ (Flat ) • แบบเหมือนจริง (Photorealistic) • แบบ 3 มิติ (3D) • แบบโครงร่าง (Outline)
การออกแบบอินโฟกราฟิกแบบแบนราบ (Flat ) • การออกแบบให้ดูแบนราบ • ใช้สีสันน้อย 3-4 สี • ไม่เน้นแสงและเงา • ไม่ใส่เอฟเฟกต์ให้ด...
แบบแบนราบ (Flat )
การออกแบบอินโฟกราฟิกแบบเหมือนจริง (Photorealistic) • การออกแบบอ็อบเจกต์ต่าง ๆ ให้ดูเหมือนของจริง หรือเลียนแบบของจริง สไตล์...
แบบเหมือนจริง (Photorealistic)
แบบเหมือนจริง (Photorealistic)
การออกแบบอินโฟกราฟิกแบบ 3 มิติ (3D) • การออกแบบอ็อบเจกต์ให้ดู เป็นสามมิติ มีด้านกว้าง ด้านยาว และด้านสูง • การออกแบบสไตล์น...
แบบ 3 มิติ (3D)
การออกแบบอินโฟกราฟิกแบบโครงร่าง (Outline) • เน้นโครงสร้างหรือ เส้นขอบของอ็อบเจกต์ • เลือกสีของเส้นโครงร่าง และสีของพื้นหลั...
ตัวอย่างอินโฟกราฟิกที่ไม่มีประสิทธิภาพ
ตัวอย่างอินโฟกราฟิกที่ไม่มีประสิทธิภาพ
ตัวอย่างอินโฟกราฟิกที่ไม่มีประสิทธิภาพ
ตัวอย่างอินโฟกราฟิกที่ไม่มีประสิทธิภาพ
ตัวอย่างอินโฟกราฟิกที่ไม่มีประสิทธิภาพ
ตัวอย่างอินโฟกราฟิกที่ไม่มีประสิทธิภาพ
ตัวอย่างอินโฟกราฟิกที่ไม่มีประสิทธิภาพ
ตัวอย่างอินโฟกราฟิกที่ไม่มีประสิทธิภาพ
ตัวอย่างอินโฟกราฟิกที่ไม่มีประสิทธิภาพ
ตัวอย่างอินโฟกราฟิกที่ไม่มีประสิทธิภาพ
ตัวอย่างอินโฟกราฟิกที่ไม่มีประสิทธิภาพ
ตัวอย่างอินโฟกราฟิกที่ไม่มีประสิทธิภาพ
ตัวอย่างอินโฟกราฟิกที่ไม่มีประสิทธิภาพ
ฟอร์แมทที่ใช้งานร่วมกัน ชื่อเรื่อง แหล่งที่มาของข้อมูล เครดิตผู้จัดทํา
ฟอร์แมทที่ใช้งานร่วมกัน
โปรแกรมที่ใช้ออกแบบอินโฟกราฟิก • Adobe Illustrator • Adobe Photoshop • Microsoft Visio, Word, PowerPoint • เครื่องมือออนไล...
Links • https://venngage.com/templates/ • https://infograph.venngage.com/infograph/view/fdc09842 -1027-4db5-9438-88a98e0a5...
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Infographic Design การออกแบบอินโฟกราฟิก
Upcoming SlideShare
Loading in …5
×

Infographic Design การออกแบบอินโฟกราฟิก

6,805 views

Published on

Infographic Design การออกแบบอินโฟกราฟิก
โดย ผศ.ดร.ศยามน อินสะอาด
ภาควิชาเทคโนโลยีการศึกษาคณะศึกษาศาสตร์ มหาวิทยาลัยรามคำแหง
Asst. Prof.Dr.Sayamon Insaard
Department of Educational Technology, Faculty of Education, Ramkhamhaeng University.
E-Mail: dr.sayamon@gmail.com
http://www.facebook.com/sayamon2010

Published in: Education
no profile picture user
  • Hello! I can recommend a site that has helped me. It's called ⇒ www.HelpWriting.net ⇐ So make sure to check it out!
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Follow the link, new dating source: ❶❶❶ http://bit.ly/2Qu6Caa ❶❶❶
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Dating direct: ♥♥♥ http://bit.ly/2Qu6Caa ♥♥♥
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
Show More

Infographic Design การออกแบบอินโฟกราฟิก

  1. 1. ผศ.ดร.ศยามน อินสะอาด อาจารย์ภาควิชาเทคโนโลยีการศึกษา มหาวิทยาลัยรามคําแหง
  2. 2. อินโฟกราฟิก (infographic) หมายถึง การนําข้อมูล (information) ความรู้ (knowledge) ที่มีปริมาณมาก หรือซับซ้อน มาสรุปเป็นสารสนเทศที่ออกแบบใน ลักษณะภาพนิ่งหรือภาพเคลื่อนไหว เพื่ออธิบาย ข้อมูลที่ซับซ้อนให้เกิดความเข้าใจได้ง่ายใช้เวลา รวดเร็วและมีความชัดเจน
  3. 3. หัวใจหลัก ในการทําอินโฟกราฟิก “การเปลี่ยนข้อมูลที่ยาก ให้เข้าใจง่าย ได้อย่างเร็วสุด”
  4. 4. VARK Model
  5. 5. องค์ประกอบของอินโฟกราฟิก ข้อมูล ภาพ อินโฟกราฟิก
  6. 6. องค์ประกอบของอินโฟกราฟิก • ข้อมูล – ตัวหนังสือ – ข้อความ – ตัวเลข • ภาพกราฟิก – รูปทรงเรขาคณิต –ภาพไอคอน –ภาพการ์ตูน –ชาร์ต ไดอะแกรม –ภาพถ่าย
  7. 7. ประโยชน์ของอินโฟกราฟิก • นําเสนอข้อมูล • นําเสนอข่าวสาร • ดึงดูดความสนใจ • ใช้ภาพกราฟิกเล่าเรื่อง • เข้าใจเนื้อหาสาระได้ง่าย • ส่งสารได้รวดเร็ว • สรุปเรียบเรียง สั้น กระชับ • เข้าใจข้อมูลในภาพเดียว • สร้างความแปลกตา
  8. 8. จุดเด่นของการสื่อสารด้วยอินโฟกราฟิก • ง่ายต่อการทําความเข้าใจ • ดึงดูดความสนใจได้มากกว่า • ประหยัดเวลาในการศึกษาข้อมูล • ช่วยให้จดจําข้อมูลได้ดีกว่า • ดูเป็นมืออาชีพ น่าเชื่อถือ • นําไปเผยแพร่ต่อได้ง่าย
  9. 9. ทักษะที่จําเป็นในการทําอินโฟกราฟิก ทักษะการ วิเคราะห์ ทักษะการ เรียบเรียง ทักษะด้าน ดีไซน์
  10. 10. อินโฟกราฟิกที่ดี • ข้อมูลในอินโฟกราฟิกต้องสั้นกระชับ • อินโฟกราฟิกไม่เหมาะในการให้ข้อมูลจํานวนมาก • ภาพที่ใช้เข้าใจง่าย นิยมใช้แบบ Flat Design • จัดวางองค์ประกอบลงตัว ดูเรียบง่าย สบายตา
  11. 11. การนําอินโฟกราฟิกไปใช้งาน • งานออกแบบเว็บไซต์ • งานออกแบบหนังสือ โปสเตอร์ โชว์ชัวร์ สิ่งพิมพ์ • Social Network • TV,  VDO • Presentation
  12. 12. Elements and principles of art
  13. 13. The Color Theory infographic
  14. 14. https://www.motocms.com/blog/wp-content/uploads/2014/08/justimagine-psychology-colors-best-infographics.jpeg
  15. 15. ประเภทของอินโฟกราฟิก Types of Infographics • Mixed charts แบบผสมผสาน • Informational / List แบบอธิบายข้อมูล • Timeline แบบแสดงข้อมูลตามลําดับเวลา • How-to แบบแสดงวิธีทํา • Process แบบแสดงกระบวนการ
  16. 16. ประเภทของอินโฟกราฟิก Types of Infographics • Comparison แบบเปรียบเทียบข้อมูล • Location แบบแผนที่ สถานที่ตั้ง • Photographic แบบภาพกราฟิก • Hierarchical แบบแสดงลําดับชั้น • Single chart แบบแผนภูมิ
  17. 17. Mixed charts
  18. 18. Mixed charts
  19. 19. Mixed charts
  20. 20. Mixed charts
  21. 21. Informational / List
  22. 22. Informational / List https://infograph.venngage.com/infograph/
  23. 23. Informational / List
  24. 24. Timeline
  25. 25. Timeline
  26. 26. Timeline
  27. 27. How-to
  28. 28. Comparison
  29. 29. Location
  30. 30. Location
  31. 31. Location
  32. 32. Photographic
  33. 33. Photographic
  34. 34. Photographic
  35. 35. Hierarchical
  36. 36. Hierarchical
  37. 37. Single chart
  38. 38. Single chart
  39. 39. ประเภทของอินโฟกราฟิก • Static infographic สื่อสารสนเทศรูปแบบภาพนิ่ง สรุปเนื้อหาใจความชัดเจน สามารถเผยแพร่ จัดทําเป็น ข้อมูลอ้างอิงในรูปแบบของภาพ
  40. 40. ประเภทของอินโฟกราฟิก • Presentation infographic สื่อสารสนเทศรูปแบบ การนําเสนอเคลื่อนไหวเป็นขั้นตอนลําดับเหตุการณ์
  41. 41. ประเภทของอินโฟกราฟิก • Motion infographic สื่อสารสนเทศแบบภาพเคลื่อนไหว มีองค์ประกอบของการบรรยายภาพและเสียง
  42. 42. ประเภทของอินโฟกราฟิก • Interactive infographic สื่อสารสนเทศรูปแบบเว็บไซต์ที่ สามารถกําหนดค่า เพิ่มลูกเล่นให้กับสื่อให้อยู่ในรูปแบบตอบ โต้ทันที เคลื่อนไหวได้และสามารถรองรับการตอบสนอง http://ernestoolivares.com/interactivity/samples/namas/
  43. 43. ประเภทของอินโฟกราฟิกตามวัตถุประสงค์การใช้งาน • ข่าวเด่น ประเด่นร้อน และสถานการณ์วิกฤต • สอน ฮาวทู (How to) • ให้ความรู้ • บอกเล่าตํานานหรือวิวัฒนาการ • อธิบายผลสํารวจ และ งานวิจัย • กระตุ้นให้เกิดการเปลี่ยนแปลงพฤติกรรม • โปรโมทสินค้าและบริการ
  44. 44. การเตรียมข้อมูลสําหรับอินโฟกราฟิก • ส่วนประกอบของข้อมูลใน อินโฟกราฟิก • หัวใจของการเตรียมข้อมูลสําหรับทําอินโฟกราฟิก • ข้อมูลแบบไหนเหมาะจะนําเสนอเป็น อินโฟกราฟิก • เทคนิคย่นย่อข้อมูลให้สั้น • แปลงข้อมูลธรรมดาเป็น อินโฟกราฟิก
  45. 45. ภาพกราฟิกที่มักใช้ในอินโฟกราฟิก • ภาพไอคอน • ภาพการ์ตูน • ภาพสัญลักษณ์ • ภาพกราฟิก • ภาพถ่าย • รูปทรงเรขาคณิต
  46. 46. ภาพกราฟิกที่มักใช้ในอินโฟกราฟิก • เส้นและลูกศร • ชาร์ตและไดอะแกรม • แผนที่ • แบล็กกราวด์ • กราฟิกอื่นๆ
  47. 47. หลักสําคัญในการออกแบบ • ออกแบบเหมาะกับกลุ่มเป้ าหมาย • ออกแบบให้ง่ายเข้าไว้ • สร้างความสมดุลระหว่างตัวหนังสือกับภาพกราฟิก • พื้นที่ว่างก็สําคัญ • ออกแบบให้เหมาะกับการแสดงผล • หัวเรื่องต้องโดดเด่น • โฟกัสไปประเด็นเดียว
  48. 48. กระบวนการที่ดีในการออกแบบอินโฟกราฟิก 1. รวบรวมข้อมูล 2. อ่านข้อมูลทั้งหมด 3. ค้นหาวิธีการเล่าเรื่อง 4. ระบุปัญหาและความต้องการ 5. จัดลําดับโครงสร้างข้อมูล 6. ออกแบบโครงสร้างข้อมูล
  49. 49. กระบวนการที่ดีในการออกแบบอินโฟกราฟิก 7. เลือกรูปแบบอินโฟกราฟิก 8. กําหนดภาพให้ตรงกับหัวข้อ 9. ตรวจสอบข้อมูลและทดลองใช้ 10. แบ่งปันความรู้ในอินเทอร์เน็ต
  50. 50. ขั้นตอนการสร้างอินโฟกราฟิก 1. หาข้อมูล - Useful ต้องเป็นข้อมูลที่มีประโยชน์และเปลี่ยน ชีวิตคนไปในทางที่ดีขึ้น - Insightful ต้องมีคุณภาพ เนื้อหาแน่น รู้ลึกรู้จริง -Interesting ต้องสดใหม่และทันกระแส มีความ แปลกใหม่ - Reliable ข้อมูล ต้องมีความน่าเชื่อถือ ที่มา อ้างอิง ชัดเจน
  51. 51. ขั้นตอนการสร้างอินโฟกราฟิก 2. คัดแยกเนื้อหา 3. จัดหมวดหมู่ 4. คิดไอเดีย 5. ร่างแบบ 6. ออกแบบ 7. เผยแพร่
  52. 52. การสร้างอินโฟกราฟิกให้มีประสิทธิภาพ 1. เน้นที่หัวข้อหลักหัวข้อเดียว 2. ออกแบบให้เข้าใจง่าย 3. ข้อมูลเป็นสิ่งสําคัญ 4. แน่ใจว่าข้อเท็จจริงถูกต้อง 5. ให้อินโฟกราฟิกเป็นตัวเล่าเรื่อง
  53. 53. การสร้างอินโฟกราฟิกให้มีประสิทธิภาพ 6. การออกแบบที่ดีทําให้มีประสิทธิภาพ 7. ใช้สีที่ดึงดูดความสนใจ 8. ใช้ข้อความที่สั้นๆ 9. ตรวจสอบตัวเลข ข้อมูล 10. ทําไฟล์อินโฟกราฟิกให้เล็ก
  54. 54. สไตล์การออกแบบอินโฟกราฟิก • แบบแบนราบ (Flat ) • แบบเหมือนจริง (Photorealistic) • แบบ 3 มิติ (3D) • แบบโครงร่าง (Outline)
  55. 55. การออกแบบอินโฟกราฟิกแบบแบนราบ (Flat ) • การออกแบบให้ดูแบนราบ • ใช้สีสันน้อย 3-4 สี • ไม่เน้นแสงและเงา • ไม่ใส่เอฟเฟกต์ให้ดูนูนเด่นหรือมีมิติ • มักใช้รูปทรงเรขาคณิตพื้นฐานเป็นหลัก
  56. 56. แบบแบนราบ (Flat )
  57. 57. การออกแบบอินโฟกราฟิกแบบเหมือนจริง (Photorealistic) • การออกแบบอ็อบเจกต์ต่าง ๆ ให้ดูเหมือนของจริง หรือเลียนแบบของจริง สไตล์การออกแบบแนวนี้ได้รับความนิยมน้อย
  58. 58. แบบเหมือนจริง (Photorealistic)
  59. 59. แบบเหมือนจริง (Photorealistic)
  60. 60. การออกแบบอินโฟกราฟิกแบบ 3 มิติ (3D) • การออกแบบอ็อบเจกต์ให้ดู เป็นสามมิติ มีด้านกว้าง ด้านยาว และด้านสูง • การออกแบบสไตล์นี้เหมาะ จะใช้อ็อบเจกต์จําพวก ชาร์ตและไดอะแกรมต่าง ๆ
  61. 61. แบบ 3 มิติ (3D)
  62. 62. การออกแบบอินโฟกราฟิกแบบโครงร่าง (Outline) • เน้นโครงสร้างหรือ เส้นขอบของอ็อบเจกต์ • เลือกสีของเส้นโครงร่าง และสีของพื้นหลังให้ตัดกัน จะช่วยให้อินโฟกราฟิกดู โดดเด่นและน่าสนใจ
  63. 63. ตัวอย่างอินโฟกราฟิกที่ไม่มีประสิทธิภาพ
  64. 64. ตัวอย่างอินโฟกราฟิกที่ไม่มีประสิทธิภาพ
  65. 65. ตัวอย่างอินโฟกราฟิกที่ไม่มีประสิทธิภาพ
  66. 66. ตัวอย่างอินโฟกราฟิกที่ไม่มีประสิทธิภาพ
  67. 67. ตัวอย่างอินโฟกราฟิกที่ไม่มีประสิทธิภาพ
  68. 68. ตัวอย่างอินโฟกราฟิกที่ไม่มีประสิทธิภาพ
  69. 69. ตัวอย่างอินโฟกราฟิกที่ไม่มีประสิทธิภาพ
  70. 70. ตัวอย่างอินโฟกราฟิกที่ไม่มีประสิทธิภาพ
  71. 71. ตัวอย่างอินโฟกราฟิกที่ไม่มีประสิทธิภาพ
  72. 72. ตัวอย่างอินโฟกราฟิกที่ไม่มีประสิทธิภาพ
  73. 73. ตัวอย่างอินโฟกราฟิกที่ไม่มีประสิทธิภาพ
  74. 74. ตัวอย่างอินโฟกราฟิกที่ไม่มีประสิทธิภาพ
  75. 75. ตัวอย่างอินโฟกราฟิกที่ไม่มีประสิทธิภาพ
  76. 76. ฟอร์แมทที่ใช้งานร่วมกัน ชื่อเรื่อง แหล่งที่มาของข้อมูล เครดิตผู้จัดทํา
  77. 77. ฟอร์แมทที่ใช้งานร่วมกัน
  78. 78. โปรแกรมที่ใช้ออกแบบอินโฟกราฟิก • Adobe Illustrator • Adobe Photoshop • Microsoft Visio, Word, PowerPoint • เครื่องมือออนไลน์ฟรี Piktochart • http://www.freepik.com/
  79. 79. Links • https://venngage.com/templates/ • https://infograph.venngage.com/infograph/view/fdc09842 -1027-4db5-9438-88a98e0a5feb • http://www.freepik.com/free-photos-vectors/infographic- elements • https://www.learningstudio.info/infographics-design/

×