E-Book

คำำ�นำำ�

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

Graphic Design – https://www.theartcareerproject.com

CONTENTS UNIT 01: หลั​ักการออกแบบ

UNIT 02: การออกแบบกราฟิ​ิกดี​ีไซน์​์

กระบวนการคิ​ิดเบื้​้�องต้​้น

1 ความหมายของการออกแบบกราฟิ​ิก

นิ​ิยามของความคิ​ิดสร้​้างสรรค์​์

2 ดี​ีไซน์​์

กระบวนการคิ​ิดสร้​้างสรรค์​์สำ�ำ หรั​ับ

5 เครื​ือข่​่ายของงานออกแบบกราฟิ​ิก

48

หลั​ักการออกแบบสั​ัญลั​ักษณ์​์

63

งานออกแบบ

43

ความหมายและแนวคิ​ิดในการออกแบบ

7 สี​ีและการสื่​่�อความหมาย

71

องค์​์ประกอบในการออกแบบกราฟิ​ิก

15 ตั​ัวอย่​่างการออกแบบสั​ัญลั​ักษณ์​์

72

UNIT 03: การใช้​้งานโปรแกรม คอมพิ​ิวเตอร์​์เพื่​่�อสร้​้างสรรค์​์สื่​่�อ โปรแกรมที่​่�ใช้​้ในการออกแบบกราฟิ​ิก

77

การใช้​้งานโปรแกรม Adobe Photoshop

77

การใช้​้งานโปรแกรม Adobe Illustrator

82

การใช้​้งานโปรแกรม Adobe InDesign

84

ลั​ักษณะของสื่​่�อโฆษณาและสื่​่�อประชาสั​ัมพั​ันธ์​์ 86

UNIT 04: เทคนิ​ิคการออกแบบ คอมพิ​ิวเตอร์​์กราฟิ​ิก

UNIT 05: รู​ูปแบบการนำำ�เสนอข้​้อมู​ูล ผ่​่านสื่​่�อ

ความหมายของคอมพิ​ิวเตอร์​์กราฟิ​ิก

102 จั​ัดเตรี​ียมไฟล์​์สำำ�หรั​ับการพิ​ิมพ์​์

118

หลั​ักการทำำ�งานของภาพกราฟิ​ิก

105 การสร้​้างงานนำำ�เสนอที่​่�น่​่าดึ​ึงดู​ูด

122

ประเภทของนามสกุ​ุลไฟล์​์ภาพกราฟิ​ิก 106 การเลื​ือกใช้​้กระดาษและการเก็​็บงาน

123

เทคนิ​ิคการออกแบบคอมพิ​ิวเตอร์​์กราฟิ​ิก 111 การพิ​ิมพ์​์ดิ​ิจิ​ิทั​ัล

127

ตั​ัวอย่​่างการสร้​้างเอฟเฟคตกแต่​่งภาพ 113 การแสดงผลงานออนไลน์​์

129

ตั​ัวอย่​่างการนำำ�เสนอผ่​่านสื่​่�อออนไลน์​์

WORKSHOP : ตั​ัวอย่​่างการออกแบบสื่​่�อรู​ูปแบบต่​่าง ๆ

133

136 - 212

สารบั​ั ญ ภาพ ภาพ บทที่​่� 1 หลั​ักการออกแบบ

ภาพที่​่� 1.1 นั​ักจิ​ิตวิ​ิทยาด้​้านการคิ​ิดสร้​้างสรรค์​์

ภาพที่​่� 1.2 การเชื่​่�อมโยงการทำำ�งานของสมองซี​ีกซ้​้ายกั​ับสมองซี​ีกขวา

ภาพที่​่� 1.3 การออกแบบโดยใช้​้ตั​ัวอั​ักษรเชื่​่�อมโยงกั​ับภาพ

ภาพที่​่� 1.4 การออกแบบโดยใช้​้คำำ�พู​ูดปรากฏในภาพ

ภาพที่​่� 1.5 การเปรี​ียบเหมื​ือนนก มี​ีอิ​ิสระ แต่​่พอขี​ีดเส้​้น ก็​็เหมื​ือนเป็​็น

ลวดหนาม

ภาพที่​่� 1.6 การออกแบบภาพที่​่�สื่​่�อให้​้ผู้​้�ดู​ูโดยการเห็​็นภาพจากสายตา

ภาพที่​่� 1.7 การจั​ัดรู​ูปแบบภาพที่​่�มี​ีความจำำ�เป็​็นในการรั​ับรู้​้�วั​ัตถุ​ุผ่​่าน

การมอง

ภาพที่​่� 1.8 การกระตุ้​้�นการรั​ับรู้​้�ผู้​้�ดู​ูให้​้มี​ีความรู้​้�สึ​ึกหิ​ิว

ภาพที่​่� 1.9 Fraser’s Spiral

ภาพที่​่� 1.10 Vertigo

ภาพที่​่� 1.11 จุ​ุด เส้​้น

ภาพที่​่� 1.12 Circle in Inkscape

ภาพที่​่� 1.13 การวางตำำ�แหน่​่งของจุ​ุดและการเว้​้นพื้​้�นที่​่�ระหว่​่างจุ​ุด

สามารถทำำ�ให้​้รู้​้�สึ​ึกได้​้ถึ​ึงการเพิ่​่�ม ลดความเร็​็ว

ภาพที่​่� 1.14 ลายเส้​้นในลั​ักษณะต่​่างๆ

ภาพที่​่� 1.15 เส้​้นเฉี​ียง

ภาพที่​่� 1.16 การใช้​้เส้​้นในลั​ักษณะรู​ูปทรงที่​่�แตกต่​่างกั​ัน (Abstract

Shape Composition

ภาพที่​่� 1.17 ระนาบที่​่�ทำำ�ให้​้ผู้​้�ดูมีู ีความรู้​้�สึ​ึกว่​่า ระนาบบางตั​ัวจะล้​้ม

หรื​ือจะไหลไปตามแรงโน้​้มถ่​่วงของโลก

หน้​้า 2 3 6 7 8 9 10 11 13 14 15 16 16 17 18 19 20

สารบั​ั ญ ภาพ (ต่​่ อ ) ภาพ

ภาพที่​่� 1.18 รู​ูปร่​่างของวั​ัตถุ​ุ

ภาพที่​่� 1.19 รู​ูปทรงแสดงความลึ​ึก กว้​้าง ยาว สู​ูง

ภาพที่​่� 1.20 ภาพการออกแบบที่​่�เลี​ียนแบบจากสิ่​่�งที่​่�ตาเห็​็น

ภาพที่​่� 1.21 ลั​ักษณะของพื้​้�นผิ​ิว

ภาพที่​่� 1.22 วงจรสี​ีในงานออกแบบ

ภาพที่​่� 1.23 แม่​่สี​ี

ภาพที่​่� 1.24 การไล่​่น้ำำ��หนั​ักของสี​ีให้​้ความมื​ืดความสว่​่างที่​่�แตกต่​่างกั​ัน

ภาพที่​่� 1.25 การเรี​ียงลำำ�ดั​ับความจั​ัดของสี​ี

ภาพที่​่� 1.26 RGB vs CMYK

ภาพที่​่� 1.27 การพิ​ิมพ์​์สี​ีแบบ Process Color พิ​ิมพ์​์ซ้​้อนกั​ันแล้​้วเกิ​ิด

เป็​็นสี​ีสั​ันต่​่างๆ

ภาพที่​่� 1.28 กระบวนการผสมสี​ีแบบ RGB

ภาพที่​่� 1.29 วงจรสี​ีธรรมชาติ​ิ

ภาพที่​่� 1.30 คู่​่�สี​ีที่​่�อยู่​่�ตรงข้​้ามมกั​ันในวงจรสี​ี

ภาพที่​่� 1.31 คู่​่�สี​ีข้​้างเคี​ียง

ภาพที่​่� 1.32 สี​ีอุ่​่�นและสี​ีเย็​็น

ภาพที่​่� 1.33 ภาพที่​่� The Dark Knight ที่​่�ใช้​้สี​ีในเชิ​ิงการตลาดและ

แฟชั่​่�น

ภาพที่​่� 1.34 การออกแบบโดยใช้​้สี​ีดำำ�

ภาพที่​่� 1.35 สี​ีขาวสื่​่�อให้​้เห็​็นถึ​ึงความบริ​ิสุ​ุทธิ์​์�

ภาพที่​่� 1.36 สี​ีเทาสื่​่�อให้​้เห็​็นถึ​ึงความปลอดภั​ัย

ภาพที่​่� 1.37 สี​ีน้ำำ��ตาลกั​ับงานโฆษณา

ภาพที่​่� 1.38 สี​ีเขี​ียวสื่​่�อให้​้เห็​็นถึ​ึงความเป็​็นธรรมชาติ​ิ

ภาพที่​่� 1.39 สี​ีส้​้มสื่​่�อให้​้เห็​็นถึ​ึงความสดชื่​่�น

หน้​้า 21 22 22 23 26 26 27 27 28 28 29 29 30 30 31 33 33 34 34 35 35 35

สารบั​ั ญ ภาพ (ต่​่ อ ) ภาพ

ภาพที่​่� 1.40 สี​ีชมพู​ูสื่​่�อถึ​ึงความอบอุ่​่�นน่​่าทะนุ​ุถนอม

ภาพที่​่� 1.41 สี​ีม่​่วงสื่​่�อถึ​ึงความหรู​ูหรา

ภาพที่​่� 1.42 สี​ีแดงสื่​่�อถึ​ึงความมี​ีพลั​ังทั้​้�งด้​้านบวกและด้​้านลบ

ภาพที่​่� 1.43 สี​ีเหลื​ืองสื่​่�อถึ​ึงความสนุ​ุกสนาน ร่​่าเริ​ิง

ภาพที่​่� 1.44 การออกแบบโดยใช้​้มาตราส่​่วนที่​่�ต่​่างขนาดในองค์​์

ประกอบของภาพ

ภาพที่​่� 1.45 การออกแบบโดยใช้​้กราฟิ​ิกซ้ำำ�� ๆ เพิ่​่�มความน่​่าสนใจ

ภาพที่​่� 1.46 การใช้​้ความแตกต่​่างด้​้านรู​ูปแบบ สี​ีและพื้​้�นผิ​ิวในการจั​ัด

องค์​์ประกอบให้​้มี​ีความสมดุ​ุล

ภาพที่​่� 1.47 การออกแบบนกที่​่�มี​ีขนาดใหญ่​่ แต่​่ก็​็ยึ​ึดความสมมาตรกั​ับ

องค์​์ประกอบอื่​่�นๆ

ภาพที่​่� 1.48 การสร้​้างเฟตและความโปร่​่งใส่​่ เพื่​่�อให้​้ชิ้​้�นงานมี​ีความ

แตกต่​่าง

ภาพที่​่� 1.49 การออกแบบวั​ัตถุ​ุเพื่​่�อเป็​็นกรอบในการนำำ�สายตา

ภาพที่​่� 1.50 การใช้​้กริ​ิดลั​ักษณะการออกแบบเป็​็นคอลั​ัมน์​์

ภาพที่​่� 1.51 การใช้​้เส้​้นสร้​้างเพื่​่�อให้​้ภาพเกิ​ิดการเคลื่​่�อนไหว

บทที่​่� 2 การออกแบบกราฟิ​ิกดี​ีไซน์​์

ภาพที่​่� 2.1 Milton Glaser นั​ักกราฟิ​ิกดี​ีไซน์​์เนอร์​์

ภาพที่​่� 2.2 AIGA LOGO

ภาพที่​่� 2.3 The Design Concept Book

ภาพที่​่� 2.4 Elter Drugs

ภาพที่​่� 2.5 ภาพเลย์​์เอาท์​์ สิ​ินค้​้า เพื่​่�อให้​้เห็​็นภาพคร่​่าวๆ ก่​่อนนำำ�ไป

ยั​ังขั้​้�นต่​่อไป

หน้​้า 36 36 37 37 38 38 39 40 40 41 42 42 43 44 46 47 50

สารบั​ั ญ ภาพ (ต่​่ อ ) ภาพ

ภาพที่​่� 2.6 ภาพเลย์​์เอาท์​์ที่​่�ออกแบบเสร็​็จสมบู​ูรณ์​์

ภาพที่​่� 2.7 ตั​ัวอย่​่าง Hand written font

ภาพที่​่� 2.8 ตั​ัวอย่​่างงานอิ​ินเตอร์​์แอ็​็คที​ีฟกราฟิ​ิก

ภาพที่​่� 2.9 โครงสร้​้างเว็​็บไซต์​์

ภาพที่​่� 2.10 โฮมเพจ index.php

ภาพที่​่� 2.11 การเชื่​่�อมโยงของเว็​็บเพจ

ภาพที่​่� 2.12 นามสกุ​ุลของเว็​็บไซต์​์เพื่​่�อขอพื้​้�นที่​่�

ภาพท่ี่​่� 2.13 การพิ​ิมพ์​์ที่​่�อยู่​่�เว็​็บไซต์​์ตรง Address bar

ภาพที่​่� 2.14 ตั​ัวอย่​่างงานสตอรี่​่�บอร์​์ด

ภาพที่​่� 2.15 ภาพสร้​้างโดยใช้​้วิ​ิธี​ีสต็​็อปโมชั​ัน

ภาพที่​่� 2.16 สตอรี่​่�บอร์​์ดงานโฆษณา

ภาพที่​่� 2.17 ตั​ัวอย่​่างงานสตอรี่​่�บอร์​์ดงานภาพยนตร์​์

ภาพที่​่� 2.18 การออกแบบเชิ​ิงเรี​ียบง่​่าย สามารถจดจำำ�ได้​้ง่​่าย

ภาพที่​่� 2.19 โลโก้​้บริ​ิษั​ัท APPLE สื่​่�อในเชิ​ิงเอกลั​ักษณ์​์ขององค์​์กร

ภาพที่​่� 2.20 การออกแบบเหมื​ือนภาพศิ​ิลปะ

ภาพที่​่� 2.21 การออกแบบที่​่�สื่​่�อสารเชื่​่�อมโยงกั​ับตั​ัวสิ​ินค้​้า

ภาพที่​่� 2.22 สั​ัญลั​ักษณ์​์แบรนด์​์ด้​้านเทคโนโลยี​ี สื่​่�อความหมายตรงตั​ัว

มี​ีทุ​ุกอย่​่างในหนึ่​่�งเดี​ียว

ภาพที่​่� 2.23 การออกแบบแบรนด์​์ ชาแนล ด้​้วยสี​ีดำำ� แสดงให้​้เห็​็นถึ​ึง

ความคลาสสิ​ิก

ภาพที่​่� 2.24 ตั​ัวอย่​่างภาพเครื่​่�องหมายการค้​้า จำำ�แนกประเภท

เครื่​่�องหมายการค้​้า เครื่​่�องหมายบริ​ิการ เครื่​่�องหมาย

ร่​่วมการค้​้า

ภาพที่​่� 2.25 การออกแบบโดยใช้​้การเชื่​่�อมโยงจุ​ุด เส้​้น ระนาบ

หน้​้า 51 52 53 56 55 56 57 58 60 61 61 62 64 65 65 65 66 66 67 69

สารบั​ั ญ ภาพ (ต่​่ อ ) ภาพ

ภาพที่​่� 2.26 การออกแบบสร้​้างลู​ูกเล่​่นให้​้กั​ับตั​ัวอั​ักษร

บทที่​่� 3 การใช้​้งานโปรแกรมคอมพิ​ิวเตอร์​์เพื่​่�อสร้​้างสรรค์​์สื่​่�อ

ภาพที่​่� 3.1 Logo โปรแกรม Photoshop

ภาพที่​่� 3.2 หน้​้าต่​่างและเครื่​่�องมื​ือโปรแกรม Adobe Photoshop

ภาพที่​่� 3.3 การออกแบบลั​ักษณะตั​ัวอั​ักษร

ภาพที่​่� 3.4 การออกแบบลั​ักษณะตั​ัวอั​ักษร

ภาพที่​่� 3.5 การนำำ�ภาพพื้​้�นหลั​ังใส่​่ในตั​ัวอั​ักษร

ภาพที่​่� 3.6 Logo โปรแกรม Illustrator การนำำ�ภาพพื้​้�นหลั​ังใส่​่

ในตั​ัวอั​ักษร

ภาพที่​่� 3.7 เครื่​่�องมื​ือการใช้​้งานโปรแกรม Adobe Illustrator

ภาพที่​่� 3.8 Logo โปรแกรม Adobe InDesign

ภาพที่​่� 3.9 เครื่​่�องมื​ือการใช้​้งานโปรแกรม Adobe Illustrator

ภาพที่​่� 3.10 นิ​ิตยสาร VOGUE เป็​็นเรื่​่�องเกี่​่�ยวกั​ับแฟชั่​่�น

ภาพที่​่� 3.11 การออกแบบใบปลิ​ิว

ภาพที่​่� 3.12 แผ่​่นพั​ับ ประเภท 3 ทบ

ภาพที่​่� 3.13 ตั​ัวอย่​่างแผ่​่นพั​ับ

ภาพที่​่� 3.14 โปสเตอร์​์งานปั​ัจฉิ​ิมนิ​ิเทศนั​ักศึ​ึกษา

ภาพที่​่� 3.15 องค์​์ประกอบของการออกแบบโปสเตอร์​์

หน้​้า 70 76 77 78 79 80 81 82 83 83 85 87 88 89 91 92 93

สารบั​ั ญ ภาพ (ต่​่ อ ) ภาพ บทที่​่� 4 เทคนิ​ิคการออกแบบคอมพิ​ิวเตอร์​์กราฟิ​ิก

ภาพที่​่� 4.1 Computer Graphics ภาพที่​่� 4.2 ภาพราสเตอร์​์ ภาพที่​่� 4.3 ภาพเวกเตอร์​์ ภาพที่​่� 4.4 ภาพไฟล์​์นามสกุ​ุลต่​่างๆ ภาพที่​่� 4.5 ตั​ัวอย่​่างนามสกุ​ุลไฟล์​์ภาพ ภาพที่​่� 4.6 ภาพการ์​์ตู​ูน 2 มิ​ิติ​ิ ภาพที่​่� 4.7 ภาพการ์​์ตู​ูน 3 มิ​ิติ​ิ

บทที่​่� 5 รู​ูปแบบการนำำ�เสนอข้​้อมู​ูลผ่​่านสื่​่�อ

ภาพที่​่� 5.1 วิ​ิธี​ีพิ​ิมพ์​์เอกสาร PDF ภาพที่​่� 5.2 PDF icon ภาพที่​่� 5.3 สมุ​ุดทำำ�มื​ือ ภาพที่​่� 5.4 กระดาษด้​้าน ภาพที่​่� 5.5 นามบั​ัตรปั้​้�มนู​ูน ภาพที่​่� 5.6 สี​ีผงหมึ​ึก ภาพที่​่� 5.7 การเผยแพร่​่งานทางออนไลน์​์ ภาพที่​่� 5.8 Flickr.com

หน้​้า 103 104 105 106 109 110 111 117 118 122 124 125 127 128 130

01

หลั​ักการการออกแบบ กระบวนการคิ​ิดเบื้​้�องต้​้น

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

นอกจากแนวคิ​ิดที่​่�ดี​ี ยั​ังต้​้องมี​ีองค์​์ประกอบอื่​่�นๆ ที่​่�เป็​็นส่​่วนประกอบสำำ�หรั​ับทำำ�ให้​้เกิ​ิด งานกราฟิ​ิกที่​่�ดี​ีกระบวนการคิ​ิดก็​็ถื​ือว่​่าเป็​็นอี​ีกส่​่วนหนึ่​่�งในส่​่วนประกอบสำำ�คั​ัญนั้​้�น

กระบวนการคิ​ิดสร้​้างสรรค์​์เบื้​้�องต้​้น

ความคิ​ิดสร้​้างสรรค์​์เป็​็นสิ่​่ง� ที่​่�นักั จิ​ิตวิทิ ยาและนั​ักประสาทวิ​ิทยา สนใจและศึกึ ษามาอย่​่าง ยาวนาน เป็​็นการศึกึ ษาเพื่​่อ� หาที่​่�มาของความคิ​ิดสร้​้างสรรค์​์ว่า่ เกิ​ิดขึ้​้น� ได้​้อย่​่างไร ซึ่ง�่ ความคิ​ิด สร้​้างสรรค์​์เกิ​ิดขึ้​้น� ที่​่�สมองซี​ีกขวาเท่​่านั้​้น� แต่​่ปัจั จุ​ุบันั ได้​้มีกี ารศึกึ ษาการทำำ�งานของสมองและพบว่​่า หากพยายามจะคิ​ิดสร้​้างสรรค์​์โดยใช้​้สมองซี​ีกขวาเพี​ียงด้​้านเดี​ียว ก็​็จะได้​้แต่​่ความคิ​ิดที่​่�พูดู ได้​้แต่​่ทำ�ำ ไม่​่ได้​้ ด้​้วยเหตุ​ุนี้​้ก� ารเกิ​ิดความคิ​ิดสร้​้างสรรค์​์จึ​ึงเกิ​ิดจากการทำำ�งานของสมองซี​ีกซ้​้ายและซี​ีกขวา (เสาวนี​ีย์​์ พิ​ิสิฐิ านุ​ุสรณ์​์, 2553 : ออนไลน์​์)

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

-1-

นิ​ิยามของความคิ​ิดสร้​้างสรรค์​์

Dr. Edward de Bono, นั​ักจิ​ิตวิทิ ยาผู้​้�เชี่​่ย� วชาญ ด้​้านการคิ​ิดสร้​้างสรรค์​์ ผู้​้�ซึ่ง�่ เชื่​่อ� ว่​่า “ความคิ​ิดสร้​้างสรรค์​์ เป็​็นทั​ักษะที่​่�พั​ัฒนาได้​้” ได้​้ให้​้ความเห็​็นไว้​้ว่​่า

ความคิ​ิดสร้​้างสรรค์​์สามารถเรี​ียนรู้​้�ได้​้ ไม่​่เกี่​่ย� ว กั​ับพรสวรรค์​์ส่ว่ นตั​ัว ความคิ​ิดสร้​้างสรรค์​์ไม่​่ได้​้เกิ​ิดจาก แรงบั​ันดาลใจ เพี​ียงเท่​่านั้​้�น ความคิ​ิดสร้​้างสรรค์​์เป็​็น มากกว่​่าการคิ​ิดแตกต่​่าง ความคิ​ิดสร้​้างสรรค์​์จำำ�เป็​็น ต้​้ อ งมี​ี ห รื​ือเป็​็ น เรื่​่� อ งของการเพิ่​่� ม มู​ู ลค่​่ า ส่​่ ว นการ คิ​ิ ด นอกกรอกเป็​็ น การหนี​ี ก ารถู​ู ก ห้​้ า มเปลี่​่� ย นแนว ความคิ​ิด ภาพที่​่� 1.1 Dr. Edward de Bono นั​ักจิ​ิตวิ​ิทยาด้​้านการคิ​ิดสร้​้างสรรค์​์ เชื่​่�อว่​่า “ความคิ​ิดสร้​้างสรรค์​์เป็​็นทั​ักษะที่​่�พั​ัฒนาได้​้”

การเชื่​่�อมโยงการทำำ�งานของสมองสองซี​ีก

การใช้​้สมองเพี​ียงซี​ีกเดี​ียวส่​่งผลต่​่อความรู้​้�ความสามารถที่​่�ไม่​่เกิ​ิดประโยชน์​์ ผู้​้�ที่​่�ใช้​้สมอง ซี​ีกซ้​้ายอย่​่างเดี​ียวจะมี​ีความบกพร่​่องในเรื่​่�องของการเข้​้าสั​ังคม การใช้​้ชี​ีวิ​ิตในสั​ังคมมั​ักอยู่​่�ร่​่วมกั​ับ ผู้​้�อื่​่�นไม่​่ค่​่อยได้​้ มี​ีความเป็​็นตั​ัวตนสู​ูง แต่​่ถ้​้าบุ​ุคคลใดใช้​้สมองซี​ีกขวาเพี​ียงซี​ีกเดี​ียวจะเป็​็นบุ​ุคคลที่​่� ใช้​้อารมณ์​์มากกว่​่าเหตุ​ุผล ขาดความรู้​้�ความสามารถทางด้​้านการคิ​ิดวิ​ิเคราะห์​์ ขาดความสามารถ ทางด้​้านการจดจำำ� และมี​ีโอกาสในการตั​ัดสิ​ินใจผิ​ิดพลาดมากกว่​่าบุ​ุคคลที่​่�ใช้​้สมองซี​ีกซ้​้าย หาก บุ​ุคคลใดมี​ีการใช้​้สมองทั้​้�งสองซี​ีกจะส่​่งผลดี​ีต่​่อการดำำ�เนิ​ินชี​ีวิ​ิตทำำ�ให้​้การใช้​้ชี​ีวิ​ิตอยู่​่�ร่​่วมกั​ันใน สั​ังคมไม่​่มี​ีปั​ัญหา ดั​ังนั้​้�นทุ​ุกกิ​ิจกรรมทางการคิ​ิดของมนุ​ุษย์​์เกิ​ิดจากสมองทั้​้�งสองซี​ีกจะคิ​ิดสลั​ับกั​ัน ไปมาระหว่​่างสมองซี​ีกซ้​้ายกั​ับสมองซี​ีกขวา บางกิ​ิจกรรมจะเน้​้นหนั​ักที่​่�ซี​ีกใดซี​ีกหนึ่​่�งตามความ ถนั​ัด (เกรี​ียงศั​ักดิ์​์� เจริ​ิญวงศ์​์ศั​ักดิ์​์�, 2545: 12 อ้​้างอิ​ิงจาก Hellige,1990 : 41) ในการพั​ัฒนาความ คิ​ิดสร้​้างสรรค์​์จึ​ึงจำำ�เป็​็นต้​้องพั​ัฒนาทั้​้�งในด้​้านของการใช้​้เหตุ​ุผลและการสร้​้างสรรค์​์ไปพร้​้อมๆ กั​ัน จึ​ึงไม่​่สามารถแยกพั​ัฒนาทั​ักษะแต่​่ละด้​้านได้​้ ดั​ังภาพ การเชื่​่�อมโยงการทำำ�งานของสมองสองซี​ีก

-2-

ภาพที่​่� 1.2 การเชื่​่�อมโยงการทำำ�งานของสมองซี​ีกซ้​้าย กั​ับสมองซี​ีกขวา ที่​่�มา : นุ​ุจรี​ี บุ​ุรี​ีรั​ัตน์​์ (2564)

จากภาพข้​้างต้​้น เป็​็นการเชื่​่�อมโยงการทำำ�งานของสมองสองซี​ีก จะเห็​็นได้​้ว่​่าการทำำ� งานของสมองทั้​้�งสองซี​ีกจะทำำ�งานร่​่วมกั​ันมี​ีการเชื่​่�อมต่​่อความสั​ัมพั​ันธ์​์กั​ัน แต่​่จะมี​ีรู​ูปแบบของ การประมวลผลที่​่�ต่​่างกั​ัน นั​ักวิ​ิจั​ัยพบว่​่าบุ​ุคคลจะใช้​้สมองส่​่วนใดขึ้​้�นอยู่​่�กั​ับกิ​ิจกรรมที่​่�บุ​ุคคลนั้​้�นทำำ� บางคนนั้​้�นมี​ีทั​ักษะและความสามารถที่​่�บ่​่งบอกได้​้ว่​่าใช้​้สมองด้​้านหนึ่​่�งมากกว่​่าอี​ีกด้​้านหนึ่​่�ง อย่​่างไรก็​็ตามทั​ักษะกระบวนการคิ​ิดส่​่วนใหญ่​่แล้​้วจำำ�เป็​็นต้​้องใช้​้การทำำ�งานของสมองทั้​้�งสองซี​ีก ประสานกั​ัน สิ่​่�งสำำ�คั​ัญที่​่�ทำำ�ให้​้การคิ​ิดมี​ีประสิ​ิทธิ​ิภาพขึ้​้�นอยู่​่�กั​ับความกลมกลื​ืนของการประสาน กั​ันของสมองทั้​้�งสองซี​ีก (รุ​ุจิ​ิรั​ัตน์​์ บั​ัวลา, 2546 : 27-28) การที่​่�บุ​ุคคลสามารถใช้​้สมองทั้​้�ง 2 ซี​ีก ทำำ�งานได้​้อย่​่างทั​ัดเที​ียมกั​ันจะทำำ�ให้​้บุ​ุคคลนั้​้�นสามารถคิ​ิดวิ​ิเคราะห์​์ สั​ังเคราะห์​์ และแก้​้ปั​ัญหา ได้​้ดี​ีกว่​่าบุ​ุคคลที่​่�ถนั​ัดใช้​้สมองซี​ีกใดซี​ีกหนึ่​่�งในการทำำ�งาน

-3-

เทคนิ​ิควิ​ิธี​ีคิ​ิดเบื้​้�องต้​้นเพื่​่�อการออกแบบอย่​่างเป็​็นระบบ

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

2. การตี​ีความโจทย์​์ คื​ือ การเอากรอบความคิ​ิดหนึ่​่�งไปมองอี​ีกสิ่​่ง� หนึ่​่ง� โดย กรอบความคิ​ิดนั้​้น� มี​ีการเลื​ือกอย่​่างเหมาะสม เพราะความน่​่าสนใจของการตี​ีความก็​็คื​ือ การ เลื​ือกกรอบให้​้เหมาะสมนั่​่�นเอง

3. เนื้​้�อหาจากการวิ​ิจั​ัย อาจจะเป็​็นเรื่​่�องของกลุ่​่�มเป้​้าหมายว่​่าเป็​็นใคร แบ่​่งเป็​็น เพศ ชาย หญิ​ิง หรื​ือบุ​ุคคลทั่​่�วไป มี​ีช่​่วงอายุ​ุเท่​่าใด นิ​ิสิ​ิตนั​ักศึกึ ษาหรื​ือเฉพาะกลุ่​่�มสนใจ ข่​่าวสาร ที่​่�ให้​้มี​ีระดั​ับความยาก-ง่​่าย หรื​ือมี​ีความเป็​็นสากลหรื​ือไม่​่ หรื​ือเจาะจงเฉพาะคนในประเทศหรื​ือ ชาวต่​่างชาติ​ิ ซึ่​่�งผู้​้�ออกแบบจำำ�เป็​็นจะต้​้องรู้​้�และเข้​้าใจเพื่​่�อวางแผน ดำำ�เนิ​ินการกั​ับข่​่าวสาร ออกแบบ และการนำำ�เสนอให้​้ตรงจุ​ุดกั​ับกลุ่​่�มเป้​้าหมายที่​่�ต้​้องการได้​้ถู​ูกต้​้อง

4. แนวความคิ​ิด มาจากการค้​้นคว้​้าเนื้​้�อหาแล้​้วนำำ�มารวบยอด เป็​็นเรื่​่�องยากที่​่� จะจำำ�กั​ัดว่​่า แนวความคิ​ิดควรนั้​้�นมาจากไหน เพราะเราสามารถดึ​ึงอะไรที่​่�น่​่าสนใจในเนื้​้�อหามา เป็​็นแนวความคิ​ิดได้​้ทั้​้�งสิ้​้�น แต่​่แนวความคิ​ิดนั้​้�นมั​ักเป็​็นที่​่�มาของตั​ัวแสดงออกมาอยู่​่�เสมอๆ

5. ตั​ัวแสดงออก เป็​็นสิ่​่�งที่​่�สื​ืบค้​้นจากเนื้​้�อหา ถ้​้าขาดตั​ัวแสดงออกก็​็จะขาด เครื่​่�องมื​ือในการสื่​่�อสาร ปกติ​ิพื้​้�นฐานตั​ัวแสดงออกที่​่�ง่​่ายที่​่�สุ​ุดคื​ือ ตั​ัวอั​ักษรในภาษาเขี​ียน

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

- 4-

กระบวนการคิ​ิดสร้​้างสรรค์​์สำำ�หรั​ับการออกแบบ

1. การทำำ�ความเข้​้าใจเกี่​่�ยวกั​ับปั​ัญหา (First insight) คื​ือ ระยะที่​่�เข้​้าใจถึ​ึงปั​ัญหาที่​่�ได้​้ รั​ับและพร้​้อมที่​่�จะทำำ�การแก้​้ไขปั​ัญหา การสร้​้างความเข้​้าใจเกี่​่�ยวกั​ับโจทย์​์หรื​ือปั​ัญหาเป็​็นขั้​้�น ตอนสำำ�คั​ัญในการออกแบบ เพราะปั​ัญหาในการออกแบบไม่​่ชั​ัดเจน จำำ�เป็​็นต้​้องใช้​้ความพยายาม ในการทำำ�ให้​้เกิ​ิดความเข้​้าใจอย่​่างถ่​่องแท้​้

2. การเตรี​ียมการ (Preparation) คื​ือ ความพยายามที่​่�จะสร้​้างความคิ​ิดสำำ�หรั​ับการ แก้​้ไขอย่​่างรู้​้�ตั​ัว เป็​็นขั้​้�นตอนที่​่�มี​ีความสำำ�คั​ัญ และเป็​็นช่​่วงระยะที่​่�ต้​้องทำำ�งานหนั​ัก เพราะการเกิ​ิด ความคิ​ิดขึ้​้�นมาไม่​่ใช่​่เรื่​่�องบั​ังเอิ​ิญ แต่​่เป็​็นผลจากการใาช้​้เวลาของการเตรี​ียมการ การศึกึ ษา และ การทำำ�งานที่​่�มุ่​่�งมั่​่�นเกี่​่�ยวกั​ับปั​ัญหาเป็​็นเวลานาน จนจิ​ิตใจถู​ูกบรรจุ​ุไว้​้ด้​้วยเนื้​้�อหาเรื่​่�องราวของ ปั​ัญหาได้​้มากที่​่�สุ​ุด

3. การฟั​ักตั​ัวของความคิ​ิด (Incubation) คื​ือ ระยะของความสงบและหยุ​ุดพั​ักความ พยายามใช้​้ความคิ​ิดอย่​่างตั้​้�งใจ เป็​็นการถอนตั​ัวออกจาปั​ัญหาชั่​่�วระยะหนึ่​่�ง โดยหั​ันไปทำำ�อย่​่าง อื่​่�นเพื่​่�อปล่​่อยให้​้จิ​ิตใต้​้สำำ�นึ​ึกได้​้ทำ�ำ งานในการดึ​ึงความรู้​้� ประสบการณ์​์เก็​็บไว้​้ขึ้​้�นมาใช้​้ในการเสนอ แนวทางแก้​้ปั​ัญหา

4. การเกิ​ิดประกายความคิ​ิด (Illumination) คื​ือ การทำำ�งานของจิ​ิตใต้​้สำำ�นึ​ึกผสม ผสานกั​ับจิ​ินตนาการและความชาญฉลาดเฉพาะตั​ัว ช่​่วยส่​่งประกายความคิ​ิดที่​่�น่​่าจะเป็​็นเกี่​่�ยว กั​ับวิ​ิธี​ีการแก้​้ปั​ัญหาเข้​้ามาในช่​่วงที่​่�ไม่​่คาดหวั​ัง หากไม่​่ได้​้รั​ับการเอาใจใส่​่ความคิ​ิดนั้​้�นก็​็อาจจะ หายไป ประกายความคิ​ิดนี้​้�เป็​็นเพี​ียงจุ​ุดเริ่​่�มต้​้นเท่​่านั้​้�นยั​ังขาดรายละเอี​ียดและความสมบู​ูรณ์​์ พอที่​่�จะนำำ�ไปใช้​้งานจริ​ิง

5. การพั​ัฒนาให้​้สั​ัมฤทธิ​ิผล (Verification) คื​ือ ระยะสุ​ุดท้​้ายเพื่​่�อทำำ�ให้​้สิ่​่�งที่​่�คิ​ิดได้​้แล้​้ว สั​ัมฤทะิ​ิผลในการนำำ�ไปใช้​้แก้​้ปั​ัญหาด้​้วยการนำำ�ข้​้อมู​ูล ความรู้​้� และความชำำ�นาญต่​่าง ๆ มาตรวจ สอบพั​ัฒนาและแก้​้ไขทำำ�ให้​้แนวความคิ​ิดมี​ีความชั​ัดเจนและรอบคอบมากขึ้​้�น จะทำำ�ให้​้เกิ​ิดการ เปลี่​่�ยนจากการเป็​็นแค่​่แนวความคิ​ิดให้​้กลายเป็​็นต้​้นแบบสำำ�หรั​ับการผลิ​ิตแะจำำ�หน่​่ายต่​่อไป (นวลน้​้อย บุ​ุญวงศ์​์, 2539 : 161-163)

-5-

วิ​ิธี​ีการออกแบบเบื้​้�องต้​้น

ความลงตั​ัวและการแสดงออกที่​่ส� วยงาม คื​ือหั​ัวใจสำำ�คัญั ประการหนึ่​่ง� ของการออกแบบ เบื้​้�องต้​้น ความลงตั​ัวมี​ีหลายรู​ูปแบบ แต่​่โดยเบื้​้�องต้​้นจะกล่​่าวถึ​ึง 2 รู​ูปแบบ คื​ือ

1. ความลงตั​ัวของเหตุ​ุผล หมายถึ​ึงการใช้​้ตรรกะที่​่ส� มเหตุ​ุสมผลตามบริ​ิบท ที่​่�ควรจะเป็​็น

2. ความลงตั​ัวของฟอร์​์ม คื​ือการที่​่�มี​ีฟอร์​์มลั​ักษณะร่​่วมกั​ันบางอย่​่าง ความลงตั​ัวอื่​่�นๆ คื​ือความลงตั​ัวในแบบต่​่าง ๆ ตามสถานการณ์​์ต่​่างๆ

ภาพที่​่� 1.3 การออกแบบโดยใช้​้ตั​ัวอั​ักษรเชื่​่�อมโยงกั​ับภาพ ที่​่�มา : http://calligramdesigners.blogspot.com (2018)

-6-

ความหมายและแนวคิ​ิดในการออกแบบ

ภาษาภาพกั​ับความหมาย

ภาษาภาพ คื​ือ ภาษาที่​่�ใช้​้ภาพ หรื​ือ สิ่​่�งที่​่�มองเห็​็น แทนความหมายที่​่�ต้​้องการจะสื่​่�อสาร ภาพเป็​็นภาษาได้​้โดยอาศั​ัยเงื่​่�อนไขดั​ังต่​่อไปนี้​้�

1. โดยธรรมชาติ​ิ คื​ือ ความสามารถในการมองเห็​็น สั​ัตว์​์ทุ​ุกชนิ​ิดที่​่�มองเห็​็นก็​็จะมี​ีรู้​้� ภาษาภาพ ภาษาภาพเป็​็นภาษาธรรมชาติ​ิ (ภาษาถ้​้อยคำำ�ไม่​่เป็​็นภาษาธรรมชาติ​ิ ต้​้องเรี​ียนจึ​ึงจะ เข้​้าใจ เช่​่น เราฟั​ังเราอ่​่านภาษาญี่​่�ปุ่​่�นไม่​่รู้​้�เรื่​่�อง เพราะเราไม่​่ได้​้เรี​ียนภาษาญี่​่�ปุ่​่�น) การมองเห็​็นนั้​้�น เป็​็นการทำำ�งานร่​่วมกั​ันของอวั​ัยวะ 2 ส่​่วน คื​ือ ตา กั​ับ สมอง ตา ทำำ�หน้​้าที่​่�รั​ับภาพและส่​่ง สั​ัญญาณภาพไปยั​ังสมอง สมองทำำ�หน้​้าที่​่�ตี​ีความ การตี​ีความของสมองได้​้แก่​่ทฤษฎี​ีต่​่างๆ ทาง จิ​ิตวิ​ิทยา เช่​่น รู​ูปกั​ับพื้​้�น (Figure & Ground), เก๊​๊สต๊​๊าลท์​์ (Gestalt), กระบวนการเลื​ือกสรร (Selective Process), ความโน้​้มเอี​ียงของการรั​ับรู้​้� (Perception Tendency) 2. โดยประสบการณ์​์ เช่​่น ประสบการณ์​์ที่​่�เคยเห็​็นว่​่าของที่​่�มี​ีขนาดใหญ่​่หนั​ักกว่​่าของที่​่�มี​ี ขนาดเล็​็ก, คนตั​ัวใหญ่​่มี​ีกำำ�ลั​ังมากกว่​่าคนตั​ัวเล็​็ก การรั​ับรู้​้�เรื่​่�องขนาดจึ​ึงกลายเป็​็นรหั​ัสหรื​ือความ หมายของน้ำำ��หนั​ักและอำำ�นาจ; ประสบการณ์​์กิ​ินกล้​้วยดิ​ิบ (เปลื​ือกสี​ีเขี​ียว) แล้​้วฝาด กิ​ินไม่​่ได้​้ ต่​่อ มาเมื่​่�อกล้​้วยสุ​ุก (เปลื​ือกสี​ีเหลื​ือง) เอามากิ​ินได้​้อร่​่อยดี​ี การรั​ับรู้​้�เรื่​่�องสี​ี ประสบการณ์​์การมองเห็​็น แต่​่ละภาพ (หรื​ือเรื่​่�อง)นำำ�ไปสู่​่�ความเข้​้าใจหรื​ือความหมายแต่​่ละอย่​่าง สั่​่�งสมเป็​็นภาษาภาพ

ภาพที่​่� 1.4 การออกแบบโดยใช้​้คำำ�พู​ูดปรากฏในภาพ ที่​่�มา : http://www.cartoonlanguage.org (2020)

-7-

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

ภาพที่​่� 1.5 การเปรี​ียบเหมื​ือนนก มี​ีอิ​ิสระ แต่​่พอขี​ีดเส้​้น ก็​็เหมื​ือนเป็​็นลวดหนาม ที่​่�มา : https://board.postjung.com/ (2020)

-8-

ภาพที่​่� 1.6 การออกแบบภาพที่​่�สื่​่�อให้​้ผู้​้�ดู​ูโดยการเห็​็นภาพจากสายตา ที่​่�มา : http://watkadarin.com (2018)

จิ​ิตวิ​ิทยาการรั​ับรู้​้�ทางตา

งานกราฟิ​ิกดี​ีไซน์​์เป็​็นการใช้​้ประสาทสั​ัมผั​ัสของการรั​ับรู้​้�ทางตาเป็​็นส่​่วนใหญ่​่ เพราะ ฉะนั้​้�นจึ​ึงอาจกล่​่าวได้​้ว่​่า จิ​ิตวิ​ิทยาการรั​ับรู้​้�ทางตานั้​้�นเป็​็นศาสตร์​์สำำ�คั​ัญที่​่�เกี่​่�ยวข้​้องกั​ับกราฟิ​ิก ดี​ีไซน์​์อย่​่างมาก

ในทางจิ​ิตวิ​ิทยามี​ีส่​่วนที่​่�เกี่​่�ยวข้​้องกั​ับงานกราฟิ​ิกทั้​้�งทางตรงและทางอ้​้อม โดยจะยึ​ึด กลุ่​่�มเกสตั​ัลท์​์เป็​็นหลั​ัก ดั​ังนี้​้�

รู​ูปและพื้​้�น (Figure and Ground)

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

-9-

คุ​ุณลั​ักษณะที่​่�จะทำำ�ให้​้เกิ​ิดเป็​็นรู​ูปและพื้​้�นรู​ูป

Edgar John Rubin (1886-1951) นั​ักจิ​ิตวิ​ิทยาชาวเดนมาร์​์ก ได้​้ให้​้คุ​ุณสมบั​ัติ​ิของการ รั​ับรู้​้�ด้​้านการมองเห็​็นว่​่า บริ​ิเวณพื้​้�นที่​่�ส่​่วนไหนที่​่�เรี​ียกว่​่ารู​ูป ส่​่วนไหนเรี​ียกว่​่าพื้​้�นรู​ูป

1. ถ้​้าภาพนั้​้�นมี​ี 2 ส่​่วนที่​่�แตกต่​่างกั​ัน บริ​ิเวณส่​่วนที่​่�เล็​็กกว่​่าและอยู่​่�ตรงกลางและจะมี​ี แนวโน้​้มของการถู​ูกมองเห็​็นเป็​็นรู​ูปมากกว่​่า ส่​่วนที่​่�อยู่​่�ล้​้อมรอบจะถู​ูกมองเห็​็นเป็​็นพื้​้�นรู​ูป

2. ถ้​้าส่​่วนหนึ่​่�งมี​ีการเรี​ียงตั​ัวกั​ันในแนวตั้​้�งและแนวนอน จะมี​ีแนวโน้​้มเห็​็นสี​ีดำำ�เป็​็นรู​ูป และมองเห็​็นสี​ีขาวเป็​็นพื้​้�นรู​ูป แต่​่พอหมุ​ุนภาพให้​้ส่​่วนสี​ีขาวอยู่​่�ในแนวตั้​้�งและแนวนอนดั​ังภาพ ตั​ัวอย่​่าง คื​ือ จะมองเห็​็นสี​ีขาวเป็​็นรู​ูป ส่​่วนสี​ีดำำ�กลั​ับกลายเป็​็นพื้​้�น

3. ส่​่วนที่​่�มี​ีขนาดเล็​็กกว่​่าจะถู​ูกมองว่​่าเป็​็นรู​ูป จะมองเห็​็นเป็​็นกากบาท ที่​่�ประกอบ ด้​้วยเส้​้นตรงจากจุ​ุดศู​ูนย์​์กลาง ทั้​้�งๆ ที่​่�ส่​่วนเส้​้นโค้​้งซึ่�ง่ เป็​็นพื้​้�นอยู่​่�เบื้​้�องหลั​ังเรี​ียงตั​ัวในแนวตั้​้�งและ แนวนอน

4. ส่​่วนที่​่�มี​ีลั​ักษณะสมมาตรมากที่​่�สุ​ุดจะมองเห็​็นเป็​็นรู​ูป

ภาพที่​่� 1.7 การจั​ัดรู​ูปแบบภาพที่​่�มี​ีความจำำ�เป็​็นในการรั​ับรู้​้�วั​ัตถุผุ่ ่านการมอง ที่​่�มา : https://en.wikipedia.org/wiki/Edgar_Rubin (2564)

- 10 -

การรั​ับรู้​้�ทางสายตา การสั​ัมผั​ัสรั​ับรู้​้�ในมิ​ิติ​ิมุ​ุมมองของมนุ​ุษย์​์ การที่​่�จะเข้​้าใจในสิ่​่�งหนึ่​่�งนั้​้�น มนุ​ุษย์​์มี​ีหลากหลายรู​ูปแบบแตกต่​่างกั​ันไป แต่​่ละคนมี​ีขอบเขตและบรรทั​ัดฐาน ความซั​ับซ้​้อนใน มุ​ุมมองไม่​่เท่​่ากั​ันขึ้​้�นอยู่​่�กั​ับประสบการณ์​์ของแต่​่ละบุ​ุคคล กระบวนการในการรั​ับรู้​้�คื​ือส่​่วนสำำ�คั​ัญ ในการช่​่วยให้​้การรั​ับรู้​้�มี​ีความสมบู​ูรณ์​์มากยิ่​่�งขึ้​้�น เพื่​่�อให้​้เกิ​ิดการค้​้นหาคำำ�ตอบใหม่​่จากมุ​ุมมองที่​่� แตกต่​่างไปจากเดิ​ิม โดยการใช้​้งานออกแบบเป็​็นสื่​่�อกลางในการสร้​้างมุ​ุมมอง และทั​ัศนคติ​ิของ การรั​ับรู้​้�ที่​่�แตกต่​่างไปจากเดิ​ิมสู่​่�งานศิ​ิลปะ สร้​้างแรงผลั​ักดั​ันให้​้เกิ​ิดการรวมและการต่​่อยอดจาก ทฤษฎี​ีระหว่​่างศาสตร์​์ทางทั​ัศนศิ​ิลป์​์และศาสตร์​์การออกแบบ และสร้​้างประสบการณ์​์ใหม่​่ของ การรั​ับรู้​้�ทางศิ​ิลปะ มนุ​ุษย์​์ใช้​้วิ​ิธี​ีการเห็​็นจากประสบการณ์​์การรั​ับรู้​้�ที่​่�คุ้​้�นเคย ปราศจากความคิ​ิด และการพิ​ิจารณาในการตั​ัดสิ​ินสิ่​่�งที่​่�เห็​็น มากกว่​่าวิ​ิธี​ีการมอง (ศุ​ุภรา อรุ​ุณศรี​ีมรกต : 2561)

การรั​ับรู้​้�เนื่​่�องจากประสบการณ์​์

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

ภาพที่​่� 1.8 การกระตุ้​้�นการรั​ับรู้​้�ผู้​้�ดู​ูให้​้มี​ีความรู้​้�สึ​ึกหิ​ิว ที่​่�มา : jarm-จาม (2018)

- 11 -

การปิ​ิด

หมายถึ​ึงความรู้​้�สึ​ึกปิ​ิด และกำำ�ลั​ังจะปิ​ิด ซึ่​่�งเป็​็นผลมาจากเส้​้นประสาททางสายตา และ ประสบการณ์​์ของผู้​้�ดู​ู เช่​่น เรามองคี​ีมเหล็​็กแล้​้วรู้​้�สึ​ึกว่​่า มั​ันกำำ�ลั​ังจะหนี​ีบกั​ัน เป็​็นต้​้น

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

ความต่​่อเนื่​่�อง

เป็​็นการจั​ัดลำำ�ดับสิ่​่ ั ง� ที่​่�มองเห็​็น ไม่​่ว่า่ จะเป็​็นแนวโค้​้ง หรื​ือแนวตรง ตั​ัวอย่​่างการต่​่อเนื่​่อ� งที่​่� เห็​็นได้​้ชั​ัดเจน เช่​่น รุ้​้�งกิ​ินน้ำ� หรื​ือเครื่​่�องหมายจราจรต่​่างๆ

ความคล้​้ายคลึ​ึงกั​ัน

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

ร่​่องรอย ร่​่องรอยจะเกี่​่�ยวข้​้องกั​ับกราฟิ​ิก ตรงที่​่�นั​ักออกแบบจะต้​้องเข้​้าใจในเรื่​่�องของการทิ้​้�งร่​่อง รอยเป็​็นพื้​้�นฐานในการออกแบบ เช่​่น เมื่​่�อมี​ีไฟแล้​้วจะต้​้องเกิ​ิดควั​ัน หรื​ือเมื่​่�อเราดำำ�น้ำำ��ก็​็จะมี​ีฟอง อากาศปรากฏขึ้​้�นมา

ภาพติ​ิดตา

เป็​็นการมองสิ่​่�งใดๆ ที่​่�เป็​็นเวลานานๆ เราจะยั​ังมองสิ่​่ง� นั้​้น� ต่​่อไปอี​ีก แม้​้ว่า่ เราจะเปลี่​่�ยน สายตาไปที่​่�อื่​่�นแล้​้วก็​็ตาม นั้​้�นคื​ือ การเกิ​ิดสิ่​่�งที่​่�เรี​ียกว่​่า ภาพติ​ิดตา เมื่​่�อเป็​็นเช่​่นนี้​้� เราก็​็สามารถ นำำ�ภาพติ​ิดตาไปเป็​็นแนวคิ​ิดในการออกแบบได้​้เหมื​ือนกั​ัน

การรั​ับรู้​้�ระยะทาง

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

- 12 -

การลวงตา

การรั​ั บรู้​้�ข องมนุ​ุ ษ ย์​์ เ ป็​็ น การคั​ั ด ลอก อย่​่างตรงไปตรงมา บางครั้​้ง� ก็​็คลุ​ุมเครื​ือบิ​ิดเบื​ือน ไปจากภาพที่​่�เป็​็นจริ​ิง แต่​่โดยสรุ​ุปแล้​้วภาพลวงตา มี​ีมากมายหลายชนิ​ิดทั้​้�งที่​่�ปรากฏขึ้​้�นจริ​ิง และ เราจิ​ินตนาการขึ้น�้ มากเอง การลวงตามั​ักจะปรากฏ ในศิ​ิลปะประเภทที่​่�มี​ีการซ้ำำ�� ๆ กั​ัน หรื​ือการใช้​้ องค์​์ประกอบทางทั​ัศนะธาตุ​ุลวงตา เช่​่น ศิ​ิลปะ แบบอ๊​๊อปอาร์​์ต (Op Art)

ภาพที่​่� 1.9 Fraser’s Spiral

ที่​่�มา : http://mathworld.wolfram.com (2018)

การเลื​ือกรั​ับรู้​้�

ในที่​่�นี้​้�ขอกล่​่าวถึ​ึง 5 สิ่​่�งเร้​้าที่​่�มี​ีผลต่​่อการเลื​ือกรั​ับรู้​้�คื​ือ

1. การเปลี่​่�ยนแปลงกะทั​ันหั​ัน

2. ความขั​ัดแย้​้ง หรื​ือความแปลก

3. ความแรงหรื​ือความเข้​้ม

4. ความซ้ำำ��

5. ความซั​ับซ้​้อน

อายุ​ุการรั​ับรู้​้�

เมื่​่อ� เราต้​้องพบกั​ับโจทย์​์ที่​่มี� ลัี กั ษณะเฉพาะสำำ�หรั​ับผู้​้�ใช้​้งานบางประเภท ดู​ูเหมื​ือนว่​่าเรื่อ�่ งของ อายุ​ุจะมี​ีปัจั จั​ัยสำำ�คัญั เช่​่น ออกแบบบรรจุ​ุภัณ ั ฑ์​์ของเล่​่นเด็​็ก หรื​ือขวดยาสำำ�หรั​ับผู้​้�สูงู อายุ​ุ เราก็​็จะต้​้อง วิ​ิจั​ัยด้​้านการรั​ับรู้​้�ของผู้​้�ใช้​้ในวั​ัยนั้​้�นๆ

การเล่​่าเรื่​่�องในงานออกแบบกราฟิ​ิก

งานกราฟิ​ิกจะมี​ีลั​ักษณะการเล่​่าเรื่​่�องเหมื​ือนสื่​่�ออื่​่�นๆ แต่​่จะเป็​็นการเล่​่าเรื่​่�องอย่​่างสั้​้�น ซึ่​่�งต่​่างจากการเล่​่าเรื่​่�องจากภาพยนตร์​์ซึ่​่�งจะเป็​็นการเล่​่าเรื่​่�องอย่​่างยาว

- 13 -

ภาพที่​่� 1.10 Vertigo ที่​่�มา : http://nuccobrain.com (2018)

ชนิ​ิดของการเล่​่าเรื่​่�องผ่​่านงานกราฟิ​ิก ชนิ​ิดของการเล่​่าเรื่​่�องผ่​่านงานกราฟิ​ิกที่​่�น่​่าสนใจ มี​ี 2 ชนิ​ิด

1. การเล่​่าเรื่​่�องอย่​่างสั้​้�น Shot Narrative เช่​่น งานออกแบบโปสเตอร์ การเล่​่า เรื่​่�องอย่​่างสั้​้�นนั้​้�น ทำำ�ให้​้เกิ​ิดความคิ​ิดที่​่�ว่​่าจะสามารถส่​่งสารในข้​้อจำำ�กั​ัดได้​้อย่​่างไร เช่​่น โปสเตอร์​์หนึ่​่�งภาพจะสามารถเล่​่าเรื่​่�องทั้​้�งหมดที่​่�เราต้​้องการสื่​่�อได้​้อย่​่างไร หรื​ือสามารถบ่​่ง บอกความรู้​้�สึ​ึกทั​ัศนคติ​ิ บุ​ุคลิ​ิกภาพ และอื่​่�นๆ ได้​้อย่​่างไร

2. การเล่​่าเรื่​่�องอย่​่างยาว Long Narrative เช่​่น งานแอนิ​ิเมชั​ัน งานหนั​ังสื​ือการ์​์ตู​ูน งานกราฟิ​ิกในหนั​ังสื​ือต่​่างๆ

- 14 -

องค์​์ประกอบในการออกแบบกราฟิ​ิก

องค์​์ประกอบต่​่างๆ สำำ�หรั​ับงานกราฟิ​ิกคื​ือ องค์​์ประกอบพื้​้�นฐานทางศิ​ิลปะที่​่�จะถู​ูกนำำ� มาใช้​้ในการออกแบบ โดยองค์​์ประกอบเหล่​่านั้​้�น แบ่​่งออกได้​้ ดั​ังนี้​้�

1. จุ​ุด เส้​้น ระนาบ

2. รู​ูปร่​่าง รู​ูปทรง ปริ​ิมาตร

3. Perspective

4. พื้​้�นผิ​ิว Texture

5. ขนาด Scale

6. สี​ี Color

จุ​ุด เส้​้น ระนาบ

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

ภาพที่​่� 1.11 จุ​ุด เส้​้น ที่​่�มา : นุ​ุจรี​ี บุ​ุรี​ีรั​ัตน์​์ (2564)

- 15 -

ภาพที่​่� 1.12 Circle in Inkscape ที่​่�มา : https://graphicdesign.stackexchange.com (2018)

จุ​ุด

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

ภาพที่​่� 1.13 การวางตำำ�แหน่​่งของจุ​ุดและการเว้​้นพื้​้�นที่​่�ระหว่​่างจุ​ุด สามารถทำำ�ให้​้รู้​้�สึ​ึก ได้​้ถึ​ึงการเพิ่​่�ม ลดความเร็​็ว ที่​่�มา : นุ​ุจรี​ี บุ​ุรี​ีรั​ัตน์​์ (2564)

- 16 -

เส้​้น

เส้​้น คื​ือ จุ​ุดที่​่ต่� อ่ เนื่​่อ� งกั​ันในทางยาว หรื​ือร่​่องรอยของจุ​ุดที่​่เ� คลื่​่อ� นไปในมิ​ิติเิ ดี​ียว ความยาว ของเส้​้นทำำ�หน้​้าที่​่เ� ป็​็นขอบเขตที่​่�ว่า่ ง ขอบเขตของสิ่​่ง� ของ ขอบเขตของรู​ูปทรง ขอบเขตของน�ำ้ หนั​ัก ขอบเขตของสี​ีและเป็​็นแกนของรู​ูปร่​่าง และรู​ูปทรง

เส้​้นขั้​้น� ต้​้น มี​ี 2 แบบคื​ือ เส้​้นตรง และเส้​้นโค้​้ง แต่​่จะพั​ัฒนาออกไปต่​่างๆ กั​ัน เช่​่น เส้​้นฟั​ันปลา เกิ​ิดจากเส้​้นตรงมาประกอบกั​ัน หรื​ือ เส้​้นคลื่​่�น เกิ​ิดจากเส้​้นโค้​้งมาประกอบกั​ัน

ภาพที่​่� 1.14 ลายเส้​้นในลั​ักษณะต่​่างๆ ที่​่�มา : นุ​ุจรี​ี บุ​ุรีรัี ัตน์​์ (2564)

ในทางเรขาคณิ​ิต เส้​้นจะไม่​่มี​ีความกว้​้าง จะมี​ีแต่​่ความยาว เส้​้นอาจเกิ​ิดจาก การเชื่​่อ� มกั​ันของจุ​ุดสองจุ​ุดที่​่ห่� า่ งกั​ันในระยะหนึ่​่ง� ก็​็ได้​้ หรื​ือในงานภาพเคลื่​่อ� นไหว เส้​้นอาจเกิ​ิดจาก การเคลื่​่�อนไหวของจุ​ุดจากบน มาล่​่าง จากซ้​้าย ไปขวา

ในทางกราฟิ​ิกเส้​้นจะมี​ีคุณ ุ สมบั​ัติต่ิ า่ งๆ ได้​้หลากหลาย เช่​่น

1. อาจมี​ีความหนา หรื​ือความบาง

2. อาจเกิ​ิดจากการเขี​ียนด้​้วยดิ​ินสอ ปากกา หรื​ือพู่​่�กันั หรื​ือเมาส์​์ หรื​ือเครื่อ�่ งหมาย ทางดิ​ิจิ​ิทั​ัล

3. อาจเป็​็นเส้​้นตรง และเส้​้นโค้​้ง

4. อาจมี​ีความต่​่อเนื่​่�องหรื​ือหั​ักมุ​ุม

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

- 17 -

ภาพที่​่� 1.15 เส้​้นเฉี​ียง ที่​่�มา : นุ​ุจรี​ี บุ​ุรี​ีรั​ัตน์​์ (2564) ถ้​้าแบ่​่งเส้​้นออกเป็​็นชนิ​ิดตามทิ​ิศทางและความหนาของเส้​้น ก็​็จะได้​้ลั​ักษณะของเส้​้น อี​ีกแบบหนึ่​่�งคื​ือ เส้​้นดิ่​่�ง เส้​้นราบ เส้​้นเฉี​ียง เส้​้นแนวลึ​ึก เส้​้นหน้​้า เส้​้นบาง

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

1. เส้​้นแกนของรู​ูปทรง

2. เส้​้นรู​ูปนอกของกลุ่​่�มรู​ูปทรง

3. เส้​้นที่​่�ลากด้​้วยจิ​ินตนาการจากจุ​ุดหนึ่​่�งไปยั​ังจุ​ุดหนึ่​่�ง เช่​่น เส้​้นกลุ่​่�มดาวเต่​่า

4. เส้​้นโครงสร้​้างของปริ​ิมาตร และเส้​้นโครงสร้​้างขององค์​์ประกอบ

ความรู้​้�สึ​ึกที่​่�เกิ​ิดจากการใช้​้เส้​้น

1. เส้​้นตรง ทำำ�ให้​้รู้​้�สึ​ึกแข็​็งแรง แน่​่นอน ตรง เข้​้ม ไม่​่ประนี​ีประนอม หยาบ และ เอาชนะ

2. เส้​้นคลื่​่�น หรื​ือเส้​้นโค้​้ง ทำำ�ให้​้รู้​้�สึ​ึกสบาย เปลี่​่�ยนแปลงได้​้ เลื่​่�อนไหล ต่​่อเนื่​่�อง สุ​ุภาพ แต่​่ถ้​้าใช้​้เส้​้นโค้​้งแบบนี้​้�มากๆ จะทำำ�ให้​้ความรู้​้�สึ​ึกกั​ังวล ขาดจุ​ุดมุ่​่�งหมาย

3. เส้​้นโค้​้งแคบให้​้ความรู้​้�สึ​ึกมี​ีพลั​ังเคลื่​่�อนไหว เปลี่​่�ยนแปลงเร็​็ว

4. เส้​้นโค้​้งกลม เป็​็นเส้​้นที่​่�มี​ีระเบี​ียบ เป็​็นวงจร

5. เส้​้นโค้​้งก้​้นหอย ให้​้ความรู้​้�สึ​ึกการเข้​้าสู่​่�ศู​ูนย์​์กลาง คลี่​่ค� ลาย มี​ีการเคลื่​่อ� นไหวไม่​่ สิ้​้น� สุ​ุด ความไม่​่รู้​้�จักั จบจั​ักสิ้​้น�

- 18 -

6. เส้​้นฟั​ันปลา เปลี่​่�ยนแปลงเร็​็ว ทำำ�ให้​้ประสาทกระตุ​ุก เหมื​ือนพลั​ังไฟฟ้​้า ฟ้​้าผ่​่า ความขั​ัดแย้​้ง สงคราม

7. เส้​้นนอน กลมกลื​ืนกั​ับแรงดึ​ึงดู​ูดของโลก การพั​ักผ่​่อน เงี​ียบ เฉย สงบ เช่​่น เส้​้นขอบฟ้​้า เส้​้นขอบทะเล ทุ่​่�งกว้​้าง

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

9. เส้​้นเฉี​ียง เคลื่​่�อนไหว ไม่​่มั่​่�นคง

ภาพที่​่� 1.16 การใช้​้เส้​้นในลั​ักษณะรู​ูปทรงที่​่�แตกต่​่างกั​ัน (Abstract Shape Composition ที่​่�มา : https://www.deviantart.com (2018)

- 019 19 --

ระนาบ

ระนาบคื​ือพื้​้�นผิ​ิวเรี​ียบที่​่�ขยายออกไปในทางกว้​้างและทางยาว ระนาบๆ หนึ่​่�งอาจเกิ​ิด จากการเคลื่​่�อนไหวของเส้​้นในทางกว้​้าง และรู​ูปร่​่าง ก็​็คื​ือระนาบอย่​่างหนึ่​่�ง

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

ระนาบอาจมี​ีลักั ษณะเป็​็นของแข็​็งหรื​ือเป็​็นรู​ูพรุนุ หรื​ืออาจจะทึ​ึบหรื​ือโปร่​่งแสงและอาจมี​ี พื้​้น� ผิ​ิวขรุ​ุขระหรื​ือราบเรี​ียบก็​็ได้​้เช่​่นกั​ัน

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

นอกจากนั้​้�นเรายั​ังอาจจะเข้​้าใจว่​่า ระนาบคื​ือพื้​้�นผิ​ิวแบนราบ 2 มิ​ิติ​ิ ที่​่�มี​ีลั​ักษณะใกล้​้ เคี​ียงกั​ับรูปร่ ู า่ งของที่​่�ว่า่ ง ระนาบสามารถสร้​้างรู​ูปทรง 2 มิ​ิติ​ิ ได้​้หลายลั​ักษณะเช่​่น สี่​่เ� หลี่​่ย� มจั​ัตุรัุ สั สี่​่�เหลี่​่�ยมผื​ืนผ้​้า วงกลม สามเหลี่​่�ยม รู​ูปทรงแบนๆ ที่​่�มี​ีลั​ักษณะต่​่างๆ นอกจากนั้​้�นในทางศิ​ิลปะ ระนาบยั​ังสามารถสร้​้างรู​ูปทรง 3 มิ​ิติ​ิได้​้อี​ีกด้​้วย

ระนาบสั​ัมพั​ันธ์​์กั​ับที่​่�ว่​่างคื​ือ บั​ังคั​ับการเคลื่​่�อนไหวของที่​่�ว่​่าง 2 มิ​ิติ​ิ เช่​่น การใช้​้ระนาบ บางใสซ้​้อนกั​ัน การใช้​้ระนาบสานเข้​้าด้​้วยกั​ัน หรื​ือการใช้​้ระนาบเชื่​่�อมต่​่อกั​ัน

ภาพที่​่� 1.17 ระนาบที่​่�ทำำ�ให้​้ผู้​้�ดู​ูมี​ีความรู้​้�สึ​ึกว่​่า ระนาบบางตั​ัวจะล้​้ม หรื​ือจะไหลไปตาม แรงโน้​้มถ่​่วงของโลก ที่​่�มา : นุ​ุจรี​ี บุ​ุรี​ีรั​ัตน์​์ (2564)

- 20 -

รู​ูปร่​่าง รู​ูปทรง ปริ​ิมาตร วั​ัตถุ​ุทางกราฟิ​ิกตั้​้�งอยู่​่�ในระบบ 3 มิ​ิติ​ิ ซึ่​่�งมี​ีปริ​ิมาตรคื​ือ มี​ีทั้​้�งความกว้​้าง ความยาว และ ความลึ​ึก กระดาษหนึ่​่�งใบสามารถบั​ันทึ​ึกภาพที่​่�มี​ีลั​ักษณะของทั​ัศนี​ียภาพ Perspective ซึ่�ง่ ปรากฏว่​่ามี​ีความลึ​ึก และแน่​่นอนว่​่ามั​ันมี​ีปริ​ิมาตรอยู่​่�ในนั้​้�น

รู​ูปร่​่าง

เป็​็นองค์​์ประกอบต่​่อเนื่​่อ� งมาจากเส้​้น เกิ​ิดจากการนำำ�เส้​้นแบบต่​่างๆ มาต่​่อกั​ันจนได้​้รูปร่ ู า่ ง 2 มิ​ิติ​ิ ที่​่�มี​ีความกว้​้างและความยาว (หรื​ือความสู​ูง) ในทางศิ​ิลปะจะแบ่​่งรู​ูปร่​่างออกเป็​็น 2 แบบ คื​ือ รู​ูปร่​่างที่​่�คุ้​้�นตา แบบที่​่�เห็​็นแล้​้วรู้​้�เลยว่​่านั้​้�นคื​ืออะไร เช่​่น ดอกไม้​้ หรื​ือคน และอี​ีกแบบหนึ่​่�งจะ เป็​็นรู​ูปร่​่างแบบฟรี​ีฟอร์​์ม เป็​็นแนวที่​่�ใช้​้รู​ูปร่​่างสื่​่�อความหมาย ที่​่�จิ​ินตนาการไว้​้ออกมาไม่​่มี​ีรู​ูปทรง ที่​่�แน่​่นอน แต่​่ดู​ูแล้​้วเกิ​ิดจิ​ินตนาการถึ​ึงอารมณ์​์ที่​่�ต้​้องการสื่​่�อได้​้

TRIANGULAR

TETRAHEDROM

PENTAGONAL

CONE

CUBE

OCTAHEDRON

รู​ูปทรง

เป็​็นรู​ูปร่​่างที่​่�มี​ีมิติ​ิ ิเพิ่​่�มขึ้​้�นCYLINDER มากลายเป็​็นงานSPHERE 3 มิ​ิติ​ิ มี​ีHEXACONAL ความลึ​ึก เพิ่​่�PRISM มเข้​้ามาด้​้วย ภาพที่​่� 1.18 รู​ูปร่​่างของวั​ัตถุ​ุ ที่​่�มา : นุ​ุจรี​ี บุ​ุรี​ีรั​ัตน์​์ (2564)

ปริ​ิมาตร

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

- 21 -

ในแง่​่ของการทำำ�งานกราฟิ​ิกรู​ูปร่า่ งจะมี​ีผลอย่​่างมากต่​่ออารมณ์​์ของงาน เช่​่น ถ้​้าต้​้องการ งานที่​่�อารมณ์​์ผู้​้�หญิ​ิง เพี​ียงแค่​่ใส่​่รู​ูปร่​่างของดอกไม้​้ ลงไปก็​็จะสามารถแสดงอารมณ์​์ได้​้

Perspective

ภาพที่​่� 1.19 รู​ูปทรงแสดงความลึ​ึก กว้​้าง ยาว สู​ูง ที่​่�มา : https://www.iconfinder.com (2564)

เกิ​ิดจากการพยายามที่​่�จะเลี​ียนแบบสิ่​่�งที่​่�ตาเห็​็น คื​ือ มี​ีการเห็​็นระยะสิ่​่�งที่​่�อยู่​่�ข้​้างหน้​้า และข้​้างหลั​ัง โดยสิ่​่�งที่​่�อยู่​่�ด้​้านหน้​้าจะมี​ีขนาดใหญ่​่กว่​่าสิ่​่�งที่​่�อยู่​่�ด้​้านหลั​ัง

ภาพที่​่� 1.20 ภาพการออกแบบที่​่�เลี​ียนแบบจากสิ่​่�งที่​่�ตาเห็​็น ที่​่�มา : https://www.pinterest.com

- 22 -

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

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

ภาพที่​่� 1.21 ลั​ักษณะของพื้​้�นผิ​ิว ที่​่�มา : https://pxhere.com (2018)

- 23 -

พื้​้�นผิ​ิวรู​ูปธรรม พื้​้�นผิ​ิวรู​ูปธรรมเกิ​ิดได้​้หลายวิ​ิธี​ี เช่​่น จากการเฉื​ือน การขู​ูด หรื​ือการเผาให้​้ไหม้​้ไม่​่เว้​้น แม้​้แต่​่การเขี​ียนลายมื​ือที่​่�หวั​ัด หรื​ือมั่​่�วๆ ก็​็สร้​้างพื้​้�นผิ​ิวรู​ูปธรรมได้​้

พื้​้�นผิ​ิวกลมกลื​ืนและขั​ัดแย้​้ง

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

การสร้​้างตั​ัวอั​ักษรด้​้วยพื้​้�นผิ​ิว

จากตั​ัวอย่​่างนี้​้�เป็​็นงานของสตู​ูดิ​ิโอชื่​่�อดั​ังของโลกได้​้ออกโลโก้​้โดยใช้​้พื้​้�นผิ​ิวแสดงไอเดี​ีย การเคลื่​่�อนไหวและการเปลี่​่�ยนแปลงโดยเป็​็นงานพื้​้�นผิ​ิวแสดงไอเดี​ียด้​้วยการเคลื่​่�อนไหวและการ เปลี่​่�ยนแปลง โดยเป็​็นงานแสดงชื่​่�อว่​่า Swarm ซึ่​่�งเป็​็นงานศิ​ิลปะร่​่วมสมั​ัย โดยใช้​้กลุ่​่�มของวงกลม เล็​็ก 1,000 วงมาสร้​้างเป็​็นตั​ัวอั​ักษรขนาดใหญ่​่

สเกล

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

สเกลในความหมายของนั​ักออกแบบคื​ืออะไร

สเกลสามารถเป็​็นได้​้ทั้​้�งตั​ัวกระทำำ� Subjective หรื​ือตั​ัวถู​ูกกระทำำ� Objective ในเชิ​ิงตั​ัว ถู​ูกกระทำำ�มั​ักจะมี​ีข้​้อตกลงร่​่วมกั​ันในการอ่​่าน เช่​่น แผนที่​่�ซึ่​่�งมี​ีสเกลกำำ�กับว่ ั ่ามี​ีมาตรส่​่วนเท่​่าใด มั​ันทำำ�ให้​้เราจิ​ินตนาการต่​่อขนาดจริ​ิงของสถานที่​่�นั้​้�นๆ ได้​้

ในขณะที่​่ใ� นเชิ​ิงตั​ัวกระทำำ� สเกลจะเป็​็นดั​ังการอ้​้างอิ​ิงขณะของสิ่​่ง� ใดสิ่​่ง� หนึ่​่ง� เช่​่น ห้​้องๆ หนึ่​่ง� มี​ี ขนาดเท่​่าใด

เมื่​่�อเปรี​ียบเที​ียบกั​ับสเกลของมนุ​ุษย์​์ คื​ือ สเกลเป็​็นตั​ัวกระทำำ�การวั​ัดสิ่​่�งต่​่างๆ เพื่​่�อช่​่วยให้​้ เราสามารถออกแบบให้​้เข้​้ากั​ับวิ​ิถี​ีชี​ีวิ​ิตตามขนาดของร่​่างกายของเรา

- 24 -

สเกลขึ้​้�นอยู่​่�กั​ับบริ​ิบทที่​่�มั​ันตั้​้�งอยู่​่�

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

เหมื​ือนมดเมื่​่อ� เปรี​ียบเที​ียบขนาดกั​ับคนจะได้​้อารมณ์​์หนึ่​่ง� แต่​่เมื่​่อ� เอามดมาเปรี​ียบเที​ียบ กั​ับโลกเราก็​็จะได้​้อี​ีกอารมณ์​์หนึ่​่�ง

สเกลยั​ังมี​ีผลต่​่อหน้​้าที่​่�ของมั​ัน

ยกตั​ัวอย่​่าง เช่​่น ตั​ัวหนั​ังสื​ือที่​่�มี​ีขนาด 12 pt. อาจเป็​็นสเกลที่​่�มนุ​ุษย์​์เริ่​่�มอ่​่านได้​้ง่​่ายกว่​่า สเกลที่​่�เล็​็กกว่​่านั้​้�น หรื​ือฉลากยาสำำ�หรั​ับคนสู​ูงอายุ​ุที่​่�สายตายาวอาจต้​้องมี​ีตั​ัวอั​ักษรที่​่�สเกลใหญ่​่

สเกลคื​ือความสั​ัมพั​ันธ์​์

องค์​์ประกอบในงานกราฟิ​ิกจะมี​ีขนาดใหญ่​่ หรื​ือเล็​็กขึ้​้น� อยู่​่�กับั ความสั​ัมพั​ันธ์​์ ระหว่​่างขนาด ที่​่�ตั้​้�ง หรื​ือสี​ีขององค์​์ประกอบที่​่�อยู่​่�รอบๆ มั​ัน เมื่​่�อองค์​์ประกอบมี​ีลั​ักษณะเหมื​ือนกั​ันจะทำำ�ให้​้เกิ​ิด ความรู้​้�สึ​ึกเฉยๆ แต่​่เมื่​่�อมี​ีขนาดที่​่�ขั​ัดแย้​้งกั​ันมากๆ จะทำำ�ให้​้เกิ​ิดความรู้​้�สึ​ึกประหลาดใจ

นอกจากนั้​้น� ขนาดของภาพยั​ังให้​้ความรู้​้�สึ​ึกเรื่​่อ� งระยะคื​ือ ขนาดใหญ่​่จะเหมื​ือนอยู่​่�ใกล้​้ผู้​้�ดู​ู มากกว่​่าขนาดเล็​็ก หรื​ือขนาดใหญ่​่ดู​ูพุ่​่�งมายั​ังผู้​้�ดู​ู ขนาดเล็​็กเหมื​ือนวิ่​่�งหนี​ีผู้​้�ดู​ู

สเกลคื​ือกริ​ิยาอย่​่างหนึ่​่�ง

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

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

ในงานประเภทแอนิ​ิเมชั​ันการใช้​้สเกล จะเป็​็นเรื่​่�องของการซู​ูมเข้​้า ซู​ูมออก ของภาพซึ่​่�ง กระทบกั​ับความหมายในสายตาผู้​้�ดู​ู - 25 -

สี​ี

ภาพที่​่� 1.22 วงจรสี​ีในงานออกแบบ ที่​่�มา : นุ​ุจรี​ี บุ​ุรี​ีรั​ัตน์​์ (2564)

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

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

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

แม่​่สีที่​่ี �เป็​็นวั​ัตถุ​ุ ได้​้แก่​่ สี​ีเหลื​ือง สี​ีแดง สี​ีน้ำำ��เงิ​ิน และสี​ีเกิ​ิดจากการผสมกั​ันของแม่​่สี​ี

ภาพที่​่� 1.23 แม่​่สี​ี ที่​่�มา : นุ​ุจรี​ี บุ​ุรี​ีรั​ัตน์​์ (2564)

- 26 -

น้ำ�หนั​ักของสี​ี (Value) หมายถึ​ึง ความสว่​่าง หรื​ือความมื​ืดของสี​ี เช่​่น ถ้​้านำำ�สี​ีขาวไป ผสมกั​ับอี​ีกสี​ีหนึ่​่�งสี​ีนั้​้�นจะสว่​่างขึ้​้�น

ภาพที่​่�1.24 การไล่​่น้ำำ��หนั​ักของสี​ีให้​้ความมื​ืดความสว่​่างที่​่�แตกต่​่างกั​ัน ที่​่�มา : นุ​ุจรี​ี บุ​ุรี​ีรั​ัตน์​์ (2564)

ความจั​ัดของสี​ี (Intensity) หมายถึ​ึง ความสด หรื​ือความบริ​ิสุ​ุทธิ์​์�ของสี​ี ๆ หนึ่​่�ง เช่​่น สี​ีที่​่� ถู​ูกสี​ีดำำ�ผสมเข้​้าไปจะทำำ�ให้​้หม่​่นหมอง

ความจั​ัดของสี​ีจะเรี​ียงลำำ�ดั​ับจากจั​ัดสุ​ุดไปหม่​่นสุ​ุด ด้​้วยการเพิ่​่�มปริ​ิมาณของสี​ีดำำ�ที่​่�ผสม เรี​ียงกั​ันไปตามลำำ�ดั​ับ

ภาพที่​่� 1.25 การเรี​ียงลำำ�ดั​ับความจั​ัดของสี​ี ที่​่�มา : นุ​ุจรี​ี บุ​ุรีรัี ัตน์​์ (2564)

- 27 -

ภาพที่​่� 1.26 RGB vs CMYK ที่​่�มา : https://printground.net (2018)

การผสมสี​ี

การผสมสี​ีสำำ�หรั​ับนั​ักออกแบบกราฟิ​ิก มี​ีอยู่​่� 2 แบบ คื​ือ CMYK และ RGB

CMYK เป็​็นระบบสี​ีที่​่�ใช้​้กั​ับเครื่​่�องพิ​ิมพ์​์ CMYK ย่​่อมาจาก Cyan (ฟ้​้าอมเขี​ียว) Magenta (แดงอมม่​่วง) Yellow (เหลื​ือง) Key (สี​ีดำำ� - ไม่​่ใช้​้ B แทน Black เพราะจะสั​ับสนกั​ับ Blue) ซึ่​่�งเป็​็นชื่​่�อสี​ีที่​่�เมื่​่�อนำำ�มาผสมด้​้วยวิ​ิธี​ีการพิ​ิมพ์​์ซ้​้อนทั​ับกั​ัน ก็​็จะสามารถทำำ�ให้​้เกิ​ิดสี​ีสั​ันต่​่างๆ

ภาพที่​่� 1.27 การพิ​ิมพ์​์สี​ีแบบ Process Color พิ​ิมพ์​์ซ้​้อนกั​ันแล้​้วเกิ​ิดเป็​็นสี​ีสั​ันต่​่างๆ ที่​่�มา : https://www.canva.com (2020)

- 28-

RGB ย่​่อมาจาก Red, Green และ Blue คื​ือ กระบวนการผสมสี​ีจากแม่​่สี​ี 3 สี​ี คื​ือสี​ีแดง สี​ีเขี​ียว และสี​ีน้ำำ��เงิ​ิน การใช้​้สั​ัดส่​่วนของสี​ี 3 สี​ีนี้​้�ต่​่างกั​ัน จะทำำ�ให้​้เกิ​ิดสี​ีต่​่างๆ มั​ักพบในกรณี​ีของ การผสมสี​ีในโทรทั​ัศน์​์ จอมอนิ​ิเตอร์​์ ซึ่​่�งเป็​็นการผสมสี​ีที่​่�จำำ�เป็​็นสำำ�หรั​ับนั​ักออกแบบเว็​็บไซต์​์ ซึ่​่�ง จะต้​้องเตรี​ียมภาพในระบบที่​่�เรี​ียกว่​่า RGB

ภาพที่​่� 1.28 กระบวนการผสมสี​ีแบบ RGB ที่​่�มา : นุ​ุจรี​ี บุ​ุรี​ีรั​ัตน์​์ (2564)

วงจรสี​ีธรรมชาติ​ิ

เมื่​่�อลองเอารุ้​้�งกิ​ินน้ำำ�� มาทำำ�ให้​้เป็​็นแถบวงกลม เราจะได้​้วงกลมที่​่มี� สี​ี ี 8 สี​ี โดยเพิ่​่ม� สี​ีม่ว่ งแดงซึ่​่�งเป็​็นรอย บรรจบระหว่​่างสี​ีม่​่วงกั​ับสี​ีแดงเข้​้าไปอี​ีก 1 สี​ี ถ้​้าเพิ่​่�มสี​ี เขี​ียวเหลื​ือง เหลื​ืองส้​้ม แสด และน้ำ�เงิ​ินเขี​ียวเข้​้าไปอี​ีก 4 สี​ี จะได้​้วงจรสี​ีธรรมชาติ​ิ 12 สี​ีที่​่�มี​ีความสมดุ​ุลกั​ัน สี​ีชั้​้�นต้​้นในจำำ�นวน 12 สี​ีนั้​้�นมี​ีอยู่​่� 3 สี​ีที่​่�เรา ภาพที่​่� 1.29 วงจรสี​ีธรรมชาติ​ิ ไม่​่อาจผสมขึ้​้�นได้​้ คื​ือ สี​ีเหลื​ือง สี​ีแดง และสี​ีน้ำ�เงิ​ินที่​่� ที่​่�มา : นุ​ุจรี​ี บุ​ุรี​ีรั​ัตน์​์ (2564) เราเรี​ียกกั​ันว่​่าแม่​่สี​ี สี​ีชั้​้�นที่​่� 3 ถ้​้านำำ�แม่​่สี​ีมาผสมกั​ันที​ีละคู่​่�เราจะได้​้สี​ีชั้​้�นที่​่� 2 คื​ือ สี​ีส้​้ม สี​ีเขี​ียว และสี​ีม่​่วง สี​ีชั้​้�นที่​่� 2 ถ้​้านำำ�แม่​่สีชั้​้ี �นที่​่� 2 มาผสมกั​ันที​ีละคู่​่�เราจะได้​้เพิ่​่�มอี​ีก 6 สี​ี คื​ือ สี​ีเหลื​ืองส้​้ม สี​ีแดง ส้​้ม สี​ีเขี​ียวน้ำ�เงิ​ิน สี​ีม่​่วงแดง สี​ีม่​่วงน้ำ�เงิ​ิน สี​ีกลาง ถ้​้านำำ�ทุ​ุกสี​ีมาผสมกั​ันจะได้​้สี​ีเทาแก่​่ๆ เกื​ือบดำำ� เรี​ียกว่​่า สี​ีกลาง หรื​ือเอาแม่​่สี​ีมาผสมกั​ัน ก็​็จะได้​้สี​ีกลางเช่​่นเดี​ียวกั​ัน

- 29 -

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

ภาพที่​่� 1.30 คู่​่�สี​ีที่​่�อยู่​่�ตรงข้​้ามกั​ันในวงจรสี​ี ที่​่�มา : นุ​ุจรี​ี บุ​ุรี​ีรั​ัตน์​์ (2564)

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

ภาพที่​่� 1.31 คู่​่�สี​ีข้​้างเคี​ียง ที่​่�มา : นุ​ุจรี​ี บุ​ุรี​ีรั​ัตน์​์ (2564)

สี​ีอุ่​่�นและสี​ีเย็​็น

เราสามารถแบ่​่งวงจรสี​ีออกเป็​็น 2 ส่​่วนด้​้วยเส้​้นแนวดิ่​่�งเส้​้นหนึ่​่�ง ได้​้แก่​่ สี​ีวรรณะอุ่​่�น คื​ือ เหลื​ือง (ครึ่​่�งหนึ่​่�ง) เหลื​ืองส้​้ม ส้​้ม แดงส้​้ม แดง ม่​่วงแดง และม่​่วง

- 30 -

อี​ีกซี​ีกคื​ือ สี​ีวรรณะเย็​็น คื​ือ สี​ีเหลื​ือง (อี​ีกครึ่​่�งหนึ่​่�ง) เหลื​ืองเขี​ียว น้ำ�เงิ​ินเขี​ียว น้ำ�เงิ​ิน ม่​่วง น�ำ้ เงิ​ิน และม่​่วง (อี​ีกครึ่​่ง� หนึ่​่ง� ) โดยสี​ีม่ว่ งและสี​ีเหลื​ืองจะเป็​็นวรรณะกลางๆ คื​ือ ถ้​้าอยู่​่�ในกลุ่​่�มสี​ีอุ่​่�น ก็​็จะอุ่​่�นด้​้วย ถ้​้าอยู่​่�ในกลุ่​่�มร้​้อนก็​็จะร้​้อนด้​้วย

ภาพที่​่� 1.32 สี​ีอุ่​่�นและสี​ีเย็​็น ที่​่�มา : นุ​ุจรี​ี บุ​ุรี​ีรั​ัตน์​์ (2564)

หลั​ักการใช้​้สี​ีในการออกแบบ

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

1 การใช้​้สี​ีวรรณะเดี​ียว คื​ือกลุ่​่�มสี​ีที่​่�แบ่​่งออกเป็​็นวงล้​้อของสี​ีเป็​็น 2 วรรณะ คื​ือ วรรณะร้​้อน (Warm tone) ซึ่​่�งประกอบด้​้วย สี​ีเหลื​ือง สี​ีส้​้ม สี​ีแดง สี​ีม่​่วง สี​ีเหล่​่านี้​้�ให้​้อิ​ิทธิ​ิพล ต่​่อ ความรู้​้�สึ​ึก ตื่​่�นเต้​้น เร้​้าใจ กระฉั​ับกระเฉง ถื​ือว่​่าเป็​็นวรรณะร้​้อน วรรณะเย็​็น (Cool tone) ประกอบด้​้วย สี​ีเหลื​ือง สี​ีเขี​ียว สี​ีน้ำำ��เงิ​ิน สี​ีม่​่วง สี​ีเหล่​่านี้​้�ดู​ู เย็​็นตา ให้​้ความรู้​้�สึ​ึก สงบ สดชื่​่�น (สี​ี เหลื​ืองกั​ับสี​ีม่​่วงอยู่​่�ได้​้ทั้​้�งสองวรรณะ) การใช้​้สี​ีแต่​่ละครั้​้�งควรใช้​้สี​ีวรรณะเดี​ียวในภาพทั้​้�งหมด เพราะจะทำำ�ให้​้มี​ีความเป็​็นอั​ันหนึ่​่�งอั​ันเดี​ียวกั​ัน (เอกภาพ) กลมกลื​ืน มี​ีแรงจู​ูงใจให้​้คล้​้อยตามได้​้ มาก

2. การใช้​้สี​ีต่​่างวรรณะ หลั​ักการทั่​่�วไป ใช้​้อัตั ราส่​่วน 80% ต่​่อ 20% ของวรรณะ สี​ี คื​ือ ถ้​้าใช้​้สี​ีวรรณะร้​้อน 80% สี​ีวรรณะเย็​็น 20% ซึ่​่�งการใช้​้แบบนี้​้�สร้​้างจุ​ุดสนใจของผู้​้�ดู​ู ไม่​่ควร ใช้​้อั​ัตราส่​่วนที่​่�เท่​่ากั​ันเพราะจะทำำ�ให้​้ไม่​่มี​ีสี​ีใดเด่​่น ไม่​่น่​่าสนใจ

- 31 -

3. การใช้​้สี​ีตรงกั​ันข้​้าม สี​ีตรงข้​้ามจะทำำ�ให้​้ความรู้​้�สึ​ึกที่​่�ตั​ัดกั​ันรุ​ุนแรง สร้​้างความ เด่​่น และเร้​้าใจได้​้มากแต่​่หากใช้​้ไม่​่ถู​ูกหลั​ัก หรื​ือ ไม่​่เหมาะสม หรื​ือใช้​้จำำ�นวนสี​ีมากจนเกิ​ินไป ก็​็จะ ทำำ�ให้​้ความรู้​้�สึ​ึกพร่​่ามั​ัว ลายตา ขั​ัดแย้​้ง ควรใช้​้สี​ีตรงข้​้าม ในอั​ัตราส่​่วน 80% ต่​่อ20% หรื​ือหากมี​ี พื้​้�นที่​่�เท่​่ากั​ันที่​่�จำำ�เป็​็นต้​้องใช้​้ ควรนำำ�สี​ีขาว หรื​ือสี​ีดำำ� เข้​้ามาเสริ​ิม เพื่​่�อตั​ัดเส้​้นให้​้แยกออกจากกั​ัน หรื​ืออี​ีกวิ​ิธี​ีหนึ่​่�งคื​ือการลดความสดของสี​ีตรงข้​้ามให้​้หม่​่นลงไป

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

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

2. สร้างความน่าสนใจ สี​ีมี​ีอิ​ิทธิ​ิพลตองานศิ​ิลปะการออกแบบ จะชวยสร้างความ ประทั​ับใจและความน่าสนใจเปนอั​ันดั​ับแรกที่​่�ได้​้พบเห็​็น

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

4. สี​ีชวยให้เกิ​ิดการรรั​ับรู​ู้ และจดจํ​ํางานศิ​ิลปะ การออกแบบตองการใหผู​ูพบเห็​็นเกิ​ิด การจดจํ​ําในรู​ูปแบบและผลงาน หรื​ือเกิ​ิดความประทั​ับใจ การใชสี​ีจะตองสะดุ​ุดตา และมี​ี เอกภาพ

5. เลื​ือกใช้​้สีคู่​่�ต ี รงข้​้ามจะทำำ�ให้​้งานมี​ีความเปรี​ียบต่​่าง (Contrast) ที่​่�สู​ูงทำำ�ให้​้งานดู​ูโดด เด่​่น การเลื​ือกใช้​้สี​ีที่​่�มี​ีค่​่าสี​ีใกล้​้เคี​ียงกั​ันก็​็ทำำ�ให้​้งานออกมาดู​ูอ่​่อนนุ่​่�มและเป็​็นไปในทางเดี​ียวกั​ัน มากกว่​่า

6. เลื​ือกสี​ีเพี​ียง 3 ถึ​ึง 4 สี​ี ง่​่ายต่​่อการคุ​ุมโทนสี​ีของงานออกแบบ การใช้​้สี​ีที่​่�มากไม่​่ใช่​่ เรื่​่�องที่​่�ผิ​ิด แต่​่การใช้​้สีที่​่ี �มากหมายถึ​ึงความยากที่​่�มากขึ้​้�นในการทำำ�งาน การใช้​้สี​ีที่​่�น้​้อยทำำ�ให้​้ ควบคุ​ุมค่​่าสี​ีที่​่�ต้​้องการควบคุ​ุมโทนสี​ีของงานออกมาได้​้อย่​่างไม่​่ยาก

- 32 -

ภาพที่​่� 1.33 ภาพ The Dark Knight ที่​่�ใช้​้สี​ีในเชิ​ิงการตลาดและแฟชั่​่�น ที่​่�มา : https://www.stellarsisters.com (2018)

การเลื​ือกสี​ีเชิ​ิงการตลาด และแฟชั่​่�น

เนื่​่�องจากงานออกแบบกราฟิ​ิกมั​ักสั​ัมพั​ันธ์​์กั​ับงานโฆษณาและการตลาดรวมทั้​้�ง เทรนด์​์แฟชั่​่�น ซึ่​่�งอาจมี​ีการแทนค่​่าสี​ีแตกต่​่างออกไปจากหลั​ักจิ​ิตวิ​ิทยา

• สี​ีดำำ�แทนความคลาสสิ​ิก ความอมตะ ความเป็​็นกบฏ ความลึ​ึกลั​ับ สี​ีดำำ�เป็​็นสี​ี ที่​่�ได้​้รั​ับความนิ​ิยมสู​ูงในแวดวงการออกแบบ

ภาพที่​่� 1.34 การออกแบบโดยใช้​้สี​ีดำำ� ที่​่�มา : https://www.badnorwegian.com (2563)

- 33 -

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

ภาพที่​่� 1.35 สี​ีขาวสื่​่�อให้​้เห็​็นถึ​ึงความบริ​ิสุ​ุทธิ์​์� ที่​่�มา : https://www.pinterest.com (2563)

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

ภาพที่​่� 1.36 สี​ีเทาสื่​่�อให้​้เห็​็นถึ​ึงความปลอดภั​ัย ที่​่�มา : https://www.pinterest.com (2563)

• สีน�ต ำ้ าลแทนความสบายแทนความคลาสสิ​ิก ในวงการแฟชั่​่�นมั​ักใช้​้สีนี �ต ำ้ าลเป็​็น ตั​ัวโฆษณา โดยใช้​้คู่​่�สี​ีดำำ�และสี​ีทอง เช่​่น แบรนด์​์อย่​่าง Gucci Amani แต่​่บางครั้​้�งอาจใช้​้คู่​่�กั​ับสี​ี เขี​ียวแสดงถึ​ึงธรรมชาติ​ิของโลก หรื​ือกระแส Eco-Design - 34 -

ภาพที่​่� 1.37 สี​ีน้ำ�ต ำ� าลกั​ับงานโฆษณา ที่​่�มา : https://bamboodu.com (2563) • สี​ีเขี​ียวแทนความเป็​็นธรรมชาติ​ิ ความสงบ การเกิ​ิดใหม่​่ ความเยาว์​์วั​ัย

ภาพที่​่� 1.38 สี​ีเขี​ียวสื่​่�อให้​้เห็​็นถึ​ึงความเป็​็นธรรมชาติ​ิ ที่​่�มา : https://dribbble.com (2563)

• สี​ีส้​้มแทนความกระตื​ือรื​ือร้​้น ความอบอุ่​่�น ความร่​่าเริ​ิง และความรู้​้�สึ​ึกที่​่�เป็​็น อิ​ิสระ ยั​ังเป็​็นสี​ีที่​่�แสดงถึ​ึงความคิ​ิดสร้​้างสรรค์​์ และ มี​ีพลั​ัง

ภาพที่​่� 1.39 สี​ีส้​้มสื่​่�อให้​้เห็​็นถึ​ึงความสดชื่​่�น ที่​่�มา : https://www.jhornig.com (2563)

- 35 -

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

ภาพที่​่� 1.40 สี​ีชมพู​ูสื่​่�อถึ​ึงความอบอุ่​่�นน่​่าทะนุ​ุถนอม ที่​่�มา : https://www.akerufeed.com (2563)

• สี​ีม่​่วงแทนความหรู​ูหรา ชั้​้�นสู​ูง มี​ีปั​ัญญา มี​ีความนิ​ิยมในธุ​ุรกิ​ิจหรู​ูหรา สี​ีม่​่วง อ่​่อนนั้​้�นเหมาะกั​ับการออกแบบเชิ​ิงสิ​ิทธิ​ิสตรี​ี หรื​ือดึ​ึงดู​ูดความสนใจของเด็​็กๆ

ภาพที่​่� 1.41 สี​ีม่​่วงสื่​่�อถึ​ึงความหรู​ูหรา ที่​่�มา : https://thedieline.com (2563)

- 36 -

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

ภาพที่​่� 1.42 สี​ีแดงสื่​่�อถึ​ึงความมี​ีพลั​ังทั้​้�งด้​้านบวกและด้​้านลบ ที่​่�มา : https://packageinspiration.com (2563)

• สี​ีเหลื​ืองแทนความร่​่าเริ​ิง สนุ​ุกสนาน การมี​ีความสุ​ุข ความมี​ีไอเดี​ีย มั​ักใช้​้กั​ับ การเปลี่​่�ยนภาพลั​ักษณ์​์ของแบรนด์​์ที่​่�ต้​้องการภาพลั​ักษณ์​์ใหม่​่

ภาพที่​่� 1.43 สี​ีเหลื​ืองสื่​่�อถึ​ึงความสนุ​ุกสนาน ร่​่าเริ​ิง ที่​่�มา : https://scottsnyderphoto.com (2563) - 37-

การจั​ัดวางองค์​์ประกอบสำำ�หรั​ับออกแบบงานกราฟิ​ิก

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

1. การออกแบบโดยใช้​้ความสมมาตรและความอสมมาตร โดยการใช้​้มาตราส่​่วน (Scale) ที่​่�มี​ีขนาดใหญ่​่ ขนาดเล็​็กไม่​่เท่​่ากั​ัน ในการออกแบบ หากออกแบบของสิ่​่�งใดๆ ที่​่�มี​ีขนาด เท่​่ากั​ันหมด แสดงให้​้เห็​็นว่​่า ไม่​่ได้​้เน้​้นที่​่�จะสื่​่�ออะไรเลย ซึ่​่�งจะทำำ�ให้​้งานออกแบบดู​ูเรี​ียบง่​่ายเกิ​ิน ไป ดั​ังนั้​้�นจำำ�เป็​็นต้​้องให้​้มี​ีรู​ูปแบบของมาตราส่​่วน (Scale) ที่​่�แตกต่​่างในการออกแบบเสมอ

ภาพที่​่� 1.44 การออกแบบโดยใช้​้มาตราส่​่วนที่​่�ต่​่างขนาดในองค์​์ประกอบของภาพ ที่​่�มา : https://idxw.net/2018 (2564)

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

ภาพที่​่� 1.45 การออกแบบโดยใช้​้กราฟิ​ิกซ้ำำ�� ๆ เพิ่​่�มความน่​่าสนใจ ที่​่�มา : https://idxw.net (2564)

- 38 -

3. ความสมดุ​ุล การจั​ัดสมดุ​ุลมี​ีอยู่​่� 2 ลั​ักษณะที่​่�สำำ�คั​ัญ คื​ือ

ความสมดุ​ุลในรู​ูปทรงหรื​ือความเหมื​ือนกั​ันทั้​้�ง 2 ด้​้าน คื​ือ เมื่​่�อมองดู​ูภาพแล้​้ว เห็​็นได้​้ทั​ันที​ีว่​่าภาพที่​่�ปรากฎนั้​้�นเท่​่ากั​ัน ลั​ักษณะภาพแบบนี้​้�ทำำ�ให้​้ความรู้​้�สึ​ึกที่​่�มั่​่�นคง เป็​็นทางการ แต่​่อาจทำำ�ให้​้ดู​ูน่​่าเบื่​่�อได้​้ง่​่าย

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

ภาพที่​่� 1.46 การใช้​้ความแตกต่​่างด้​้านรู​ูปแบบ สี​ีและพื้​้�นผิ​ิวในการจั​ัดองค์​์ประกอบ ให้​้มี​ีความสมดุ​ุล ที่​่�มา : https://idxw.net (2564)

4. ความสมมาตร จำำ�เป็​็นจะต้​้องยึ​ึดหลั​ักของความสมมาตรโดยรวม หมายความว่​่า องค์​์ประกอบของกราฟิ​ิกทางฝั่​่�งซ้​้ายและขวาจะต้​้อง “เท่​่ากั​ัน” หรื​ือ “เหมื​ือนกั​ัน” เสมอไป ซึ่�ง่ โดยส่​่วนใหญ่​่จะเป็​็นอย่​่างนั้​้�น แต่​่ในการใช้​้งานจริ​ิงๆ อาจมี​ีช่​่องว่​่างเล็​็กๆ น้​้อยๆ เพื่​่�อให้​้การ ออกแบบให้​้น่​่าสนใจแต่​่องค์​์ประกอบของภาพโดยรวมก็​็ยั​ังต้​้องยึ​ึดหลั​ักความสมมาตรเท่​่ากั​ัน

- 39 -

ภาพที่​่� 1.47 การออกแบบนกที่​่�มี​ีขนาดใหญ่​่ แต่​่ก็​็ยึ​ึดความสมมาตรกั​ับองค์​์ประกอบอื่​่�นๆ ที่​่�มา : https://idxw.net/2018 (2564)

4. ความโปร่​่งใส เป็​็นการจั​ัดวางเลย์​์เอาท์​์ในลั​ักษณะของการเฟตจางหายไป ซึ่�ง่ อาจนำำ� มาจั​ัดวางที่​่�มี​ีองค์​์ประกอบหลายๆ อย่​่าง หรื​ือแม้​้แต่​่การการออกแบบความโปร่​่งใส่​่กั​ับวั​ัสดุ​ุ หรื​ือการใช้​้กั​ับ Bending Mode สามารถสร้​้างผลลั​ัพธ์​์ที่​่�แตกต่​่างกั​ันได้​้

ภาพที่​่� 1.48 การสร้​้างเฟตและความโปร่​่งใส เพื่​่�อให้​้ชิ้​้�นงานมี​ีความแตกต่​่าง ที่​่�มา : https://idxw.net/2018 (2564)

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

- 40 -

ให้​้เกิ​ิดความสวยงามที่​่�มี​ีความแปลกตา วิ​ิธี​ีการสร้​้างองค์​์ประกอบให้​้เกิ​ิดจั​ังหวะลี​ีลากระทำำ�ได้​้ หลายแบบ ได้​้แก่​่

5.1 แบบจั​ัดระเบี​ียบ เป็​็นการจั​ัดที่​่�เน้​้นรู​ูปแบบอย่​่างเป็​็นทางการ เช่​่น การจั​ัด ให้​้เกิ​ิดความสมดุ​ุลแบบสมมาตร มี​ีการแบ่​่งแยกตั​ัวอั​ักษรและภาพไว้​้คนละส่​่วนกั​ัน มี​ีการแบ่​่ง ระยะพื้​้�นที่​่�ว่​่างเป็​็นระยะ ๆ เท่​่ากั​ัน

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

5.3 การจั​ัดแบบศู​ูนย์​์กลาง เป็​็นการเน้​้นรู​ูปภาพอยู่​่�ตรงกลางภาพ และให้​้ตั​ัว อั​ักษรข้​้อความอยู่​่�ล้​้อมรอบหรื​ือกระจายเป็​็นรั​ัศมี​ี นิ​ิยมใช้​้จั​ัดในงานออกแบบสื่​่�อโฆษณา

5.4 การจั​ัดแบบกระจาย เป็​็นการจั​ัดแบบอิ​ิสระโดยไม่​่เน้​้นลั​ักษณะองค์​์ ประกอบแบบใด การจั​ัดภาพแบบนี้​้�จะมี​ีจั​ังหวะลี​ีลาไม่​่แน่​่นอน แล้​้วแต่​่โอกาสและลั​ักษณะงาน นั้​้�น ๆ นิ​ิยมใช้​้ในงานออกแบบสื่​่�อโฆษณา

5.5 การจั​ัดแบบผสมผสาน เป็​็นการนำำ�เอาหลายๆ วิ​ิธี​ีการจั​ัดออกแบบร่​่วม กั​ัน ทำำ�ให้​้เกิ​ิดเป็​็นรู​ูปแบบใหม่​่ขึ้​้�นมา การจั​ัดวิ​ิธี​ีการนี้​้�คำำ�นึ​ึงถึ​ึงความสอดคล้​้องสั​ัมพั​ันธ์​์กั​ัน

6. การใข้​้กรอบ

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

ภาพที่​่� 1.49 การออกแบบวั​ัตถุ​ุเพื่​่�อเป็​็นกรอบในการนำำ�สายตา ที่​่�มา : https://idxw.net/2018

- 41 -

7. การใช้​้กริ​ิด

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

ภาพที่​่� 1.50 การใช้​้กริ​ิดลั​ักษณะการออกแบบเป็​็นคอลั​ัมน์​์ ที่​่�มา : https://idxw.net (2564)

8. จั​ังหวะและการเคลื่​่�อนไหว

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

ภาพที่​่� 1.51 การใช้​้เส้​้นสร้​้างเพื่​่�อให้​้ภาพเกิ​ิดการเคลื่​่�อนไหว ที่​่�มา : https://idxw.net (2564)

- 42 -

02

การออกแบบกราฟิ​ิกดี​ีไซน์​์ ความหมายของการออกแบบกราฟิ​ิกดี​ีไซน์​์

การออกแบบกราฟิ​ิกดี​ีไซน์​์เป็​็นศาสตร์​์เฉพาะที่​่สิ่​่� ง� ต่​่างๆ สามารถตี​ีความไปได้​้หลากหลาย ดั​ังนั้​้�น การทำำ�ความเข้​้าใจกั​ับความหมายของสิ่​่�งต่​่างๆ ที่​่�เกี่​่�ยวข้​้องจะช่​่วยให้​้นั​ักออกแบบเข้​้าใจ งานกราฟิ​ิกดี​ีไซน์​์ได้​้ดียิ่​่ี ง� ขึ้​้น� เป็​็นการออกแบบชนิ​ิดหนึ่​่�ง ดั​ังนั้​้�น การรู้​้�จั​ักเสี​ียก่​่อนว่​่า “ดี​ีไซน์​์” คื​ือ อะไรจึ​ึงเป็​็นเรื่​่�องสำำ�คั​ัญอั​ันดั​ับแรก

นิ​ิยามของการดี​ีไซน์​์

Paul Rand กราฟิ​ิกดี​ีไซเนอร์​์ผู้​้�ยิ่​่�งใหญ่​่ ได้​้กล่​่าวไว้​้ที่​่� MIT Media Laboratoryaul ว่​่า ดี​ีไซน์​์คื​ือ “วิ​ิธี​ีการดึ​ึงรู​ูปแบบและเนื้​้�อหาออกมารวมกั​ัน”

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

นอกจากนั้​้�นอี​ีกสิ่​่�งหนึ่​่�งที่​่�สำำ�คั​ัญสำำ�หรั​ับกราฟิ​ิกดี​ีไซน์​์ก็​็คื​ือ กราฟิ​ิกดี​ีไซน์​์จะเน้​้นไปในด้​้าน ความสวยงามต่​่างๆ มากกว่​่าในทางประโยชน์​์ใช้​้สอย ซึ่​่ง� แตกต่​่างจากเรื่อ�่ งของอุ​ุตสาหกรรมหรื​ือ สถาปั​ัตยกรรมที่​่จ� ะต้​้องเน้​้นไปทางประโยชน์ใช้​้สอยด้​้วยในการทำำ�งาน

ภาพที่​่� 2.1 Milton Glaser ที่​่�มา : It’s Nice That (2018)

สำำ�หรั​ับ Milton Glaser กราฟิ​ิกดี​ีไซเนอร์​์ ชี่​่อ� ก้​้องโลกอี​ีกท่​่านกล่​่าวไว้​้ ณ Brigham Young University ปี​ี ค.ศ. 2006 โดยมี​ีความเห็​็นว่​่า ดี​ีไซน์​์ คื​ือ “การวางแผนอย่​่างเรี​ียบง่​่าย” โดยผลงานที่​่�ดี​ี จะมาจากการอยู่​่�ในสภาพแวดล้​้ อ มที่​่� เ หมาะสม มากกว่​่า

- 43 -

ภาพที่​่� 2.2 AIGA LOGO ที่​่�มา :https://detroit.aiga.org (2018)

นิ​ิยามของกราฟิ​ิกดี​ีไซน์​์

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

นิ​ิยามของกราฟิ​ิกดี​ีไซน์​์ที่​่�บั​ันทึ​ึกโดยสถาบั​ัน AGA (1914 American Institute of Graphic Arts) โดย Jessica Helfand นั​ักเขี​ียน-คอลั​ัมนิ​ิสต์​์ และผู้​้�บรรยายเกี่​่ย� วกั​ับ กราฟิ​ิกดี​ีไซน์​์ได้​้นิ​ิยามเอาไว้​้ว่​่า “กราฟิ​ิกดี​ีไซน์​์คื​ือการรวมกั​ันของคำำ�หลายๆ คำำ� ภาพหลายๆ ภาพ โดยอาจเป็​็นภาพชนิ​ิดต่​่างๆ ไม่​่ว่​่าจะเป็​็นตั​ัวเลข แผนผั​ังภาพถ่​่าย หรื​ือภาพประกอบ” สิ่​่�งต่​่างๆ เหล่​่านี้​้�จะเกิ​ิดเป็​็นผลสำำ�เร็​็จหรื​ือผลงานที่​่�ดี​ีได้​้ก็​็ด้​้วย ความชั​ัดเจน มี​ีเอกลั​ักษณ์​์ หรื​ือมี​ีความเฉพาะตั​ัวของผู้​้�ออกแบบ ซึ่​่�งเหมื​ือนทำำ�หน้​้าที่​่� เป็​็นผู้​้�ประพั​ันธ์​์ดนตรี​ีขึ้​้�นมาโดยใช้​้องค์​์ประกอบต่​่างๆ ทางศิ​ิลปะเป็​็นส่​่วนผสม ดั​ังนั้​้�น ผู้​้�ที่​่�ทำำ�หน้​้าที่​่�ออกแบบจะมี​ีหน้​้าที่​่�น่​่าสิ่​่�งต่​่างๆ ที่​่�กล่​่าวมามาจั​ัดรวมกั​ันไว้​้ด้​้วยวิ​ิธี​ีใดวิ​ิธี​ี หนึ่​่�ง เพื่​่�อให้​้ผลลั​ัพธ์​์ที่​่�ออกมาเป็​็นงานที่​่�ดู​ูสนุ​ุกสนาน ดู​ูน่​่าแปลกใจ หรื​ือสร้​้างความ จดจำำ�ให้​้ผู้​้�พบเห็​็น

- 44 -

Tibor Kalman นั​ักกราฟิ​ิกดี​ีไซเนอร์​์ชาวฮั​ังการี​ีแห่​่งค่​่าย Colors Magazine ได้​้ให้​้สั​ัมภาษณ์​์กั​ับ Moira Cullen นั​ักเขี​ียนทางด้​้านการออกแบบชั้​้�นนำำ�ไว้​้ว่​่า“กราฟิ​ิกดี​ีไซน์​์ คื​ือภาษาอย่​่างหนึ่​่ง� แต่​่นักั ออกแบบกราฟิ​ิกไม่​่ต้อ้ งยุ่​่�งยากหรื​ือกั​ังวลเกี่​่ย� วกั​ับหลั​ักการในเรื่​่�องของภาษา เช่​่น เรื่​่�องพยางค์​์หรื​ือการเว้​้นวรรคมากนั​ัก แต่​่นั​ักออกแบบควรจะใช้​้เวลาที่​่�มี​ีไปสนใจในเรื่​่�องของ การสื่​่�อสารออกไปในทิ​ิศทางที่​่�มั​ันควรจะเป็​็นให้​้ได้​้เสี​ียมากกว่​่า”

Bob Gill กราฟิ​ิกดี​ีไซเนอร์​์และนั​ักเขี​ียนภาพประกอบชาวอเมริ​ิกั​ันให้​้ความเห็​็นสั้​้�นๆ ว่​่า “กราฟิ​ิกดี​ีไซน์​์เปรี​ียบดั​ังภาษาขั้​้�นที่​่�สอง”

Massimo Vignelli นั​ักออกแบบหลายสาขาชาวอิ​ิตาลี​ีให้​้ความเห็​็นว่​่า “กราฟิ​ิก ดี​ีไซน์​์เปรี​ียบเหมื​ือนกั​ับการจั​ัดการข้​้อมู​ูลอย่​่างเป็​็นระบบ” โดยประกอบไปด้​้วยเรื่​่�องต่​่างๆ เช่​่น การ เปลี่​่�ยนแปลงความหมายให้​้ถู​ูกต้​้อง การจั​ัดการกั​ับประโยค หรื​ือข้​้อความที่​่ส� อดคล้​้องกั​ัน และการ จั​ัดการกั​ับส่ว่ นที่​่มี� คี วามยุ่​่�งยากต่​่อการทำำ�ความเข้​้าใจให้​้เข้​้าใจได้​้อย่​่างง่​่ายดาย”

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

- 45 -

ภาพที่​่� 2.3 The Design Concept Book ที่​่�มา : http://www.paul-rand.com (2018)

หน้​้าที่​่�ของกราฟิ​ิกดี​ีไซน์​์

Allen Hurlburt Designer และสมาชิ​ิกของ The Club ได้​้จำำ�แนกหน้​้าที่​่�หลั​ักๆ ของ งานออกแบบกราฟิ​ิกไว้​้ในหนั​ังสื​ือ The Design Concept โดยแบ่​่งออกเป็​็น 3 ลั​ักษณะ ได้​้แก่​่

1. เพื่​่�อบอกเล่​่าเรื่​่�องราวหรื​ือให้​้รายละเอี​ียดสิ่​่�งต่​่างๆ (To Inform) เช่​่น สั​ัญลั​ักษณ์​์ บอกทางในโรงพยาบาลที่​่�ต้​้องการการเข้​้าถึ​ึงแผนกต่​่างๆ อย่​่างรวดเร็​็วและชั​ัดเจน โดยมั​ันจะเป็​็น ตั​ัวช่​่วยลดความสั​ับสนต่​่อการหาตำำ�แหน่​่งของแผนกต่​่างๆ

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

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

- 46 -

กระบวนการขั​ับเน้​้นความหมาย

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

ภาพที่​่� 2.4 Elter Drugs ที่​่�มา : https://idxw.net (2563)

ภาษากราฟิ​ิก

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

ภาษากราฟิ​ิกคื​ือ ภาษาที่​่�จะถู​ูกแสดงออกมาด้​้วยทั​ัศนธาตุ​ุ ประกอบศิ​ิลป์​์ เช่​่น จุ​ุด เส้​้น และระนาบ

- 47 -

หรื​ือที่​่�เรี​ียกกั​ันว่​่าองค์​์

เครื​ือข่​่ายของงานออกแบบกราฟิ​ิก

เครื​ือข่​่ายของงานกราฟิ​ิกจะประกอบด้​้วยสาขาต่​่างๆ มากมาย ไม่​่ว่​่าจะเป็​็น

1. งานออกแบบสื่​่�อสิ่​่�งพิ​ิมพ์​์

2. งานออกแบบตั​ัวอั​ักษร

3. อิ​ินฟอร์​์เมชั​ันดี​ีไซน์​์

4. งานอิ​ินเตอร์​์แอ็​็คที​ีฟกราฟิ​ิก

5. งานออกแบบเว็​็บไซต์​์

6. งานการออกแบบมั​ัลติมีิ ีเดี​ีย

7. งานแอนิ​ิเมชั​ัน

สาขาของงานกราฟิ​ิกต่​่างๆ จะมี​ีรายละเอี​ียดดั​ังนี้​้�

1. งานออกแบบสื่​่�อสิ่​่�งพิ​ิมพ์​์

งานออกแบบสื่​่อ� สิ่​่ง� พิ​ิมพ์​์ถื​ือว่​่าเป็​็นพื้​้�นฐานของงานกราฟิ​ิกด้​้านอื่​่น� เป็​็นงาน กราฟิ​ิกเริ่​่ม� แรกที่​่มี� ปี ระวั​ัติอัิ นั ยาวนาน ความสำำ�คัญ ั ในการออกแบบสิ่​่�งพิ​ิมพ์​์ก็คื​ื็ อ การออกแบบเพื่​่อ� เพิ่​่ม� ประสิ​ิทธิ​ิภาพในการสื่​่�อสารที่​่�มี​ีเนื้​้�อหาที่​่�นำำ�มาพิ​ิมพ์​์

การออกแบบสิ่​่�งพิ​ิมพ์​์เป็​็นการดำำ�เนิ​ินการเพื่​่�อให้​้เกิ​ิดผลลั​ัพธ์​์ต่​่างๆดั​ังนี้​้�

1. ดึ​ึงดู​ูดใจให้​้ผู้​้�ที่​่�พบเห็​็นเกิ​ิดความสนใจในสิ่​่�งพิ​ิมพ์​์

2. ถ่​่ายทอดข้​้อมู​ูลที่​่�ต้​้องการจะสื่​่�อสารอย่​่างชั​ัดเจน และเหมาะสมกั​ับผู้​้�รั​ับสื่​่�อ

3. สร้​้างความประทั​ับใจทำำ�ให้​้ข้อ้ มู​ูลที่​่สื่� อ�่ สารเป็​็นที่​่จ� ดจำำ� ผู้​้�ที่​่มี� คี วามสำำ�คัญ ั ที่​่สุ� ดุ ในกระบวนการออกแบบสิ่​่�งพิ​ิมพ์​์เรี​ียกว่​่าผู้​้�กำำ�กั​ับศิ​ิลป์​์ (Art Director) หรื​ือบางครั้​้�งในสำำ�นั​ักพิ​ิมพ์​์ เรี​ียกว่​่าบรรณาธิ​ิการศิ​ิลป์​์ (Art Editor)

- 48 -

กระบวนการผลิ​ิตสิ่​่�งพิ​ิมพ์​์

กระบวนการผลิ​ิตสิ่​่�งพิ​ิมพ์​์มี​ีขั้​้�นตอนดั​ังนี้​้�

1. การจั​ัดหาต้​้นฉบั​ับ การหาผลงานที่​่�เป็​็นเนื้​้�อหา เช่​่น สารคดี​ี วิ​ิชาการ นวนิ​ิยาย และอื่​่�นๆ

2. งานบรรณาธิ​ิการ ในขั้​้�นนี้​้�ผู้​้�ที่​่�ทำำ�งานในกองบรรณาธิ​ิการของสิ่​่�งพิ​ิมพ์​์จะ ตรวจสอบต้​้นฉบั​ับ

3. ขั้​้น� ตอนก่​่อนงานคื​ือ บรรณาธิ​ิการฝ่​่ายศิ​ิลป์ห์ รื​ือผู้​้�อำ�ำ นวยการฝ่​่ายศิ​ิลป์​์ จะทำำ�งาน ในส่​่วนที่​่เ� กี่​่ย� วข้​้องกั​ับงานออกแบบ เลื​ือกเสนอภาพรวมในรู​ูปแบบของเลย์​์เอาต์​์ให้​้ผู้​้�ที่​่เ� ป็​็นเจ้​้าของ สื่​่�อพิ​ิมพ์​์ และบรรณาธิ​ิการได้​้แนะนำำ�และปรั​ับแก้​้ ถ้​้าเป็​็นที่​่�พอใจแล้​้วจะจั​ัดทำำ�เป็​็นอาร์​์ตเวิ​ิร์​์คเพื่​่�อ ส่​่งพิ​ิมพ์​์ต่​่อไป

4. ขั้​้�นตอนการพิ​ิมพ์​์ สำำ�นั​ักพิ​ิมพ์​์จะจั​ัดส่​่งอาร์​์ตเวิ​ิร์​์ค ให้​้แก่​่โรงพิ​ิมพ์​์

5. การกระจายสิ​ินค้​้าและส่​่งเสริ​ิมการขาย ในขั้​้�นนี้​้�สำำ�นั​ักพิ​ิมพ์​์จะนำำ�สิ่​่�งพิ​ิมพ์​์ กระจายออกไปให้​้ถึ​ึงมื​ือผู้​้�อ่​่านได้​้ง่​่ายและทั่​่�วถึ​ึงที่​่�สุ​ุด

กระบวนการออกแบบสิ่​่�งพิ​ิมพ์​์

กระบวนการออกแบบจะแบ่​่งเป็​็น 2 ส่​่วนคื​ือ

1. การเตรี​ียมการก่​่อนการออกแบบและการปฏิ​ิบั​ัติ​ิการออกแบบ

1.1 การรั​ับทราบความคิ​ิด ความต้​้องการ และนโยบายต่​่างๆ ของผู้​้�บริ​ิหาร หรื​ือผู้​้�เป็​็นเจ้​้าของสิ่​่�งพิ​ิมพ์​์

1.2 การค้​้นคว้​้าหาข้​้อมู​ูลเพิ่​่�มเติ​ิมแล้​้วนำำ�มาวิ​ิเคราะห์​์

1.3 การเขี​ียนโจทย์​์ของการออกแบบ

1.4 การกำำ�หนดรู​ูปแบบสิ่​่�งพิ​ิมพ์​์

2. การปฏิ​ิบั​ัติ​ิการออกแบบ

2.1 การเลื​ือกและสร้​้างองค์​์ประกอบและหลั​ักการจั​ัดองค์​์ประกอบ

2.2 การจั​ัดทำำ�เลย์​์เอาท์​์

2.3 การประเมิ​ินผลงานออกแบบ

- 49 -

ขั้​้�นตอนการจั​ัดทำำ�เลย์​์เอาท์​์

ขั้​้�นตอนการจั​ัดทำำ�เลย์​์เอาท์​์จะแบ่​่งเป็​็น 4 ขั้​้�นตอนคื​ือ เลย์​์เอาท์​์ย่​่อขนาด หรื​ือร่​่างหยาบ ย่​่อขนาด, เลย์​์เอาท์​์หยาบ หรื​ือร่​่างหยาบ, เลย์​์เอาท์​์สมบู​ูรณ์​์ และจบด้​้วยดั​ัมมี่​่�

1. เลย์​์เอาท์​์ย่​่อขนาดหรื​ือร่​่างหยาบย่​่อขนาด (Thumbnail Sketches Layout)

เป็​็นรู​ูปแบบหรื​ือขั้​้น� ตอนของการจั​ัดทำำ�เลย์​์เอาท์​์ โดยมี​ีวัตถุ ั ปุ ระสงค์​์เพื่​่อ� การศึกึ ษาความ เป็​็นไปได้​้ในการจั​ัดองค์​์ประกอบเพื่​่�อให้​้ได้​้ทางเลื​ือกมากที่​่�สุ​ุด เลย์​์เอาท์​์ขนาดเล็​็กนี้​้�จะมี​ีลั​ักษณะ เป็​็นการร่​่างด้​้วยดิ​ินสอ หรื​ือปากกาอย่​่างคร่​่าวๆ ในขนาดประมาณ 1 : 8 หรื​ือ 1 : 4 ของขนาด สิ่​่�งพิ​ิมพ์​์จริ​ิง

2. เลย์​์เอาท์​์หยาบหรื​ือร่​่างหยาบ (Rough Layout)

เป็​็นพั​ัฒนาการขั้​้น� ต่​่อไปของการจั​ัดทำำ�เลย์​์เอาท์​์ โดยมี​ีวั​ัตถุ​ุประสงค์​์เพื่​่�อสรุ​ุปขนาดตำำ�แหน่​่ง และสั​ัดส่​่วนขององค์​์ประกอบต่​่างๆ โดยเลย์​์เอาท์​์อย่​่างนี้​้จ� ะมี​ีลักั ษณะการร่​่างด้​้วยดิ​ินสอหรื​ือปากกา และอาจมี​ีการลงสี​ีหรื​ือเอาภาพมาตั​ัดต่​่อลงไป ขนาดของเลย์​์เอาท์​์อย่​่างนี้​้จ� ะมี​ีขนาดประมาณครึ่​่ง� หนึ่​่ง� หรื​ือเท่​่ากั​ับขนาดของสิ่​่ง� พิ​ิมพ์​์จริ​ิง เลย์​์เอาท์​์หยาบจะมี​ีประโยชน์​์ในการนำำ�เสนอความคิ​ิด ให้​้ฝ่​่ายต่​่างๆ ที่​่ทำ� �ำ งานร่​่วมกั​ันได้​้ให้​้ความคิ​ิดเห็​็น

ภาพที่​่� 2.5 ภาพเลย์​์เอาท์​์ สิ​ินค้​้า เพื่​่�อให้​้เห็​็นภาพคร่​่าวๆ ก่​่อนนำำ�ไปยั​ังขั้​้�นตอนต่​่อไป ที่​่�มา : นุ​ุจรี​ี บุ​ุรี​ีรั​ัตน์​์ (2564)

- 50 -

3. เลย์​์เอาท์​์สมบู​ูรณ์​์ (Comprehensive Layout)

เป็​็นพั​ัฒนาการขั้​้�นสุ​ุดท้​้ายของการจั​ัดทำำ�เลย์​์เอาท์​์ โดยวั​ัตถุ​ุประสงค์​์เพื่​่�อกำำ�หนดขนาด ตำำ�แหน่​่ง และสั​ัดส่​่วนที่​่�แน่​่นอนขององค์​์ประกอบต่​่างๆ โดยเลย์​์เอาท์​์สมบู​ูรณ์​์นี้​้�จะมี​ีลั​ักษณะ เป็​็นการวาดหรื​ือเป็​็นการพิ​ิมพ์​์แบบจากคอมพิ​ิวเตอร์​์ที่​่�มี​ีลั​ักษณะใกล้​้เคี​ียงสิ่​่�งพิ​ิมพ์​์จริ​ิงมากที่​่�สุ​ุด

ภาพที่​่� 2.6 ภาพเลย์​์เอาท์​์ที่​่�ออกแบบเสร็​็จสมบู​ูรณ์​์ ที่​่�มา : นุ​ุจรี​ี บุ​ุรี​ีรั​ัตน์​์ (2564)

4. ดั​ัมมี่​่�

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

- 51 -

2. งานออกแบบตั​ัวอั​ักษร

การออกแบบตั​ัวอั​ักษร Typography หรื​ือ Font Design นั่​่�นเอง ลั​ักษณะที่​่�ใช้​้ ในการออกแบบ เป็​็นการนำำ�ตั​ัวอั​ักษรมาสร้​้างรู​ูปลั​ักษณะที่​่�จำำ�เพาะเจาะจง เพื่​่อ� ให้​้เกิ​ิดมิ​ิติ​ิของ ความสวยงามและมี​ีเอกลั​ักษณ์​์ เช่​่น การออกแบบ Logotype ที่​่�ใช้​้เป็​็นเครื่​่�องหมายการค้​้าหรื​ือ ส่​่วนหนึ่​่�งของ Branding ต่​่างๆ โดยใช้​้ตั​ัวอั​ักษรเป็​็นหลั​ัก เป็​็นส่​่วนหนึ่​่�งของงาน Typography แต่​่ นอกเหนื​ือจากนั้​้�น ในงาน Graphic Design ยั​ังมี​ีการนำำ�ไปใช้​้ใน Quote, Layout หรื​ือ Form เพื่​่�อให้​้เกิ​ิด Design ที่​่�เป็​็นส่​่วนประกอบสำำ�คั​ัญ ๆ การสร้​้าง Font Design ในลั​ักษณะของลายมื​ือ เขี​ียน หรื​ือ Calligraphy Lettering เป็​็นต้​้น

หลั​ักเกณฑ์​์พื้​้�นฐานในการออกแบบตั​ัวอั​ักษร หรื​ือ Typography ประกอบด้​้วย

1. รู​ูปแบบ (Form) คื​ือ มี​ีแนวคิ​ิดที่​่�เป็​็นหลั​ักเกณฑ์​์ รู​ูปแบบที่​่�ชั​ัดเจน เช่​่น ชิ​ิดซ้​้าย ชิ​ิด ขวาจั​ัดกึ่​่�งกลาง สมดุ​ุลย์​์น้ำ�ำ� หนั​ัก ระยะห่​่างบรรทั​ัด

2. การสื่​่�อสาร (Communication) คื​ือ เมื่​่�อออกแบบมาแล้​้ว ก็​็สามารถตี​ีความหมายได้​้ ง่​่ายขึ้​้�น เช่​่น การตั​ัดบรรทั​ัด การเน้​้นน้ำำ�� หนั​ักของคำำ�

3. ความแตกต่​่าง (Difference) งานออกแบบของเรามี​ีความแตกต่​่าง เช่​่น มี​ีการ ออกแบบที่​่�ไม่​่ธรรมดา ไม่​่หนา ก็​็บาง ไม่​่ใหญ่​่ ก็​็เล็​็ก ไม่​่บี​ีบช่​่องไฟ ก็​็กระจายตั​ัวอั​ักษร มี​ีการ ดั​ัดแปลง หรื​ือเพิ่​่�มองค์​์ประกอบอื่​่�นๆ เช่​่น เส้​้น จุ​ุด อื่​่�นๆ เพื่​่�อสร้​้างมิ​ิติ​ิของการสร้​้างสรรค์​์ ที่​่�แตก ต่​่าง เป็​็นต้​้น งานออกแบบตั​ัวอั​ักษรกำำ�ลั​ังเป็​็นที่​่�กล่​่าวถึ​ึงกั​ันในปั​ัจจุ​ุบั​ัน นั​ักออกแบบตั​ัวอั​ักษรจะถู​ูก เรี​ียกว่​่า Type Design

ภาพที่​่� 2.7 ตั​ัวอย่​่าง Hand written font ที่​่�มา : https://www.pinterest.com (2564)

- 52 -

3. อิ​ินฟอร์​์เมชั​ันดี​ีไซน์​์

หลั​ักการออกแบบอิ​ินฟอร์​์เมชั​ันดี​ีไซน์​์

งานอิ​ินฟอร์​์เมชั​ัน มี​ีพื้​้น� ฐานทางประวั​ัติศิ าสตร์​์มาจากการเขี​ียนแผนที่​่�หรื​ือการ วางผั​ัง รวมทั้​้�งการทำำ�การ์​์ดง่​่ายๆ ที่​่�จะต้​้องสร้​้างภาษาเป็​็นสากลในการอ่​่านแบบให้​้ออก

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

การออกแบบอิ​ินฟอร์​์เมชั​ันดี​ีไซน์​์ที่​่�ดี​ีจะตั้​้�งอยู่​่�บนหลั​ักการพื้​้�นฐาน 5 ข้​้อดั​ังนี้​้�

1. อ่​่านเข้​้าใจง่​่ายไม่​่ซั​ับซ้​้อนหรื​ือสั​ับสน

2. ภาษาภาพเป็​็นเรื่​่�องสำำ�คั​ัญมากซึ่​่�งจะต้​้องง่​่ายต่​่อการรั​ับรู้​้�ของมนุ​ุษย์​์

3. สี​ีที่​่�ใช้​้จะเป็​็นเครื่​่�องมื​ือสำำ�คั​ัญในการแบ่​่งชนิ​ิด ประเภท

4. ฟอนต์​์ที่​่�ใช้​้ควรเหมาะแก่​่การอ่​่าน เช่​่น ภาษาไทยก็​็ควรมี​ีหั​ัว เพราะตั​ัว อิ​ินฟอร์​์เมชั​ันดี​ีไซน์​์มั​ักซั​ับซ้​้อนระดั​ับหนึ่​่�งอยู่​่�แล้​้ว ถ้​้ายิ่​่�งใช้​้ฟอนต์​์ที่​่�อ่​่านยากเข้​้าไปอี​ีกก็​็จะลำำ�บาก

5. ออกแบบให้​้มี​ีความกลมกลื​ืนกั​ันและบ่​่งบอกบุ​ุคลิ​ิกของสิ่​่�งที่​่�ต้​้องการสื่​่�อ

4. งานอิ​ินเตอร์​์แอ็​็คที​ีฟกราฟิ​ิก

งานอิ​ินเตอร์​์แอ็​็คที​ีฟกราฟิ​ิก มี​ีพื้​้�นฐานมาจากงานศิ​ิลปะที่​่�เรี​ียกกั​ันว่​่า Installation Art แล้​้วบวกด้​้วยทั​ักษะในการออกแบบกราฟิ​ิก คื​ือใช้​้กราฟิ​ิกให้​้มี​ีปฏิ​ิสั​ัมพั​ันธ์​์กั​ับผู้​้�ดู​ู เช่​่น งานออกแบบการเปิ​ิดเทศกาลต่​่างๆ การแสดงข้​้อมู​ูลต่​่าง ๆ เป็​็นต้​้น

ภาพที่​่� 2.8 ตั​ัวอย่​่างงานอิ​ินเตอร์​์แอ็​็คที​ีฟกราฟิ​ิก ที่​่�มา : https://www.tableau.com (2564)

- 53 -

5. งานออกแบบเว็​็บไซต์​์

การออกแบบโครงสร้​้างเว็​็บไซต์​์

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

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

ภาพที่​่� 2.9 โครงสร้​้างเว็​็บไซต์​์ ที่​่�มา : นุ​ุจรี​ี บุ​ุรี​ีรัตน์ ั ์ (2564)

- 54 -

การออกแบบหน้​้าต่​่างเว็​็บไซต์​์

การออกแบบเว็​็บไซต์​์ให้​้ได้​้ประสิ​ิทธิ​ิภาพใน 8 ขั้​้�นตอน

1. วางแผนการจั​ัดทำำ�เว็​็บไซต์​์ ขั้​้�นตอนนี้​้�ต้​้องมี​ีการจั​ัดเตรี​ียมข้​้อมู​ูลเป็​็นลำำ�ดับั แรก ตั้​้�งแต่​่ การตั้​้�งชื่​่�อ เป้​้าหมายของเว็​็บไซต์​์ กลุ่​่�มเป้​้าหมาย เนื้​้�อหาภาพในเว็​็บไซต์​์และรายละเอี​ียดข้​้อมู​ูลที่​่� จะให้​้ปรากฏในเว็​็บไซต์​์ เพื่​่�อให้​้เห็​็นมุ​ุมมองแบบคร่​่าวๆ ก่​่อนลงมื​ือทำำ�และควรจั​ัดแบ่​่งเนื้​้�อหาให้​้ เป็​็นหมวด

2. กำำ�หนดโครงสร้​้างของเว็​็บไซต์​์ หลั​ังจากการประชุ​ุมเพื่​่�อวางแผนการจั​ัดทำำ�เว็​็บไซต์​์ เรี​ียบร้​้อยแล้​้ว ขั้​้�นตอนต่​่อไปคื​ือ การกำำ�หนดผั​ังของเว็​็บไซต์​์ เพื่​่�อให้​้มองเห็​็นภาพรวม และองค์​์ ประกอบทั้​้�งหมดของเว็​็บไซต์​์ หรื​ือที่​่�เรี​ียกว่​่า Flowchart โดยหน้​้าแรกของเว็​็บไซต์​์ หรื​ือ โฮมเพจ จะต้​้องใช้​้ชื่​่�อว่​่า index ส่​่วนนามสกุ​ุลให้​้ใส่​่ตามลั​ักษณะของภาษาที่​่�ใช้​้ในการสร้​้าง เว็​็บไซต์​์ การตั้​้�งชื่​่�อเว็​็บเพจของแต่​่ละหน้​้านั้​้�น ให้​้กำำ�หนดชื่​่�อเป็​็นภาษาอั​ังกฤษและตามด้​้วย นามสกุ​ุลของภาษาที่​่�เราทำำ�การสร้​้างเว็​็บไซต์​์ เช่​่น index.html, home.html, history.html เป็​็นต้​้น

ภาพที่​่� 2.10 โฮมเพจ index.php ที่​่�มา : นุ​ุจรี​ี บุ​ุรี​ีรั​ัตน์​์ (2564)

- 55 -

3. การเชื่​่�อมโยงของเว็​็บเพจ

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

คลิ​ิกจุ​ุดเชื่​่�อมโยง “ถ้ำำ��มรกต” เพื่​่�อเชื่​่�อมโยงไป ยั​ังอี​ีกหน้​้าเว็​็บหนึ่​่�งภายในเว็​็บไซต์​์เดี​ียวกั​ัน

ภาพที่​่� 2.11 การเชื่​่�อมโยงของเว็​็บเพจ ที่​่�มา : นุ​ุจรี​ี บุ​ุรี​ีรั​ัตน์​์ (2564)

4. การออกแบบเว็​็บเพจในแต่​่ละหน้​้าเว็​็บไซต์​์

การออกแบบเว็​็บเพจแต่​่ละหน้​้าในเว็​็บไซต์​์ มี​ีส่​่วนหลั​ักๆ อยู่​่� 3 ส่​่วนคื​ือ

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

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

- 56 -

ระเบี​ียบและอ่​่านง่​่าย รวมถึ​ึงการจั​ัดเลย์​์เอาท์​์ด้​้วยเช่​่นเดี​ียวกั​ัน

3. ส่​่วนที่​่�เป็​็น Page Footer คื​ือส่​่วนที่​่�อยู่​่�ด้​้านล่​่างสุ​ุดของหน้​้าเว็​็บเพจ ตรง นี้​้�ส่​่วนใหญ่​่จะใช้​้วางระบบนำำ�ทาง หรื​ือเนวิ​ิเกชั่​่�น โดยทำำ�เป็​็นลิ​ิงก์​์ข้​้อความง่​่ายๆ รวมถึ​ึงอาจ แสดงข้​้อมู​ูลเนื้​้�อหาเพิ่​่�มเติ​ิมภายในเว็​็บไซต์​์ เช่​่น ข้​้อความแสดงลิ​ิขสิ​ิทธิ์​์� วิ​ิธี​ีการติ​ิดต่​่อกั​ับผู้​้�ดู​ูแล เว็​็บไซต์​์ คำำ�แนะนำำ�การใช้​้เว็​็บไซต์​์ เป็​็นต้​้น

5. การสร้​้างเว็​็บเพจ หลั​ังจากที่​่�ได้​้จั​ัดองค์​์ประกอบของแต่​่ละหน้​้าเว็​็บเป็​็นที่​่�เรี​ียบร้​้อยแล้​้ว ขั้​้�นต่​่อไป ก็​็คื​ือ การเริ่​่�มต้​้นเขี​ียนเว็​็บ อาจจะเริ่​่�มด้​้วยการเขี​ียนด้​้วยโปรแกรมภาษา Hypertext Markup Language (HTML) หรื​ือโปรแกรม WordPress ที่​่�มี​ีการใช้​้งานง่​่ายและเป็​็นที่​่�นิ​ิยมอย่​่างมาก ในปั​ัจจุ​ุบั​ัน เพื่​่�อกำำ�หนดให้​้หน้​้าเว็​็บเพจนำำ�เสนอข้​้อความ ภาพและวิ​ิดี​ีโอ ตามรู​ูปแบบที่​่�เรา ต้​้องการ

6. การลงทะเบี​ียนขอพื้​้�นที่​่�เว็​็บไซต์​์

ภาพที่​่� 2.12 นามสกุ​ุลของเว็​็บไซต์​์เพื่​่�อขอพื้​้�นที่​่� ที่​่�มา : https://www.google.com (2564)

เป็​็นขั้​้�นตอนของการเผยแพร่​่หน้​้าเว็​็บของเรา สู่​่�โลกอิ​ินเทอร์​์เน็​็ต เพื่​่�อเปิ​ิดให้​้ ผู้​้�อื่​่�นเข้​้ามาชมและใช้​้งานภายในเว็​็บไซต์​์ จะต้​้องนำำ�เว็​็บไซต์​์ที่​่�สร้​้างขึ้​้�นนี้​้�ไปฝากไว้​้กั​ับผู้​้�ให้​้ บริ​ิการพื้​้�นที่​่�เว็​็บไซต์​์ หรื​ือที่​่�เรี​ียกว่​่าเว็​็บโฮสติ้​้�ง (Web Hosting) พร้​้อมกั​ับการจดทะเบี​ียน โดเมนเนม (Domain Name) ซึ่​่�งปั​ัจจุ​ุบั​ันก็​็มี​ีหลายเจ้​้าที่​่�ให้​้บริ​ิการ ส่​่วนราคานั้​้�นก็​็ขึ้​้�นอยู่​่�กั​ับ พื้​้�นที่​่�การใช้​้งานรวมถึ​ึงทางเลื​ือกที่​่�เพิ่​่�มเข้​้ามา

7. การอั​ัปโหลดเว็​็บไซต์​์

เมื่​่�อทำำ�การสมั​ัครเว็​็บโฮสติ้​้�งและโดเมนเนมเป็​็นที่​่�เรี​ียบร้​้อยแล้​้ว ขั้​้�นตอนต่​่อ ไปก็​็คื​ือการอั​ัปโหลดไฟล์​์เว็​็บไซต์​์ไปยั​ังเว็​็บไซต์​์ที่​่�ให้​้บริ​ิการพื้​้�นที่​่�ฝากเว็​็บไซต์​์ โดยอาจจะทำำ�การ - 57 -

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

8. การเรี​ียกดู​ูเว็​็บไซต์​์

หลั​ังจากที่​่�ทำำ�การอั​ัปโหลดไฟล์​์เว็​็บไซต์​์ขึ้​้�นบนเว็​็บไซต์​์ที่​่�ให้​้บริ​ิการพื้​้�นที่​่�ฝาก เว็​็บไซต์​์เป็​็นที่​่�เรี​ียบร้​้อยแล้​้ว สามารถเปิ​ิดดู​ูเว็​็บไซต์​์ผ่​่านทางโปรแกรมเว็​็บเบราว์​์เซอร์​์ต่​่างๆ ได้​้ ไม่​่ว่​่าจะเป็​็น Internet Explorer, Mozilla Firefox หรื​ือ Google Chrome ก็​็ตาม โดยวิ​ิธี​ี การพิ​ิมพ์​์ที่​่�อยู่​่�เว็​็บไซต์​์ตรง Address Bar จากนั้​้�นกด Enter เป็​็นอั​ันเรี​ียบร้​้อย

ภาพที่​่� 2.13 การพิ​ิมพ์​์ที่​่�อยู่​่�เว็​็บไซต์​์ตรง Address bar ที่​่�มา : นุ​ุจรี​ี บุ​ุรี​ีรั​ัตน์​์ (2564)

ภาพที่​่� 2.13 ตั​ัวอย่​่างเว็​็บไซต์​์ ที่​่�มา : นุ​ุจรี​ี บุ​ุรี​ีรั​ัตน์​์ (2564)

- 58 -

6. งานการออกแบบมั​ัลติ​ิมี​ีเดี​ีย (Multimedia)

มั​ัลติมีิ ีเดี​ีย คื​ือการนำำ�องค์​์ประกอบของสื่​่�อชนิ​ิดต่​่างๆ มาผสมผสานรวมกั​ัน ซึ่�ง่ ประกอบด้​้วย ตั​ัวอั​ักษร (Text) ภาพนิ่​่�ง (Image) ภาพเคลื่​่�อนไหว (Animation) เสี​ียง (Sound) และวี​ีดี​ีโอ (Video) โดยผ่​่านกระบวนการทางระบบคอมพิ​ิวเตอร์​์ เพื่​่�อสื่​่�อความหมายกั​ับผู้​้�ใช้​้อย่​่างมี​ี ปฏิ​ิสั​ัมพั​ันธ์​์ (Interactive Multimedia) และได้​้บรรลุ​ุตามวั​ัตถุ​ุประสงค์​์การใช้​้งาน

การออกแบบงานมั​ัลติ​ิมี​ีเดี​ีย

งานมั​ัลติ​ิมี​ีเดี​ียที่​่�ดี​ีควรจะประกอบไปด้​้วยหลั​ักการในการออกแบบดั​ังนี้​้�

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

2. เนื้​้�อหาสาระสำำ�คั​ัญที่​่�ง่​่ายต่​่อความเข้​้าใจและโครงสร้​้างที่​่�ดี​ีมี​ีผลต่​่อการรั​ับรู้​้�

3. ง่​่ายต่​่อการเตรี​ียมการแสดง

4. เสี​ียงควรจะมี​ีความสั​ัมพั​ันธ์​์กั​ับภาพ

7. งานแอนิ​ิเมชั​ัน (Animation)

แอนิ​ิเมชั​ัน (Animation) หมายถึ​ึง การสร้​้างภาพเคลื่​่�อนไหวโดยการฉายภาพ นิ่​่�งหลาย ๆ ภาพต่​่อเนื่​่�องกั​ันด้​้วยความเร็​็วสู​ูงโดยการนำำ�ภาพนิ่​่�งมาเรี​ียงต่​่อกั​ันการใช้​้คอมพิ​ิวเตอร์​์ กราฟิ​ิ ก ในการคำำ� นวณสร้​้ า งภาพจะเรี​ี ย กการสร้​้ า งภาพเคลื่​่� อ นไหวด้​้ ว ยคอมพิ​ิ ว เตอร์​์ ห รื​ือ คอมพิ​ิวเตอร์​์แอนิ​ิเมชั​ัน หากใช้​้เทคนิ​ิคการถ่​่ายภาพหรื​ือวาดรู​ูป หรื​ือหรื​ือรู​ูปถ่​่ายแต่​่ละขณะของ หุ่​่�นจำำ�ลองที่​่�ค่​่อยๆ ขยั​ับ จะเรี​ียกว่​่า ภาพเคลื่​่�อนไหวแบบการเคลื่​่�อนที่​่�หยุ​ุดหรื​ือสตอปโมชั​ัน (Stop Motion) โดยหลั​ักการแล้​้ว ไม่​่ว่​่าจะสร้​้างภาพ หรื​ือเฟรมด้​้วยวิ​ิธี​ีใดก็​็ตาม เมื่​่�อนำำ�ภาพ ดั​ังกล่​่าวมาฉายต่​่อกั​ันด้​้วยความเร็​็ว ตั้​้�งแต่​่ 16 เฟรมต่​่อวิ​ินาที​ีขึ้​้�นไป เราจะเห็​็นเหมื​ือนว่​่า ภาพ ดั​ังกล่​่าวเคลื่​่�อนไหวได้​้ต่​่อเนื่​่�องกั​ัน ทั้​้�งนี้​้�เนื่​่�องจากการเห็​็นภาพติ​ิดตา ในทางคอมพิ​ิวเตอร์​์ การจั​ัดเก็​็บภาพแบบแอนิ​ิเมชั​ันที่​่�ใช้​้กั​ันอย่​่างแพร่​่หลายในอิ​ินเทอร์​์เน็​็ต สำำ�หรั​ับการเริ่​่�มต้​้นทำำ�แอนิ​ิเมชั​ัน สิ่​่�งที่​่�สำำ�คั​ัญที่​่�สุ​ุดก็​็คื​ือสตอรี่​่�บอร์​์ด สตอรี่​่�บอร์​์ดคื​ือการ เขี​ียนกรอบแสดงเรื่อ�่ งราวที่​่ส� มบู​ูรณ์​์ของภาพยนตร์​์ หรื​ือหนั​ังแต่​่ละเรื่อ�่ งโดยมี​ีการแสดงรายละเอี​ียด ที่​่�จะปรากฏในแต่​่ละฉากหรื​ือแต่​่ละหน้​้าจอ เช่​่น ข้​้อความ ภาพ ภาพเคลื่​่�อนไหว เสี​ียงดนตรี​ี เสี​ียงพู​ูด แล้​้วแต่​่ละอย่​่างนั้​้�นจะมี​ีลำำ�ดั​ับของการปรากฏว่​่าอะไรจะปรากฏขึ้​้�นก่​่อนหลั​ัง อะไรจะ ปรากฏขึ้​้น� พร้​้อมกั​ัน เป็​็นการออกแบบอย่​่างละเอี​ียดในแต่​่ละหน้​้าจอก่​่อนที่​่จ� ะลงมื​ือสร้​้างแอนิ​ิเมชั่​่น�

- 59 -

หรื​ือหนั​ังขึ้​้�นมาจริ​ิงๆ ถ้​้าจะกล่​่าวให้​้เข้​้าใจง่​่ายๆ สตอรี่​่�บอร์​์ดคื​ือ ภาพร่​่างของช็​็อตต่​่างๆ ที่​่�วาดลงในกรอบ

ภาพที่​่� 2.14 ตั​ัวอย่​่างงานสตอรี่​่�บอร์​์ด ที่​่�มา : นุ​ุจรี​ี บุ​ุรี​ีรั​ัตน์​์ (2564)

7.1 สต็​็อปโมชั​ันกราฟิ​ิก (Stop Motion Graphic)

สต็​็อปโมชั​ัน (Stop Motion) มี​ีพื้​้�นฐานมาจาก Flip Book เป็​็นการใช้​้เทคนิ​ิคการถ่​่าย ภาพหรื​ือวาดรู​ูป หรื​ือรู​ูปถ่​่ายแต่​่ลั​ักษณะของหุ่​่�นจำำ�ลองที่​่�ค่​่อยๆ ขยั​ับเป็​็นแอนิ​ิเมชั​ันที่​่�ผู้​้�สร้​้างต้​้อง สร้​้างส่​่วนประกอบต่​่างๆ ของภาพขึ้​้�นด้​้วยวิ​ิธี​ีอื่​่�นนอกเหนื​ือจากการวาดบนแผ่​่นกระดาษหรื​ือ แผ่​่นเซล โดยการขยั​ับรู​ูปร่​่างท่​่าทางของส่​่วนประกอบเหล่​่านั้​้�นที​ีละนิ​ิดๆ แล้​้วใช้​้กล้​้องถ่​่ายไว้​้ที​ีละ เฟรม

ภาพที่​่� 2.15 ภาพสร้​้างโดยใช้​้วิ​ิธี​ีสต็​็อปโมชั​ัน ที่​่�มา : นุ​ุจรี​ี บุ​ุรี​ีรัตน์ ั ์ (2564)

- 60 -

7.2 แอนิ​ิเมชั​ันกราฟิ​ิก (Animation Graphic)

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

แอนิ​ิเมชั​ัน จะใช้​้หลั​ักการเดี​ียวกั​ับวิ​ิดี​ีโอ แต่​่แอนิ​ิเมชั​ันสามารถนำำ�ไปประยุ​ุกต์​์ ใช้​้กั​ับงานต่​่างๆ ได้​้มากมาย เช่​่น งานภาพยนตร์​์ งานโทรทั​ัศน์​์ งานพั​ัฒนาเกม งานสถาปั​ัตย์​์ งานก่​่อสร้​้าง งานด้​้านวิ​ิทยาศาสตร์​์ หรื​ืองานพั​ัฒนาเว็​็บไซต์​์

7.3 แอนิ​ิเมชั​ันพื่​่�องานโฆษณา (Animation for Advertising)

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

ภาพที่​่� 2.16 สตอรี่​่�บอร์​์ดงานโฆษณา ที่​่�มา : http://panarak.blogspot.com (2018)

- 61 -

7.4 งานแอนิ​ิเมชั​ันเพื่​่�องานภาพยนตร์​์ (Animation for Movie)

ปั​ัจจุ​ุบั​ันภาพยนตร์​์มั​ักใช้​้คอมพิ​ิวเตอร์​์กราฟิ​ิกในการช่​่วยตอบสนองการสร้​้าง ภาพที่​่�ไม่​่มี​ีขี​ีดจำำ�กั​ัด ภาพยนตร์​์คื​ือ ภาพนิ่​่�งไหลหลายๆ ภาพมาเรี​ียงต่​่อกั​ันอย่​่างต่​่อเนื่​่�อง ใช้​้หลั​ัก การที่​่�เรี​ียกว่​่าการเห็​็นภาพติ​ิดตา และเมื่​่�อนำำ�เอาภาพนิ่​่�งเหล่​่านั้​้�นมาฉายดู​ูที​ีละภาพด้​้วยอั​ัตรา ความเร็​็วในการฉายต่​่อภาพเท่​่าๆ กั​ัน สายตามนุ​ุษย์​์จะยั​ังคงรั​ักษาภาพวั​ัยที่​่�เรติ​ินาเป็​็นช่​่วงระยะ เวลาสั้​้�นๆ ประมาณ 1 ส่​่วน 3 วิ​ินาที​ี ถ้​้าหากภายในระยะเวลาดั​ังกล่​่าวมี​ีอี​ีกภาพแทรกเข้​้ามา แทนที่​่�สมองของคนจะเชื่​่�อมโยง 2 ภาพเข้​้าด้​้วยกั​ัน แล้​้วจะทำำ�หน้​้าที่​่�ดั​ังกล่​่าวต่​่อไปเรื่​่�อยๆ หากมี​ี ภาพต่​่อไปปรากฏในเวลาใกล้​้เคี​ียงกั​ัน ในกรณี​ีที่​่�ภาพแต่​่ละภาพที่​่�มองเห็​็นเป็​็นภาพที่​่�แสดงให้​้ เห็​็นถึ​ึงความสอดคล้​้องในลั​ักษณะของการเคลื่​่�อนไหว เมื่​่�อนำำ�มาเรี​ียงต่​่อกั​ันในระยะเวลากระชั้​้�น ชิ​ิดภาพนิ่​่�งเหล่​่านั้​้�นจะกลายเป็​็นภาพเคลื่​่�อนไหวที่​่�ต่​่อเนื่​่�องกั​ันเป็​็นธรรมชาติ​ิ ปั​ัจจุ​ุบั​ันความเร็​็วที่​่� ใช้​้ในการถ่​่ายทำำ�คื​ือ 24 เฟรมต่​่อ 1 วิ​ินาที​ี

ภาพที่​่� 2.17 ตั​ัวอย่​่างสตอรี่​่�บอร์​์ดงานภาพยนตร์​์ ที่​่�มา : นุ​ุจรี​ี บุ​ุรี​ีรั​ัตน์​์ (2564)

- 62 -

หลั​ักการออกแบบสั​ัญลั​ักษณ์​์

หลั​ักการออกแบบสั​ัญลั​ักษณ์​์ เป็​็นงานศิ​ิลปะที่​่�จะต้​้องนำำ�องค์​์ประกอบของการออกแบบ มาจั​ัดให้​้เกิ​ิดความสวยงาม มี​ีความเหมาะสมตามหลั​ักการออกแบบคื​ือ

1. ความเป็​็นเอกภาพ (Unity)

ความเป็​็นเอกภาพเป็​็นกลไกของความคิ​ิดและเป็​็นกลไกของสไตล์​์ เอกภาพของ สั​ัญลั​ักษณ์​์ก็​็เช่​่นเดี​ียวกั​ันแต่​่ต่​่างกั​ันที่​่�เอกภาพของงานจิ​ิตรกรรมจะอยู่​่�ในกรอบสี่​่�เหลี่​่�ยมแต่​่ เอกภาพของสั​ัญลั​ักษณ์​์จะอยูํ​ํ�ในตั​ัวของมั​ันเอง

2. ความสมดุ​ุล (Balance)

หมายถึ​ึงการจั​ั ด องค์​์ ป ระกอบให้​้ เ กิ​ิ ด ความรู้​้�สึ​ึกว่​่ า แต่​่ ล ะส่​่ ว นนั้​้� น มี​ี น้ำำ�� หนั​ั ก จากการรั​ับรู้​้�ทางสายตามี​ีความสมดุ​ุล 3 ลั​ักษณะด้​้วยกั​ันคื​ือ

2.1 ความสมดุ​ุลแบบเหมื​ือนกั​ัน

การจั​ัดภาพให้​้มี​ีลั​ักษณะภาพซ้​้าย ภาพขวาเท่​่ากั​ัน เหมื​ือนกั​ัน จั​ัดให้​้ ง่​่าย ให้​้น่​่าสนใจเหมาะสมกั​ับงาน การออกแบบสั​ัญลั​ักษณ์​์ต้​้องการ ความน่​่าเชื่​่�อถื​ือและความ ความเป็​็นทางการ

2.2 ความสมดุ​ุลแบบไม่​่เหมื​ือนกั​ัน

เป็​็นการสร้​้างสมดุ​ุลให้​้ดู​ูเท่​่ากั​ันโดยสายตา แต่​่ถ้​้าสองรู​ูปมี​ีรู​ูปทรงไม่​่ เหมื​ือนกั​ันหรื​ือมี​ีขนาดที่​่�แตกต่​่างกั​ัน จะทำำ�ให้​้เกิ​ิดความน่​่าสนใจได้​้มากกว่​่า

2.3 ความสมดุ​ุลแบบรั​ัศมี​ี

เป็​็นการจั​ัดภาพโดยใช้​้แบบอย่​่างรั​ัศมีขี องวงกลม เป็​็นการจั​ัดแบบ เดี​ียวกั​ัน ซํ้​้�าๆ กั​ันไปโดยรอบจุ​ุดศู​ูนย์​์กลาง บางรู​ูปเมื่​่�อจั​ัดแล้​้วสามารถหมุ​ุนได้​้

3. ความกลมกลื​ืน (Harmony)

การออกแบบที่​่�นำำ�สิ่​่�งที่​่�มี​ีความใกล้​้เคี​ียงกั​ัน นำำ�มาจั​ัดรวมไว้​้ด้​้วยกั​ัน จะเกิ​ิด ความลมกลื​ืนได้​้นั้​้�น จะต้​้องมี​ีตั​ัวเชื่​่�อมโยงระหว่​่างความแตกต่​่างกั​ับความเหมื​ือนกั​ัน

4. การซํ้​้�า (Repetition) ศิ​ิลป์​์ พี​ีระศรี​ี (2487) ได้​้กล่​่าวว่​่า การซํ้​้�า หมายถึ​ึง เส้​้นอย่​่างเดี​ียวกั​ัน หรื​ือ แม้​้แต่​่ลายอย่​่างเดี​ียวกั​ัน มี​ีการจั​ัดระเบี​ียบการซํ้​้�าได้​้อย่​่างมี​ีจั​ังหวะ เป็​็นการแสดงความคิ​ิดใน ศิ​ิลปะอย่​่างง่​่ายที่​่�สุ​ุด การออกแบบโดยอาศั​ัยการซํ้​้�า เป็​็นการนํ​ําองค์​์ประกอบของการออกแบบ ที่​่�เหมื​ือนๆ กั​ัน มาใช้​้หลายๆ ครั้​้�งในรู​ูปที่​่�เราต้​้องการเป็​็นสั​ัญลั​ักษณ์​์ ที่​่�ก่​่อให้​้เกิ​ิดความงามได้​้

- 63 -

5. การตั​ัดกั​ัน (Contrast)

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

6. ความลดหลั่​่�น (Gradation)

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

7. จุ​ุดเด่​่น (Dominance) คื​ือจุ​ุดที่​่�น่​่าสนใจที่​่�สุ​ุด และควรมี​ีเพี​ียงจุ​ุดเดี​ียว ในเครื่​่�องหมาย 1 ดวง ควรมี​ีจุ​ุด เด่​่นในการออกแบบ อาจจะเด่​่นเรื่​่�องของขนาด เด่​่นเรื่​่�องสี​ี เด่​่นเรื่​่�องตำำ�แหน่​่ง เด่​่นในลั​ักษณะ ของพื้​้�นผิ​ิวที่​่�แตกต่​่าง แต่​่การเด่​่นนั้​้�นจะต้​้องพิ​ิจารณาและเน้​้นให้​้เหมาะสม ไม่​่มากน้​้อยจนเกิ​ินไป คุ​ุณสมบั​ัติ​ิของสั​ัญลั​ักษณ์​์ที่​่�ดี​ี

1. มี​ีความเรี​ียบง่​่ายชั​ัดเจน

ภาพที่​่� 2.18 การออกแบบเชิ​ิงเรี​ียบง่​่าย สามารถจดจำำ�ได้​้ง่​่าย ที่​่�มา : นุ​ุจรี​ี บุ​ุรี​ีรั​ัตน์​์ (2564)

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

- 64 -

2. มี​ีเอกลั​ักษณ์​์

ภาพ 2.19 โลโก้​้บริ​ิษั​ัท APPLE สื่​่�อในเชิ​ิงเอกลั​ักษณ์​์ขององค์​์กร ที่​่�มา : https://creativetalklive.com (2564)

โลโก้​้ที่​่�มี​ีลั​ักษณะเป็​็นรู​ูปเชิ​ิงสั​ัญลั​ักษณ์​์ และจะทำำ�ให้​้จดจำำ�ได้​้ง่​่าย เช่​่น บริ​ิษั​ัท APPLE โลโก้​้ Apple มี​ีรอยกั​ัด เพราะจะทำำ�ให้​้คนรู้​้�ว่​่าเป็​็นแอปเปิ้​้�ล หากไม่​่มี​ีรอยกั​ัดจะสั​ับสนว่​่าเป็​็นลู​ูก เชอร์​์รี่​่�หรื​ือมะเขื​ือเทศ

3. จดจำำ�ได้​้ง่​่าย ดู​ูแล้​้วเหมื​ือนภาพศิ​ิลปะ หรื​ือภาพนามธรรม ตั​ัวอย่​่างการออกแบบ แบรนด์​์ที่​่�ประสบความสำำ�เร็​็จ PEPSI

ภาพที่​่� 2.20 การออกแบบเหมื​ือนภาพศิ​ิลปะ ที่​่�มา : https://th.wikipedia.org/wiki/เป๊​๊ปซี่​่� (2564)

4. สื่​่�อสารเชื่​่�อมโยงถึ​ึงสิ​ินค้​้านั้​้�นๆ

ภาพที่​่� 2.21 การออกแบบที่​่�สื่​่�อสารเชื่​่�อมโยงกั​ับตั​ัวสิ​ินค้​้า ที่​่�มา :https://www.google.com (2564)

- 65 -

4. เป็​็นสั​ัญลั​ักษณ์​์ที่​่�สวยงาม ทั​ันสมั​ัย สื่​่�อถึ​ึงมี​ีทุ​ุกอย่​่างในหนึ่​่�งเดี​ียว

ภาพที่​่� 2.22 สั​ัญลั​ักษณ์​์แบรนด์​์ด้​้านเทคโนโลยี​ี สื่​่�อความหมายตรงตั​ัวมี​ีทุ​ุกอย่​่างในหนึ่​่�งเดี​ียว ที่​่�มา : https://thejournalistclub.com (2564)

5. สื่​่�อถึ​ึงความเป็​็นอมตะหรื​ือใช้​้ได้​้ยาวนาน

ภาพที่​่� 2.23 การออกแบบแบรนด์​์ ชาแนล ด้​้วยสี​ีดำำ� แสดงให้​้เห็​็นถึ​ึงความคลาสสิ​ิก หรู​ูหรา เป็​็นอมตะ ที่​่�มา : https://thejournalistclub.com (2564)

- 66-

ฟิ​ิลลิ​ิป คอตเลอร์​์ ได้​้กล่​่าวถึ​ึงความสำำ�คั​ัญ เรื่​่�องของตราสั​ัญลั​ักษณ์​์ที่​่�ดี​ีนั้​้�น จั​ัดไว้​้เป็​็นส่​่วน หนึ่​่�งในคำำ�สั​ัญญาของผู้​้�ผลิ​ิตที่​่�จะส่​่งมอบคุ​ุณลั​ักษณะ คุ​ุณภาพ ผลประโยชน์​์และการบริ​ิการ รวม ถึ​ึงการรั​ับประกั​ันคุ​ุณภาพ โดยสามารถสื่​่�อความหมายได้​้ 6 ระดั​ับ คื​ือ คุ​ุณลั​ักษณะของสิ​ินค้​้า ตราสั​ัญลั​ักษณ์​์สิ​ินค้​้า ท าให้​้นึ​ึกถึ​ึงคุ​ุณสมบั​ัติ​ิหรื​ือคุ​ุณลั​ักษณะเด่​่นที่​่�แน่​่ชั​ัดของผลิ​ิตภั​ัณฑ์​์ ซึ่�ง่ เชื่​่�อม โยงถึ​ึงคุ​ุณประโยชน์​์อื่​่�นๆ ตามหน้​้าที่​่�ทางการตลาด การสื่​่�อทางอารมณ์​์ เช่​่น ความทนทาน แสดง ให้​้เห็​็นถึ​ึงคุ​ุณประโยชน์​์ตามหน้​้าที่​่�การใช้​้งาน ก่​่อให้​้เกิ​ิดคุ​ุณค่​่าทางวั​ัฒนธรรม โดยตราสั​ัญลั​ักษณ์​์ สิ​ินค้​้า อาจเป็​็นตั​ัวแทนของวั​ัฒนธรรมขององค์​์กรหรื​ือของประเทศผู้​้�ผลิ​ิตได้​้ ตราสิ​ินค้​้าจึ​ึงเป็​็นสิ่​่�ง บ่​่งชี้​้�ถึ​ึงบุ​ุคลิ​ิกภาพเฉพาะของสิ​ินค้​้า และสื่​่�อถึ​ึงลั​ักษณะของผู้​้�ใช้​้ตามไปด้​้วย ตราสั​ัญลั​ักษณ์​์สิ​ินค้​้า จึ​ึงไม่​่ได้​้มี​ีความเกี่​่�ยวข้​้องเฉพาะสิ​ินค้​้าและบริ​ิการเท่​่านั้​้�น แต่​่ตราสั​ัญลั​ักษณ์​์ ยั​ังมี​ีขอบข่​่ายที่​่�กว้​้าง ขวางดั​ังที่​่�ทั่​่�วไปเราสามารถสั​ังเกตเห็​็นเป็​็นสื่​่�อสั​ัญลั​ักษณ์​์ในการใช้​้งานในรู​ูปแบบต่​่างๆ อย่​่าง มากมาย (Philip Kotler, and GaryArmstrong, (2014: 250)

เครื่​่�องหมายการค้​้า

WIPO (2004) องค์​์กรทรั​ัพย์​์สิ​ินทางปั​ัญญาโลก (World Intellectual Property Organization) หรื​ือ WIPO ได้​้ให้​้คำำ�นิ​ิยามของเครื่​่�องหมายการค้​้าไว้​้ว่​่า “เครื่​่�องหมายการค้​้า คื​ือ สั​ัญลั​ักษณ์​์หรื​ือเครื่​่�องหมายใดๆ ที่​่�บ่​่งบอกและแยกแยะความความแตกต่​่างในสิ​ินค้​้าของตนจาก สิ​ินค้​้าของผู้​้�ผลิ​ิตรายอื่​่�นหรื​ือคู่​่�แข่​่ง”

1. เครื่​่�องหมายกราฟิ​ิก

1.1 เครื่​่�องหมายภาพ

• เครื่​่�องหมายที่​่�มี​ีความชั​ัดเจน

• เครื่​่�องหมายที่​่�สื่​่�อความหมาย

ภาพที่​่� 2.24 ตั​ัวอย่​่างภาพเครื่​่�องหมายการค้​้า จำำ�แนกประเภทเครื่​่�องหมายทางการค้​้า เครื่​่�องหมายบริ​ิการ เครื่​่�องหมายรั​ับรองและเครื่​่�องหมายร่​่วม ที่​่�มา : https://www.slideshare.net (2564)

- 67 -

1.2 เครื่​่�องหมายตั​ัวอั​ักษร

• เครื่​่�องหมายชื่​่�อ

- ชื่​่�อที่​่�สื่​่�อความหมายโดยตรง

- ชื่​่�ออุ​ุปมา

- ชื่​่�อเฉพาะ

- ชื่​่�อที่​่�ตั้​้�งขึ้​้�นใหม่​่

• เครื่​่�องหมายที่​่�ใช้​้ชื่​่�อย่​่อ

2. องค์​์ประกอบกราฟิ​ิกที่​่�ไม่​่ใช่​่เครื่​่�องหมายกราฟิ​ิก

ข้​้อมู​ูลสำำ�หรั​ับนั​ักออกแบบสั​ัญลั​ักษณ์​์ นั​ักการตลาดหรื​ือนั​ักวางกลยุ​ุทธ์​์ทางธุ​ุรกิ​ิจ จะเป็​็นผู้​้�ค้​้นหาอั​ัตลั​ักษณ์​์ของแบรนด์​์สิ​ินค้​้า แต่​่หน้​้าที่​่�ของนั​ักออกแบบสั​ัญลั​ักษณ์​์คื​ือ การออกแบบสั​ัญลั​ักษณ์​์แบบรู​ูปธรรมให้​้สื่​่�อถึ​ึงรู​ูปธรรม และนามธรรมให้​้ปรากฏตรงตามอั​ัตลั​ักษณ์​์ที่​่�องค์​์กรนั้​้�นกำำ�หนด สิ่​่�งที่​่�นั​ักออกแบบสั​ัญลั​ักษณ์​์จะต้​้องเข้​้าใจเป็​็นพื้​้�นฐาน ได้​้แก่​่

1. อั​ัตลั​ักษณ์​์องค์​์กร (Corporate Identity) หมายถึ​ึง การแสดงออกให้​้เห็​็นถึ​ึงภาพลั​ักษณ์​์ ที่​่�ปรากฏต่​่อสายตาผู้​้�อื่​่�น พร้​้อมๆ กั​ับแสดงถึ​ึงความเป็​็นอั​ัตลั​ักษณ์​์ขององค์​์กรนั้​้�นๆ โดยอาศั​ัย องค์​์ประกอบทางกราฟิ​ิก

2. ภาพลั​ักษณ์​์องค์​์กร หมายถึ​ึง ภาพที่​่�องค์​์กรปรากฏต่​่อสาธารณชนผ่​่านทางผลิ​ิตภั​ัณฑ์​์ นโยบาย การโฆษณา และที่​่�สำำ�คั​ัญคื​ือ เครื่​่�องหมายการค้​้าซึ่​่�งเป็​็นสิ่​่�งที่​่�คอยตอกย้ำ�ให้​้ระลึ​ึกถึ​ึง ภาพลั​ักษณ์​์องค์​์กร

3. รู​ูปแบบของอั​ัตลั​ักษณ์​์องค์​์กร การกำำ�หนดรู​ูปแบบเพื่​่�อสร้​้างอั​ัตลั​ักษณ์​์องค์​์กร คื​ือ การกำำ�หนดรู​ูปร่​่างหน้​้าตาขององค์​์กรหรื​ือภาพที่​่�ปรากฏในใจผู้​้�บริ​ิโภค

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

- 68 -

ข้​้อมู​ูลเพื่​่�อการออกแบบ

องค์​์ประกอบพื้​้�นฐานในการออกแบบโลโก้​้

การออกแบบสั​ัญลั​ักษณ์​์ ข้​้อมู​ูลเบื้​้�องต้​้นที่​่ค� วรทราบในการออกแบบตราสั​ัญลั​ักษณ์​์ จะ ประกอบไปด้​้วยสิ่​่ง� ต่​่างๆ ดั​ังต่​่อไปนี้​้�

1. ประวั​ัติ​ิความเป็​็นมาขององค์​์กร

2. โครงสร้​้างองค์​์กร

3. การดำำ�เนิ​ินงานของคู่​่�แข่​่ง

4. การดำำ�เนิ​ินการตลาดและโฆษณา

5. การใช้​้งานสั​ัญลั​ักษณ์​์

6. ข้​้อมู​ูลจากการวิ​ิจั​ัย

7. ภาพลั​ักษณ์​์ที่​่�เหมาะสม ในการออกแบบโลโก้​้ซึ่ง�่ เป็​็นภาษาภาพที่​่�ถูกู ตั​ัดทอนให้​้ง่า่ ยต่​่อการเข้​้าใจ การจดจำำ� และ การสื่​่อ� สาร นั​ักออกแบบจะต้​้องนำำ�องค์​์ประกอบต่​่างๆ ที่​่�ได้​้ศึ​ึกษามาใช้​้งานร่​่วมกั​ัน

องค์​์ประกอบต่​่างๆ ที่​่มั� กั จะถู​ูกนำำ�มาใช้​้ในการออกแบบโลโก้​้จะมี​ีอยู่​่� 5 องค์​์ประกอบคื​ือ

1. จุ​ุด เส้​้น ระนาบ เป็​็นการนำำ�ความเชื่​่�อมโยงของ 3 องค์​์ประกอบมาใช้​้ในการออกแบบ จุ​ุด (Dot) เป็​็นองค์​์ประกอบที่​่�เล็​็กที่​่�สุ​ุด แต่​่มี​ีความสำำ�คั​ัญของการไปสู่​่�การเกิ​ิดองค์​์ประกอบอื่​่�นๆ ลั​ักษณะเด่​่นของจุ​ุดคื​ือ มี​ีมิ​ิติ​ิเป็​็นศู​ูนย์​์ ไม่​่มี​ีความกว้​้าง ยาวและลึ​ึก จุ​ุดเป็​็นสิ่​่�งที่​่�ใช้​้ในการสร้​้างรู​ูป ทรงและสร้​้างพลั​ังความเคลื่​่�อนไหวของพื้​้�นที่​่�ว่​่างในภาพ เส้​้นคื​ือการนำำ�จุ​ุดมาเรี​ียงต่​่อกั​ัน ทำำ�ให้​้มี​ี ความยาวต่​่อเนื่​่�องกั​ัน ดู​ูง่​่ายเป็​็นระเบี​ียบมากขึ้​้�น ระนาบ เป็​็นการสานต่​่อของเส้​้น เป็​็นสั​ัญลั​ักษณ์​์ ของความเท่​่ากั​ัน ซึ่​่�งทำำ�ให้​้ดูมีู ีระเบี​ียบและมี​ีความสมมาตร มากขึ้​้�น

ภาพที่​่� 2.25 การออกแบบโดยใช้​้การเชื่​่�อมโยงจุ​ุด เส้​้น ระนาบ ที่​่�มา : http://119.46.166.126/self_all/selfaccess9/m3/553/lesson1/item1.php (2564)

- 69 -

2. สี​ี หมายถึ​ึงปรากฏการณ์​์ที่​่�แสงส่​่องกระทบวั​ัตถุ​ุแล้​้วสะท้​้อนคลื่​่�นแสงบางส่​่วนเข้​้าตา ระบบประสาทตาจะประมวลผลให้​้สามารถรั​ับรู้​้�ถึ​ึงขนาด รู​ูปร่​่าง ลั​ักษณะผิ​ิวและสี​ี ของวั​ัตถุ​ุมี​ีสี​ีต่​่างกั​ันเกิ​ิดจากคุ​ุณสมบั​ัติ​ิในการดู​ูดกลื​ืนและสะท้​้อนคลื่​่�นแสงที่​่�แตกต่​่างกั​ัน

3. ที่​่�ว่​่างบวก กั​ับที่​่�ว่​่างลบ ที่​่�ว่​่างบวก หมายถึ​ึงที่​่�ว่​่างที่​่�เป็​็นรู​ูป ส่​่วนที่​่�ว่​่างลบ หมายถึ​ึงที่​่� ว่​่างที่​่�ล้​้อมรอบวั​ัตถุ​ุ มี​ีลั​ักษณะเป็​็นพื้​้�นฉากหลั​ัง

4. การลดทอน คื​ือการสร้​้างสรรค์​์งานศิ​ิลปะในลั​ักษณะบิ​ิดเบื​ือนไปจากของจริ​ิง โดยจะ ให้​้ความสำำ�คั​ัญกั​ับรู​ูปแบบที่​่�เหมื​ือนจริ​ิงน้​้อยลง แต่​่ให้​้ความสำำ�คั​ัญกั​ับรู​ูปแบบจากความคิ​ิดของ นั​ักออกแบบมากขึ้​้�น

5. การเล่​่นกั​ับตัวั อั​ักษร คื​ือ สร้​้างลู​ูกเล่​่นบางอย่​่างให้​้กับตั ั วั อั​ักษร ด้​้วยความคิ​ิดแบบ Wit

ภาพที่​่� 2.26 การออกแบบสร้​้างลู​ูกเล่​่นให้​้กับตั ั ัวอั​ักษร ที่​่�มา : https://www.beartheschool.com/share-1/2018/10/10/typography(2564) https://www.shutterstock.com/th/blog/black-and-white-designs/(2564)

- 70 -

สี​ีและการสื่​่�อความหมาย

สี​ีที่​่�นิ​ิยมนำำ�มาใช้​้ในการออกแบบ

ทั้​้�งในความหมายด้​้านบวกและด้​้านลบ (อารยะ ศรี​ีกั​ัลยาณบุ​ุตร, 2541 : 23) ได้​้นำำ�เสนอและอธิ​ิบายความหมายของสี​ีดั​ังตารางดั​ังนี้​้� สี​ี สี​ีขาว

สี​ีดำำ� สี​ีแดง สี​ีเขี​ียว สี​ีเหลื​ือง สี​ีน้ำำ��เงิ​ิน สี​ีน้ำำ��ตาล

สี​ีม่​่วง สี​ีส้​้ม สี​ีเทา

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

ความหมายทางด้​้านลบ ความว่​่างเปล่​่า ความเงี​ียบสนิ​ิท ช่​่องว่​่าง ภู​ูติ​ิผี​ี ความตาย หมดหวั​ัง ปฏิ​ิเสธ บาป ปี​ีศาจ ความเงี​ียบนิ​ิรั​ันดร์​์ ความสยดสยอง สงคราม เลื​ือด ความวุ่​่�นวาย ปี​ีศาจ ความอิ​ิจฉาริ​ิษยา ความเฉื่​่�อย ความขี้​้�ขลาด การทรยศ ความเฉยเมย ความสงสั​ัย ความซึ​ึม เศร้​้า ความอวดดี​ี ความเก่​่า

ตั​ัณหา ความโศกเศร้​้า ความลึ​ึกลั​ับ การให้​้ร้​้าย ความอิ​ิจฉาริ​ิษยา ความลั​ังเล ความกลั​ัว ความน่​่าเบื่​่�อ ความหดหู่​่� ความแก่​่เฒ่​่า

ตารางแสดงความหมายของสี​ีที่​่นิ� ยม ิ นำำ�มาใช้​้ในการออกแบบ

- 71 -

ตั​ัวอย่​่างการออกแบบสั​ัญลั​ักษณ์​์

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

เมื่​่�อตี​ีโจทย์​์ และได้​้แนวคิ​ิดการออกแบบเรี​ียบร้​้อยแล้​้ว จึ​ึงสเก็​็ตซ์​์ภาพร่​่างก่​่อนออกแบบ กั​ับโปรแกรม Illustator

1. สร้​้างหน้​้ากระดาษใหม่​่ กดปุ่​่�ม ctrl + “ เพื่​่อ� แสดงเส้​้น Guide ขึ้​้น� มาบนกระดานวาด

2. คลิ​ิกเมนู​ู View > Smart Guides

3. คลิ​ิกเลื​ือก Snap to Guide เพื่​่�อความแม่​่นยำำ�ในการวาดเส้​้น

2 3

4. คลิ​ิกเครื่​่�องมื​ือ Ellipse Tool คลิ​ิกช่​่องสี​ี Fill ปรั​ับเอาสี​ีพื้​้�นออก ให้​้เหลื​ือเพี​ียงเส้​้นขอบสี​ีดำำ�

4 5

5. กดปุ่​่ม� Shift ค้​้างแล้​้วแดรกเมาส์​์

- 72 -

6

7

6. คลิ​ิกเครื่​่�องมื​ือ Scissor Tool กรรไกรตั​ัดเส้​้น คลิ​ิกสร้​้างจุ​ุดตั​ัดบนเส้​้นสองจุ​ุด แล้​้วกดปุ่​่�ม ctrl + คลิ​ิกเส้​้นที่​่�ต้​้องการลบ และกดปุ่​่�ม Delete 7. คลิ​ิกเครื่​่�องมื​ือ Pen Tool คลิ​ิกซ้ำำ�ที่​่ � �จุ​ุดตั​ัดเพื่​่�อเริ่​่�มต้​้นวาดกั​ับเส้​้นเดิ​ิม กดปุ่​่�ม Shift ค้​้างไว้​้ พร้​้อมกั​ับคลิ​ิกสร้​้างเส้​้นแนวนอนและแนวตั้​้�งออกมา

8

8. คลิ​ิกเลื​ือกเส้​้นขอบที่​่�สร้​้างไว้​้ เลื​ือกเมนู​ู Object > Expand กดปุ่​่�ม OK เพื่​่�อเปลี่​่�ยนเส้​้นขอบเป็​็นภาพเวกเตอร์​์

- 73 -

9

10 11

12

9. คลิ​ิกเครื่​่�องมื​ือ Rectangle Tool แดรกเมาส์​์วาดรู​ูปสี่​่�เหลี่​่�ยมผื​ืนผ้​้า บริ​ิเวณหาง ตั​ัว G ที่​่�ต้​้องการตั​ัดเจาะวั​ัตถุ​ุ 10. กดปุ่​่�ม Shift + ctrl +F9 ใช้​้งานพาแนล Pathfinder 11. กดปุ่​่�ม Shift + คลิ​ิกเลื​ือกทั้​้�งสองวั​ัตถุ​ุ 12. คลิ​ิกปุ่​่�ม Minas Front ส่​่วนที่​่�วั​ัตถุทั้​ุ้ �งสองซ้​้อนทั​ับกั​ันจะถู​ูกลบทิ้​้�งไป

13

13. ปรั​ับแต่​่งเลื​ือกลงสี​ีเส้​้น ได้​้ตามต้​้องการ

- 74 -

14

GRAPHIC DESIGN GHAPHIC DESIGN

14. พิ​ิมพ์​์ข้​้อความใต้​้สั​ัญลั​ักษณ์​์ เมื่​่�อปรั​ับแต่​่งข้​้อความเรี​ียบร้​้อยแล้​้วให้​้กดปุ่​่�ม Shift + Ctrl + O เพื่​่�อเปลี่​่�ยนฟอนต์​์ตั​ัวหนั​ังสื​ือให้​้เป็​็นภาพเวกเตอร์​์

GHAPHIC GRAPHICDESIGN DESIGN

16

15. เมื่​่�อออกแบบสั​ัญลั​ักษณ์​์เสร็​็จเรี​ียบร้​้อยแล้​้วให้​้บั​ันทึ​ึกโดยกดปุ่​่�ม Shift + ctrl + S เพื่​่�อบั​ันทึ​ึกเป็​็นไฟล์​์ AI

16. คลิ​ิกเมนู​ู File > Export เพื่​่�อบั​ันทึ​ึกเป็​็นไฟล์​์ .jpg

- 75 -

GRAPHIC DESIGN DESIGN GRAPHIC ภาพสั​ัญลั​ักษณ์​์ที่​่�มี​ีการ Export เป็​็นไฟล์​์ .jpg เรี​ียบร้​้อยแล้​้ว

- 76 -

03

การใช้​้งานโปรแกรมคอมพิ​ิวเตอร์​์เพื่​่�อสร้​้างสรรค์​์สื่​่�อ

โปรแกรมที่​่�ใช้​้ในการออกแบบกราฟิ​ิก

การใช้​้โปรแกรม Adobe Photoshop

โปรแกรม Adobe Photoshop เป็​็นโปรแกรมในตระกู​ูล Adobe ที่​่�ใช้​้สำำ�หรั​ับตกแต่​่ง ภาพถ่​่ายและภาพกราฟิ​ิก ได้​้อย่​่างมี​ีประสิ​ิทธิ​ิภาพ ไม่​่ว่​่าจะเป็​็นงานด้​้านสิ่​่�งพิ​ิมพ์​์ นิ​ิตยสาร และ งานด้​้านมั​ัลติ​ิมี​ีเดี​ีย อี​ีกทั้​้�งยั​ังสามารถ Retouching ตกแต่​่งภาพและการสร้​้างภาพ ซึ่�ง่ กำำ�ลั​ังเป็​็น ที่​่�นิ​ิยมสู​ูงมากในขณะนี้​้� เราสามารถใช้​้โปรแกรม Photoshop ในการตกแต่​่งภาพ การใส่​่เอฟเฟค ต่​่างๆ ให้​้กั​ับภาพ และตั​ัวหนั​ังสื​ือ การทำำ�ภาพขาวดำำ� การทำำ�ภาพถ่​่ายเป็​็นภาพเขี​ียน การนำำ�ภาพ มารวมกั​ันการตกแต่​่งภาพต่​่างๆ

ภาพที่​่� 3.1 Logo โปรแกรม Adobe Photoshop

- 77 -

ภาพที่​่� 3.2 หน้​้าต่​่างและเครื่​่�องมื​ือโปรแกรม Adobe Photoshop ที่​่�มา : นุ​ุจรี​ี บุ​ุรี​ีรั​ัตน์​์ (2564)

เครื่​่�องมื​ือและคุ​ุณสมบั​ัติ​ิของโปรแกรม Adobe Photoshop

แถบเมนู​ูคำำ�สั่​่�ง (Menu bar) ประกอบด้​้วยกลุ่​่�มคำำ�สั่​่�งต่​่างๆ ที่​่�ใช้​้ในการจั​ัดการไฟล์​์, ทำำ�งานกั​ับรู​ูปภาพ และใช้​้การปรั​ับแต่​่งการทำำ�งานของโปรแกรม โดยแบ่​่งเมนู​ูตามลั​ักษณะงาน นอกจากนี้​้�ยั​ังมี​ีเมนู​ูย่​่อยออกมาจากเมนู​ูหลั​ัก โดยสั​ังเกตจากการคลิ​ิกเข้​้าไปที่​่�เมนู​ู

แถบตั​ัวเลื​ือก (Option Bar) เป็​็นส่​่วนที่​่�ใช้​้ปรั​ับแต่​่งค่​่าการทำำ�งานของเครื่​่�องมื​ือต่​่างๆ โดยรายละเอี​ียดใน Option Bar จะเปลี่​่�ยนไปตามเครื่​่อ� งมื​ือที่​่�เราเลื​ือกจาก Toolbox ในขณะนั้​้น� เช่​่น เมื่​่�อเราเลื​ือกเครื่​่�องมื​ือ Brush (พู่​่�กั​ัน) บน Option Bar จะปรากฏ Option ที่​่�ใช้​้ในการ กำำ�หนดขนาด และลั​ักษณะหั​ัวแปรง, โหมดในการ ระบายความโปร่​่งใสของสี​ี และอั​ัตราการไหล ของสี​ี เป็​็นต้​้น

กล่​่องเครื่​่�องมื​ือ (Toolbox) จะเป็​็นแถบเครื่​่�องมื​ือพื้​้�นฐานในการทำำ�งานในโปรแกรม สามารถเรี​ียกใช้​้ชุดุ เครื่​่อ� งมื​ือย่​่อย โดยการคลิ​ิกรู​ูปสามเหลี่​่ย� มมุ​ุมด้​้านล่​่างขวาของแต่​่ละเครื่​่อ� งมื​ือ พาเนล (Panel) เป็​็นวิ​ินโดว์​์ย่อ่ ยที่​่ใ� ช้​้เลื​ือกรายละเอี​ียด หรื​ือคำำ�สั่​่ง� ควบคุ​ุมการทำำ�งานต่​่างๆ ของโปรแกรมใน Photoshop มี​ีพาเนลอยู่​่�เป็​็นจำำ�นวนมาก เช่​่น พาเนล Color ใช้​้สำำ�หรั​ับการ เลื​ือกสี​ี, พาเนล Layer ใช้​้สำ�ำ หรั​ับการจั​ัดการเลเยอร์​์และพาเนล Info ใช้​้แสดงค่​่าสี​ีตรงตำำ�แหน่​่งที่​่� ชี้​้�เม้​้าส์​์ รวมถึ​ึงขนาด และตำำ�แหน่​่งของพื้​้�นที่​่�ที่​่�เลื​ือกไว้​้

- 78 -

การสร้​้างตั​ัวอั​ักษรโดยมี​ีรู​ูปภาพอยู่​่�ในตั​ัวอั​ักษร ด้​้วยโปรแกรม Adobe Photoshop

1.

2.

3.

4.

สร้​้างหน้​้ากระดาษใหม่​่ Ctrl + N คลิ​ิกเครื่​่�องมื​ือ Type หรื​ือคี​ีย์​์ลั​ัด T เลื​ือกแบบตั​ัวอั​ักษร ขนาด การจั​ัดแถว และ สี​ี ที่​่�อยู่​่�ในแถบเมนู​ู Options คลิ​ิกที่​่�รู​ูปภาพและพิ​ิมพ์​์ข้​้อความลงในรู​ูป

ภาพที่​่� 3.3 การออกแบบลั​ักษณะตั​ัวอั​ักษร ที่​่�มา : นุ​ุจรี​ี บุ​ุรี​ีรั​ัตน์​์ (2564)

Layer

5. ลาก Background Layer ไปยั​ังปุ่​่�ม New Layer เพื่​่�อเพิ่​่�ม Background Copy อี​ีก 6. ลาก Background Copy ไปไว้​้ข้​้างบนเลเยอร์​์ตั​ัวอั​ักษร 7. คลิ​ิก Layer 8. เลื​ือก Create Clipping Mask หรื​ือ คี​ีย์​์ลั​ัด Alt + Ctrl + G

- 79 -

ภาพที่​่� 3.4 การออกแบบลั​ักษณะตั​ัวอั​ักษร ที่​่�มา : นุ​ุจรี​ี บุ​ุรี​ีรั​ัตน์​์ (2564)

9. (A) Background Copy ที่​่�อยู่​่�ในหน้​้าต่​่างของ Layers จะมี​ีลู​ูกศรชี้​้�ลง แต่​่ภาพถ่​่ายที่​่� ปรากฏอยู่​่�ในหน้​้าจอจะยั​ังมี​ีลั​ักษณะเหมื​ือนเดิ​ิม

10. เลื​ือก Layer ตั​ัวอั​ักษร

11. กด Ctrl แล้​้วคลิ​ิกที่​่�ปุ่​่�ม New Layer เพื่​่�อเพิ่​่�มอี​ีก Layer ไว้​้ด้​้านล่​่างของตั​ัวอั​ักษร

12. เลื​ือกสี​ีของ Background

13. กด Alt + Backspace เพื่​่�อทำำ�ให้​้ Layer เป็​็นสี​ีตามที่​่�เรากำำ�หนดไว้​้

- 80 -

14. คลิ​ิกที่​่�เครื่​่�องมื​ือ Move 15. คลิ​ิกที่​่� Background copy layer 16. จากนั้​้�นเลื่​่�อนรู​ูปภาพไปยั​ังตำำ�แหน่​่งของตั​ัวหนั​ังสื​ือตามที่​่�ต้​้องการ

ภาพที่​่� 3.5 การนำำ�ภาพพื้​้�นหลั​ังใส่​่ในตั​ัวอั​ักษร ที่​่�มา : นุ​ุจรี​ี บุ​ุรี​ีรั​ัตน์​์ (2564)

- 81 -

ภาพที่​่� 3.6 Logo โปรแกรม Adobe Illustrator

การใช้​้โปรแกรม Adobe Illustrator

โปรแกรม Adobe Illustrator เป็​็นอี​ีกหนึ่​่�งโปรแกรมจากค่​่าย Adobe ที่​่�เป็​็นนั​ักพั​ัฒนา โปรแกรมชื่​่�อดั​ังหลายอย่​่าง สำำ�หรั​ับหน้​้าที่​่�หลั​ักของโปรแกรม Adobe Illustrator คื​ือโปรแกรม ที่​่�ใช้​้ในการวาดภาพ โดยจะสร้​้างภาพที่​่�มี​ีลั​ักษณะเป็​็นลายเส้​้น หรื​ือที่​่�เรี​ียกว่​่า Vector Graphic นั​ับได้​้ว่​่าเป็​็นโปรแกรมระดั​ับมื​ืออาชี​ีพที่​่�ใช้​้กั​ันเป็​็นมาตรฐานในการออกแบบระดั​ับสากล สามารถ ทำำ�งานออกแบบต่​่างๆ ได้​้หลากหลาย ไม่​่ว่​่าจะเป็​็นสิ่​่�งพิ​ิมพ์​์ บรรจุ​ุภั​ัณฑ์​์ เว็​็บไซต์​์ และ ภาพ เคลื่​่�อนไหว ตลอดจนการสร้​้างภาพเพื่​่�อใช้​้เป็​็นภาพประกอบในการทำำ�งานอื่​่�นๆ เช่​่น การ์​์ตู​ูน ภาพประกอบหนั​ังสื​ือ ซึ่​่�งจะให้​้ความคมชั​ัดมากกว่​่าการวาดรู​ูปธรรมดา

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

- 82 -

ภาพที่​่� 3.7 เครื่​่�องมื​ือการใช้​้งานโปรแกรม Adobe Illustrator ที่​่�มา : นุ​ุจรี​ี บุ​ุรี​ีรั​ัตน์​์ (2564)

เครื่​่�องมื​ือและคุ​ุณสมบั​ัติ​ิของโปรแกรม Adobe Illustrator

แถบเมนู​ูคำำ�สั่​่�ง (Menu bar) เป็​็นเมนู​ูคำำ�สั่​่�งหลั​ักของโปรแกรม Illustrator แบ่​่งออกเป็​็น หมวดหมู่​่�ต่​่างๆ

แถบตั​ัวเลื​ือก (Option Bar) เป็​็นแถบตั​ัวเลื​ือกสำำ�หรั​ับกำำ�หนดค่​่าต่​่างๆ ของวั​ัตถุ​ุ เพื่​่�อ อำำ�นวยความสะดวกแก่​่ผู้​้�ใช้​้ให้​้สามารถกำำ�หนดค่​่าสี​ี ขนาด ตำำ�แหน่​่ง และคุ​ุณสมบั​ัติ​ิต่​่างๆ ของ วั​ัตถุ​ุที่​่�เลื​ือกได้​้ง่​่ายขึ้​้�น

กล่​่องเครื่อ�่ งมื​ือ (Toolbox) เป็​็นส่​่วนที่​่เ� ก็​็บรวบรวมเครื่อ�่ งมื​ือที่​่ใ� ช้​้ในการสร้​้าง การปรั​ับแต่​่ง และการแก้​้ไขภาพ พี้​้�นที่​่�การทำำ�งาน (Art board) เป็​็นบริ​ิเวณที่​่�เราใช้​้วางวั​ัตถุ​ุเพื่​่�อสร้​้างชิ้​้�นงาน ส่​่วนพื้​้�นที่​่� นอกเหนื​ือจากนั้​้�น (Scratch area) เป็​็นบริ​ิเวณที่​่�เราวางวั​ัตถุ​ุแต่​่ไม่​่ต้​้องการให้​้แสดงในชิ้​้�นงาน ใช้​้เพื่​่�อพั​ักวั​ัตถุ​ุ หรื​ือเผื่​่�อไว้​้ใช้​้ในภายหลั​ัง พาเนล (Panel) เป็​็นหน้​้าต่​่างย่​่อยที่​่ร� วบรวมคุ​ุณสมบั​ัติกิ ารทำำ�งานของเครื่อ�่ งมื​ือต่​่างๆ ให้​้ เราเลื​ือกปรั​ับแต่​่งการใช้​้งานได้​้ง่​่ายๆ ไม่​่ต้​้องเปิ​ิดหาแถบคำำ�สั่​่�ง ซึ่​่�งพาเนลจะถู​ูกจั​ัดเก็​็บไว้​้ในกรอบ จั​ัดเก็​็บพาเนลด้​้านขวาของหน้​้าจอ

- 83 -

การใช้​้โปรแกรม InDesign

โปรแกรม Adobe InDesign เป็​็นโปรแกรมสำำ�หรั​ับงานด้​้านสิ่​่�งพิ​ิมพ์​์ งานออกแบบ เอกสาร หรื​ือเรี​ียกกั​ันง่​่ายๆ ว่​่า โปรแกรมจั​ัดหน้​้ากระดาษ จุ​ุดเด่​่นของโปรแกรม InDesign คื​ือสามารถ ทำำ�งานด้​้านการจั​ัดหน้​้ากระดาษได้​้เป็​็นอย่​่างดี​ี ซึ่​่�งคล้​้ายๆ กั​ับการนำำ�เอาโปรแกรม PageMaker มารวมกั​ับโปรแกรม Illustrator

ระบบการทำำ�งานของโปรแกรม InDesign นั้​้น� ไม่​่สามารถใช้​้ InDesign เดี่​่ย� วๆ ได้​้ ต้​้องมี​ี ความรู้​้�พื้​้�นฐานของ Photoshop และ Illustrator ด้​้วย เพราะต้​้องมี​ีการเตรี​ียมรู​ูปภาพจาก Photoshop และเตรี​ียมคลิ​ิปอาร์​์ต มาจาก Illustrator ส่​่วนข้​้อความสามารถเตรี​ียมมาจาก โปรแกรมประเภท Word Prospering แล้​้วเราจึ​ึงนำำ�มาประกอบรวมกั​ันเป็​็นหนั​ังสื​ือ หรื​ือแผ่​่นพั​ับ ต่​่างๆ ใน InDesign เมื่​่อ� เสร็​็จแล้​้วจึ​ึง Export ไฟล์​์งานของเรานั้​้น� เป็​็นไฟล์​์ PDFX1-a หรื​ือ PDFX-3 เพื่​่อ� ส่​่งโรงพิ​ิมพ์​์ ทางโรงพิ​ิมพ์​์ก็จ็ ะทำำ� Digital Poof ส่​่งกลั​ับมาให้​้ตรวจสอบความเรี​ียบร้​้อยก่​่อนจะ ทำำ�เพลท และส่​่งให้​้โรงพิ​ิมพ์​์ต่อ่ ไป

ภาพที่​่� 3.8 Logo โปรแกรม Adobe InDesign

- 84 -

ภาพที่​่� 3.9 เครื่​่�องมื​ือการใช้​้งานโปรแกรม Adobe llustrator ที่​่�มา : นุ​ุจรี​ี บุ​ุรี​ีรั​ัตน์​์ (2564)

เครื่​่�องมื​ือและคุ​ุณสมบั​ัติ​ิของโปรแกรม Adobe InDesign

แถบเมนู​ูคำ�สั่​่ ำ �ง (Menu bar) บรรจุ​ุคำำ�สั่​่�งใช้​้งานต่​่างๆ การทำำ�งานจะคล้​้ายกั​ับ โปรแกรมอื่​่�นๆ

แถบตั​ัวเลื​ือก (Option Bar) แถบการตั้​้�งค่​่า บรรจุ​ุตั​ัวเลื​ือกกำำ�หนดคุ​ุณสมบั​ัติ​ิหรื​ือ ตั​ัวปรั​ับแต่​่งการทำำ�งานให้​้กั​ับวั​ัตถุ​ุ (ตั​ัวอั​ักษรหรื​ือภาพ) ที่​่�เรากำำ�ลั​ังเลื​ือกทำำ�งาน

กล่​่องเครื่​่�องมื​ือ (Toolbox) เครื่​่�องมื​ือชนิ​ิดต่​่างๆ ที่​่�ใช้​้ในการทำำ�งาน พี้​้�นที่​่ก� ารทำำ�งาน (Art board) พื้​้น� ที่​่เ� อกสาร สำำ�หรั​ับการทำำ�งาน คล้​้ายกั​ับกระดาษเปล่​่าๆ ที่​่� คอยให้​้เราเติ​ิมตั​ัวอั​ักษรหรื​ือภาพลงไป

เส้​้นไกด์​์ (Guide) ไม้​้บรรทั​ัดสำำ�หรั​ับการวั​ัดระยะหรื​ือสร้​้างเส้​้น Guide พาเนล (Panel) หน้​้าต่​่างย่​่อยสำำ�หรั​ับช่ว่ ยเสริ​ิมการทำำ�งาน เมื่​่อ� คลิ​ิกลงไปแต่​่ละปุ่​่�มจะ เป็​็นการเรี​ียกใช้​้งาน Palette แต่​่ละชนิ​ิด

- 85 -

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

ซึ่ง�่ ผู้​้�บริ​ิโภคควรมี​ีความรู้​้�เกี่​่ย� วกั​ับกลไกของการโฆษณาชั​ักจู​ูง และนำำ�มาวิ​ิเคราะห์​์ ไตร่​่ตรอง ไม่​่ให้​้ตกอยู่​่�ภายใต้​้อิทิ ธิ​ิพลของการโฆษณา สั​ังคมไทยมี​ีการเปลี่​่�ยนแปลงอยู่​่�ตลอดเวลา เนื่​่�องจาก การแพร่​่หลายของปริ​ิมาณข่​่าวสารความรู้​้� รวมถึ​ึงความทั​ันสมั​ัยและความรวดเร็​็วของการพั​ัฒนา เทคโนโลยี​ี นำำ�ความเจริ​ิญไปพร้​้อมกั​ันไปกั​ับความเปลี่​่�ยนแปลงของสั​ังคม สื่​่�อมวลชน (Mass media) ได้​้แก่​่

หนั​ังสื​ือพิ​ิมพ์​์ (Newspaper)

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

การลงโฆษณาในหนั​ังสื​ือพิ​ิมพ์​์แบ่​่งออกเป็​็น 2 ประเภท

1. โฆษณาเดี่​่�ยว (Display Advertising)

เป็​็นการโฆษณาสิ​ินค้​้าเต็​็มหน้​้าหนั​ังสื​ือพิ​ิมพ์​์ โดยไม่​่มีโี ฆษณาอื่​่น� มาปะปนกั​ัน เป็​็นโฆษณา ที่​่�สร้​้างความตื่​่น� เต้​้น หรู​ูหรา ยิ่​่ง� ใหญ่​่เป็​็นเอกเทศ ถ้​้าเป็​็นสี​ีก็จ็ ะทำำ�ให้​้เกิ​ิดความสะดุ​ุดตามากยิ่​่ง� ขึ้​้น�

2. โฆษณาหมู่​่� (Classified Advertising)

เป็​็นการลงโฆษณาสิ​ินค้​้าในพื้​้น� ที่​่ที่​่� ห� นั​ังสื​ือพิ​ิมพ์​์จัดั ไว้​้ให้​้โดยเฉพาะ จะมี​ีสินิ ค้​้าหลากหลายชนิ​ิด ลงโฆษณาปะปนกั​ัน เช่​่น โฆษณาขายที่​่�ดิ​ิน รถยนต์​์มื​ือสอง เรี​ียนภาษาอั​ังกฤษ คอมพิ​ิวเตอร์​์ โปรแกรมภาพยนตร์​์ ฯลฯ

- 86 -

นิ​ิตยสาร (Magazine) นิ​ิตยสารเป็​็นสิ่​่�งพิ​ิมพ์​์ที่​่�รวมเนื้​้�อหาสาระประเภทต่​่าง ๆ เข้​้าไว้​้ด้​้วยกั​ัน ที่​่�มี​ีความน่​่าสนใจ หลาย ๆ เรื่​่อ� ง แต่​่เป็​็นเรื่​่อ� งประเภทเดี​ียวกั​ันทำำ�ให้​้สามารถเลื​ือกกลุ่​่�มเป้​้าหมายเฉพาะได้​้ ตรงกั​ับ กลุ่​่�มเป้​้าหมายของสิ​ินค้​้า และจั​ัดพิ​ิมพ์​์ออกมาเป็​็นเล่​่มวางตลาดเป็​็นรายคาบ (Periodical Publication) คื​ือรายสั​ัปดาห์​์ รายปั​ักษ์​์ รายเดื​ือน เป็​็นต้​้น ประเภทนิ​ิตยสาร

สมาคมโฆษณาธุ​ุ ร กิ​ิ จ แห่​่ ง ประเทศไทยได้​้ จำำ� แนกประเภทของนิ​ิ ต ยสารที่​่� มี​ี ว าง จำำ�หน่​่ายทั่​่�วไปในท้​้องตลาด มี​ีจำ�ำ นวนมากกว่​่า 15 ประเภทเช่​่น

1. นิ​ิตยสารการเมื​ือง

2. นิ​ิตยสารกี​ีฬา

3. นิ​ิตยสารสำำ�หรั​ับเด็​็ก

4. นิ​ิตยสารทางการถ่​่ายภาพและภาพพิ​ิมพ์​์

5. นิ​ิตยสารการท่​่องเที่​่�ยว

6. นิ​ิตยสารทางธุ​ุรกิ​ิจและทางการโฆษณา

7. นิ​ิตยสารบั​ันเทิ​ิง

8. นิ​ิตยสารบ้​้าน

9. นิ​ิตยสารผู้​้�หญิ​ิง

10. นิ​ิตยสารผู้​้�ชาย

11. นิ​ิตยสารรถ

12. นิ​ิตยสารทางศิ​ิลป-วั​ัฒนธรรม

13. นิ​ิตยสารเศรษฐกิ​ิจ

14. นิ​ิตยสารสุ​ุขภาพ

15. นิ​ิตยสารครอบครั​ัว

ภาพที่​่� 3.10 นิ​ิตยสาร VOGUE เป็​็นเรื่​่�องเกี่​่�ยวกั​ับแฟชั่​่�น ที่​่�มา : http://www.vogue.co.th (2018)

- 87 -

สื่​่�อถึ​ึงบุ​ุคคล (Direct Mail) ได้​้แก่​่

ใบปลิ​ิว (Flyer, Leaflet, Handbill)

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

ภาพที่​่� 3.11 การออกแบบใบปลิ​ิว ที่​่�มา : นุ​ุจรี​ี บุ​ุรี​ีรั​ัตน์​์ (2564)

อี​ีกวิ​ิธี​ีหนึ่​่�งที่​่�แจกคื​ือ การโปรยแจกโดยเรี​ียกสื่​่�อประเภทนี้​้�ว่​่า Fliers ใบปลิ​ิวลั​ักษณะนี้​้� คื​ือ จะเป็​็นเนื้​้�อหามากกว่​่าภาพ และจะเป็​็นข้​้อความที่​่�ปกปิ​ิด เช่​่น ใบปลิ​ิวชั​ักชวนต่​่อต้​้าน ทางการเมื​ือง เป็​็นต้​้น

- 88 -

ภาพที่​่� 3.12 แผ่​่นพั​ับ ประเภท 3 ทบ ที่​่�มา : นุ​ุจรี​ี บุ​ุรี​ีรั​ัตน์​์ (2564)

แผ่​่นพั​ับ (Brochure, Folder)

ความหมายของแผ่​่นพั​ับ แผ่​่นพั​ับ (Brochure) หมายถึ​ึงสื่​่�อโฆษณาที่​่�เป็​็นสิ่​่�งพิ​ิมพ์​์ ประเภทไดเร็​็กเมล (Direct Mail) ที่​่�ผู้​้�ผลิ​ิตส่​่งตรงถึ​ึงผู้​้�บริ​ิโภค มี​ีทั้​้�งการส่​่งทางไปรษณี​ีย์​์และแจก ตามสถานที่​่�ต่​่างๆ ลั​ักษณะเด่​่นของแผ่​่นพั​ับคื​ือ มี​ีขนาดเล็​็ก หยิ​ิบง่​่าย การให้​้ข้​้อมู​ูลที่​่�ละเอี​ียด ผู้​้�อ่​่านสามารถเลื​ือกอ่​่านเวลาใดก็​็ได้​้ ผู้​้�ออกแบบมี​ีการออกแบบตามอิ​ิสระ หลากหลาย และมี​ีค่​่า ใช้​้ จ่​่ า ยในการผลิ​ิ ตต่ำำ�� กว่​่ า การผลิ​ิ ตสิ่​่� ง พิ​ิ ม พ์​์ ชนิ​ิ ด อื่​่� น และเป็​็ น สื่​่� อ ที่​่� ถึ​ึ งเป้​้ า หมายอย่​่ า งแท้​้ จ ริ​ิ ง (อโณทั​ัย เชี่​่�ยวชาญ : 6/20/2554) การออกแบบแผ่​่นพั​ับนั้​้�นจำำ�เป็​็นต้​้​้�องมี​ีการจั​ัดวางหน้​้าให้​้ เหมาะสม เพราะถ้​้าจั​ัดวางไม่​่เหมาะสม ผู้​้�อ่​่านอาจเกิ​ิดความสั​ับสนได้​้ การออกแบบควรกำำ�หนด ให้​้ข้​้อมู​ูลแต่​่ละหน้​้าจบในตั​ัวมั​ันเอง ทำำ�ให้​้ผู้​้�อ่​่านสามารถอ่​่านตรงส่​่วนไหนก่​่อนก็​็ได้​้ การกำำ�หนด เนื้​้�อหาไม่​่ควรแน่​่นเกิ​ินไป การจั​ัดหน้​้ากระดาษแต่​่ละหน้​้าควรมี​ีรู​ูปแบบที่​่�แตกต่​่าง แต่​่มี​ีความ สอดคล้​้องสั​ัมพั​ันธ์​์กั​ัน การเลื​ือกรู​ูปภาพประกอบ ควรเลื​ือกรู​ูปภาพที่​่�สวยงามและผู้​้�ดู​ูสามารถดู​ู ได้​้นาน ๆ

- 89 -

การออกแบบหนั​ังสื​ือพิ​ิมพ์​์

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

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

1. หน้​้าต่​่างที่​่�มี​ีเอกลั​ักษณ์​์ของสื่​่�อพิ​ิมพ์​์

2. การจั​ัดองค์​์ประกอบทางกราฟิ​ิก การออกแบบหนั​ังสื​ือพิ​ิมพ์​์สมั​ัยใหม่​่นั้​้�นถู​ูกออกแบบ ให้​้หน้​้าตาน่​่าอ่​่านด้​้วยการใช้​้ตั​ัวอั​ักษรและองค์​์ประกอบต่​่างๆ อย่​่างน่​่าสนใจ

3. การใช้​้สี​ี หนั​ังสื​ือพิ​ิมพ์​์สมั​ัยใหม่​่มั​ักเน้​้นการใช้​้สี่​่�สี​ีมากขึ้​้�นโดยเฉพาะหน้​้าสำำ�คั​ัญๆ

4. การจั​ัดกลุ่​่�มเนื้​้�อหา หนั​ังสื​ือพิ​ิมพ์​์จะน่​่าสนใจหรื​ือไม่​่ขึ้​้�นอยู่​่�กั​ับเนื้​้�อหาข้​้างในว่​่าใช้​้มุ​ุม มองแบบใดเขี​ียนข่​่าว

5. การจั​ัดวางองค์​์ประกอบ ส่​่วนใหญ่​่แล้​้วหนั​ังสื​ือพิ​ิมพ์​์สมั​ัยใหม่​่จะใช้​้โครงสร้​้างระบบ กริ​ิดในการวางองค์​์ประกอบ

การออกแบบสิ่​่�งพิ​ิมพ์​์เฉพาะกิ​ิจ

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

การออกแบบโปสเตอร์​์ จุ​ุดประสงค์​์ของโปสเตอร์​์คื​ือใช้​้ปิ​ิดประกาศเพื่​่�อแจ้​้งข่​่าว ประกาศข่​่าว ประชาสั​ัมพั​ันธ์​์ ข้​้อมู​ูลออกสู่​่�สาธารณะ เพราะฉะนั้​้�นโปสเตอร์​์จึ​ึงเป็​็นงานพิ​ิมพ์​์ด้​้านเดี​ียว โดยขนาดของโปสเตอร์​์ จะขึ้​้น� อยู่​่�กับั ความต้​้องการของลู​ูกค้​้า ขนาดที่​่นิ� ยิ มจะเป็​็นขนาด A1 A2 A3 หรื​ือขนาด 31x21 นิ้​้ว� 15x21 นิ้​้�ว ที่​่�เป็​็นขนาดลั​ักษณะดั​ังกล่​่าวจะไม่​่เสี​ียเศษกระดาษ เนื่​่�องจากโปสเตอร์​์ใช้​้แปะเพื่​่�อ ประชาสั​ัมพั​ันธ์​์ข่า่ วสารให้​้คนเห็​็นในระยะไกล ข้​้อมู​ูลในโปสเตอร์​์จึ​ึงไม่​่ควรมี​ีขนาดเล็​็กเกิ​ินไป และควรมี​ี เนื้​้�อหาที่​่�กระชั​ับ ชั​ัดเจน รั​ัดกุ​ุม

- 90 -

ภาพที่​่� 3.13 ตั​ัวอย่​่างแผ่​่นพั​ับ ที่​่�มา : นุ​ุจรี​ี บุ​ุรี​ีรั​ัตน์​์ (2564)

การออกแบบแผ่​่นพั​ับ

แผ่​่นพั​ับหมายถึ​ึงกระดาษที่​่�มี​ีการพิ​ิมพ์​์ข้​้อมู​ูลลงไปอาจจะพิ​ิมพ์​์ 1 ด้​้านหรื​ือสองด้​้าน พิ​ิมพ์​์ 4 สี​ี 2 สี​ีหรื​ือพิ​ิมพ์​์สี​ีเดี​ียว และมี​ีการพั​ับ แผ่​่นพั​ับที่​่�นิ​ิยมพั​ับกั​ันจะเป็​็นการทำำ�ใบปลิ​ิว กระดาษ A4 นำำ�มาพั​ับเป็​็นแผ่​่นพั​ับ 2 พั​ับ 3 ตอน หรื​ือพั​ับครึ่​่�ง การผลิ​ิตแผ่​่นพั​ับหากพิ​ิมพ์​์ จำำ�นวนมากราคาต่​่อหน่​่วยจะถู​ูกลง

แผ่​่นพั​ับเป็​็นเอกสารที่​่�ใช้​้ในการโฆษณา ประชาสั​ัมพั​ันธ์​์ และเป็​็นการส่​่งข้​้อมู​ูลในเชิ​ิง สาธารณะ ไม่​่ว่​่าจะเป็​็นการให้​้ข้​้อมู​ูลในเชิ​ิงความรู้​้�หรื​ือทางการขายสิ​ินค้​้า หรื​ือเพื่​่�อประโยชน์​์อื่​่�น ๆ

- 91 -

หลั​ักการออกแบบโปสเตอร์​์

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

โปสเตอร์​์ คื​ือ ใบปิ​ิดประกาศเพื่​่�อแจ้​้งข่​่าวประกาศประชาสั​ัมพั​ันธ์​์ของข้​้อมู​ูลข่​่าวสาร เพื่​่�อออกสู่​่�สาธารณะ ดั​ังนั้​้�นโปสเตอร์​์จึ​ึงเป็​็นงานพิ​ิมพ์​์ด้​้านเดี​ียว

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

ประโยชน์​์ของโปสเตอร์​์

ในส่​่วนประโยชน์​์หลั​ักๆ ของโปสเตอร์​์นั้​้�นสามารถแยกเป็​็นข้​้อ ๆ ให้​้เห็​็นอย่​่างชั​ัดเจน โดยแบ่​่งตามลั​ักษณะการนำำ�ไปใช้​้งาน ดั​ังนี้​้�

1. ใช้​้เป็​็นเครื่อ�่ งมื​ือในการโฆษณา ประชาสั​ัมพั​ันธ์​์ ไม่​่ว่า่ จะเป็​็นโฆษณาสิ​ินค้​้า/บริ​ิการ งานต่​่างๆ งานดนตรี​ี ภาพยนตร์​์

2. ใช้​้ในการศึ​ึกษานำำ�เสนอเนื้​้�อหาสาระ

3. ใช้​้เป็​็นสื่​่�อการสอนอธิ​ิบายเรื่​่�องราวต่​่าง ๆ

4. ใช้​้นำำ�เสนอผลงานทางวิ​ิชาการ

ภาพที่​่� 3.14 โปสเตอร์​์งานปั​ัจฉิ​ิมนิ​ิเทศนั​ักศึ​ึกษา ที่​่�มา : นุ​ุจรี​ี บุ​ุรี​ีรั​ัตน์​์ (2564)

- 92 -

องค์​์ประกอบสำำ�คั​ัญของโปสเตอร์​์

โปสเตอร์​์โดยทั่​่�วไปไม่​่ว่า่ ขนาดเล็​็กหรื​ือขนาดใหญ่​่ จะมาจากประเทศใดก็​็ตาม ส่​่วนใหญ่​่ จะมี​ีองค์​์ประกอบสำำ�คั​ัญ ดั​ังนี้​้�

1. องค์​์ประกอบสำำ�คัญ ั

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

HEADLINE S USUB-HEDLINE B-HEDLINE DDETAILS E TA I L S CCONTACT O N TA C T I IMAGES MAGES

ภาพที่​่� 3.15 องค์​์ประกอบของการออกแบบโปสเตอร์​์ ที่​่�มา : https://www.gogoprint.co.th (2564)

- 93 -

2. ความสำำ�คั​ัญหรื​ือจุ​ุดเด่​่น

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

3. ขนาดของตั​ัวอั​ักษร

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

4. โทนสี​ีของโปสเตอร์​์

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

5. ความสมดุ​ุล

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

- 94 -

ขั้​้�นตอนการออกแบบโปสเตอร์​์

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

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

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

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

4. ออกแบบในคอมพิ​ิวเตอร์​์เป็​็นการทำำ�อาร์​์ตเวิ​ิร์​์ค (Artwork) ที่​่�เหมื​ือนจริ​ิง โดยนำำ�แบบ ร่​่างที่​่�ลงตั​ัวแล้​้วมาทำำ�ให้​้เป็​็นขนาดเท่​่าของจริ​ิง ทั้​้�งภาพและตั​ัวอั​ักษร ช่​่องไฟ และงานกราฟิ​ิกทุ​ุก อย่​่าง ซึ่�ง่ เราจะตกแต่​่งภาพกราฟิ​ิกด้​้วยโปรแกรม Photoshop และจั​ัดทำำ�อาร์​์ตเวิ​ิร์​์คด้​้วย โปรแกรม Adobe Illustrator

5. ตรวจทานและแก้​้ไข ตรวจดู​ูความถู​ูกต้​้องของภาษา ความเหมาะสมของรู​ูปภาพ การจั​ัด วางและแก้​้ไขรายละเอี​ียด และปรั​ับแต่​่งให้​้ถู​ูกต้​้อง

6. เตรี​ียมไฟล์​์เพื่​่�อจั​ัดพิ​ิมพ์​์ เมื่​่�อจั​ัดทำำ�อาร์​์ตเวิ​ิร์​์คต้​้นฉบั​ับเป็​็นที่​่�เรี​ียบร้​้อยแล้​้วสามารถ ส่​่งไฟล์​์งาน และสั่​่�งพิ​ิมพ์​์ดำ�ำ เนิ​ินตามขั้​้�นตอนการพิ​ิมพ์​์ได้​้ต่​่อไป

- 95 -

ตั​ัวอย่​่างการออกแบบโปสเตอร์​์

ตั​ัวอย่​่างงานออกแบบโปสเตอร์​์ประชาสั​ัมพั​ันธ์​์ งานประกวดตกแต่​่งภาพงานแต่​่งงาน โดยใช้​้โปรแกรม Adobe Photoshop กลุ่​่�มเป้​้าหมายนั​ักศึ​ึกษา และบุ​ุคคลทั่​่�วไปที่​่�สนใจงาน กราฟิ​ิกจากโปรแกรมแต่​่งภาพ Adobe Photoshop ดั​ังนี้​้� ขั้​้�นตอนแรกเป็​็นการเริ่​่�มสร้​้างหน้​้ากระดานทำำ�งานและวางเส้​้น Guide กำำ�หนดขอบเขต พื้​้�นที่​่�สำำ�หรั​ับทำำ�งาน และเป็​็นพื้​้�นที่​่�สำำ�หรั​ับตั​ัดตกโรงพิ​ิมพ์​์ ต่​่อด้​้วยการใส่​่พื้​้�นผิ​ิว Texture ให้​้กั​ับ กระดานวาดเล็​็กน้​้อยด้​้วยวิ​ิธี​ีดั​ังนี้​้�

1. กดปุ่​่�ม Ctrl + N สร้​้างหน้​้ากระดานใหม่​่ตั้​้�งชื่​่�อไฟล์​์ 2. กำำ�หนดค่​่าหน่​่วยเป็​็น Centimeters ปรั​ับขนาด Width : 42 cm. และ Height : 29.7 cm. ค่​่าความละเอี​ียดภาพ resolutions : 300 pixel/Incg คลิ​ิกปุ่​่�ม OK

- 96 -

3. เราจะได้​้หน้​้ากระดานขนาด A3 ในแนวนอน กดปุ่​่�ม Carl + R แสดงเครื่​่�องมื​ือไม้​้บรรทั​ัด 4. คลิ​ิ กค้​้ างที่​่� ไม้​้ บรรทั​ั ด แล้​้วลากเส้​้น Guide มาวาง ที่​่ข� อบกระดานวาดทุ​ุกด้​้าน เพื่​่�อกำำ�หนดขอบเขตพื้​้�นท ทำำ�งาน

5. สร้​้างเส้​้น Guide ทั้​้ง� 4 ด้​้าน นอกพื้​้น� ที่​่ก� ระดานวาดห่​่างจาก ขอบกระดานว่​่า 0.5 cm เพื่​่�อ สร้​้ า งขอบเขตพื้​้� น ที่​่� ตั​ั ด ตก โรงพิ​ิมพ์​์

6. คลิ​ิกเครื่​่�องมื​ือ Crop Tool แล้​้วคลิ​ิกขยายพื้​้น� ที่​่ก� ระดานวาด ให้​้เท่​่ากั​ับพื้​้น� ที่​่ตั� ดั ตกทั้​้ง� 4 ด้​้าน แล้​้วกดปุ่​่�ม Enter

- 97 -

7. กดปุ่​่�ม Ctrl + J คั​ัดลอกเลเยอร์​์เพิ่​่�มมาอี​ีก 1 เลเยอร์​์ 8. ดั​ับเบิ​ิลคลิ​ิกที่​่�เลเยอร์​์ใหม่​่ เพื่​่�อใช้​้งาน Layer Style

9. คลิ​ิกเลื​ือก Pattern Overlay 10. คลิ​ิกเลื​ือกรู​ูปแบบ Pattern 11. ปรั​ับขนาดลวดลายที่​่�ช่​่อง Scale คลิ​ิกปุ่​่�ม OK

12. ตอนนี้​้�เราได้​้พื้​้�นหลั​ังและขอบเขตพื้​้�นที่​่� ต่​่าง ๆ ในกระดานวาด ซึ่�ง่ พร้​้อมจะทำำ�งาน ออกแบบโปสเตอร์​์แล้​้ว

- 98 -

13. ตกแต่​่งภาพประกอบสำำ�หรั​ับ การออกแบบโปสเตอร์​์ ซึ่​่�งในการ ตกแต่​่งภาพสามารถเลื​ือกใช้​้เทคนิ​ิค หรื​ือวิ​ิ ธี​ี ก ารตกแต่​่ ง ภาพได้​้ ต าม ความถนั​ัดของแต่​่ละบุ​ุคคล

14. เมื่​่�อตกแต่​่งภาพเรี​ียบร้​้อยแล้​้ว กดปุ่​่�ม Shift + Ctrl + S บั​ันทึ​ึกไฟล์​์รู​ูปภาพไปใช้​้ต่​่อใน โปรแกรม Adobe Illustrator เพื่​่�อใส่​่ข้​้อความต่​่อไป

- 99 -

การใส่​่ข้​้อความและรายละเอี​ียดต่​่าง ๆ ในโปสเตอร์​์

เราจะใส่​่ข้​้อความต่​่าง ๆ ด้​้วยโปรแกรม Adobe Illustrator เพื่​่�อให้​้ได้​้ข้​้อความที่​่�คม ชั​ัดที่​่�สุ​ุดเมื่​่อ� โปสเตอร์​์ถูกู พิ​ิมพ์​์ออกมา โดยจะเริ่​่ม� จั​ัดวางที่​่ข้� อ้ ความหลั​ัก ข้​้อความรองตามลำำ�ดับั และ ตกแต่​่ง ใส่​่ภาพกราฟิ​ิก Vector เล็​็กน้​้อยเพื่​่�อให้​้งานมี​ีความสวยงาม ซึ่�ง่ ก่​่อนจะนำำ�ไฟล์​์ภาพเข้​้ามา ในโปรแกรม Adobe Illustrator ให้​้วางเส้​้น Guide กำำ�หนดพื้​้�นที่​่�ต่​่าง ๆ ในงานเสี​ียก่​่อน ด้​้วย วิ​ิธี​ีดั​ังนี้​้�

1. เมื่​่�อเปิ​ิดโปรแกรม Adobe Illustrator มาแล้​้วให้​้ดั​ับเบิ​ิลคลิ​ิกที่​่�พื้​้�นที่​่�สี​ีเทาของ โปรแกรม

2. ดั​ับเบิ​ิลคลิ​ิกเลื​ือกไฟล์​์ภาพที่​่�บั​ันทึ​ึกไว้​้ก่​่อนหน้​้านี้​้�

3. คลิ​ิกพาเนลเลเยอร์​์ คลิ​ิกล็​็อคเลเยอร์​์ภาพไว้​้ก่​่อน

4. คลิ​ิกปุ่​่�ม Create New Layer เพื่​่�อสร้​้างเลเยอร์​์ใหม่​่

5. เปลี่​่�ยนชื่​่�อเป็​็น Text สำำ�หรั​ับพิ​ิมพ์​์ข้​้อความ

6. กดปุ่​่�ม Control + R เพื่​่�อแสดงไม้​้บรรทั​ัด จากนั้​้�นคลิ​ิกสร้​้างเส้​้น Guide กำำ�หนด พื้​้�นที่​่�ทำ�ำ งานและพื้​้�นที่​่�ตั​ัดตกเหมื​ือนในโปรแกรม Photoshop

7. สร้​้างเส้​้น Guide เพิ่​่�มด้​้านในกรอบพื้​้�นที่​่�ทำำ�งานทั้​้�ง 4 ด้​้าน โดยให้​้วั​ัดจากเส้​้นพื้​้�นท ตั​ัดตกเข้​้ามาด้​้านละ 1 cm. เพื่​่�อความเป็​็นระเบี​ียบสวยงามของข้​้อความที่​่�พิ​ิมพ์​์ลงไป และจะต้​้อง ไม่​่เลยออกนอกเส้​้นไกด์​์นี้​้� 6

8

5 3

7

4

- 100 -

8. เลื​ือก Type Tools หากต้​้องการพิ​ิมพ์​์ข้​้อความ 9. กดปุ่​่�ม Ctrl + P เปิ​ิดพาแนล Characters เลื​ือกชื่​่�อฟอนต์​์

10. ปรั​ับขนาดฟอนต์​์ตามต้​้องการ

11. คลิ​ิกพิ​ิมพ์​์ข้​้อความหลั​ัก ข้​้อความรอง หรื​ือรายละเอี​ียดต่​่าง ๆ หรื​ือ Vector ลงไป พร้​้อมปรั​ับแต่​่งให้​้สวยงาม และสร้​้างสี่​่�เหลี่​่�ยมผื​ืนผ้​้าด้​้านหลั​ังข้​้อความ 13 12. เมื่​่อ� ตกแต่​่งภาพเสร็​็จเรี​ียบร้​้อย แล้​้ว ต้​้องทำำ�การ Create Outline ฟอนต์​์ทั้​้ง� หมดให้​้เป็​็นภาพเวกเตอร์​์ 12 เพื่​่�อป้​้องกั​ันไม่​่ให้​้ฟอนต์​์เพี้​้�ยน เมื่​่�อส่​่งโรงพิ​ิมพ์​์ โดยการกดปุ่​่�ม Shift + Control + O 13. ที่​่�พาเนล Layers คลิ​ิปล็​็อคเลเยอร์​์ Text เพื่​่�อป้​้องกั​ันการขยั​ับโดยไม่​่ได้​้ตั้​้�งใจ 17

15 16

14

14. คลิ​ิกปุ่​่�ม Create New layer 15. คลิ​ิกเครื่​่�องมื​ือ Rectangle Tool ปรั​ับช่​่องสี​ีไม่​่ให้​้มี​ีสี​ีพื้​้�น และสี​ีขอบ 16. แดรกเมาส์​์สร้​้างกรอบสี่​่�เหลี่​่�ยมตามเส้​้น Guide พื้​้�นที่​่�ตั​ัดตก 17. คลิ​ิกเมนู​ู Effect > Crop Marks สร้​้างเส้​้นตั​ัดตกให้​้กับชิ้​้ ั �นงานทั้​้�งสี่​่�มุ​ุม และคลิ​ิปล็​็อคเลเยอร์​์

- 101 -

18

18. กดปุ่​่ม� Shift + ctrl + S เพื่​่อ� บั​ันทึ​ึกไฟล์​์ ส่​่งโรงพิ​ิมพ์​์ คลิ​ิกเลื​ือก Version Illustrator เก่​่าลงมา เพื่​่อ� ป้​้องกั​ันกรณี​ีโรงพิ​ิมพ์​์ใช้​้โปรแกรม เวอร์​์ชั่​่�นที่​่�ยั​ังไม่​่ใหม่​่มากนั​ัก

19. Export ไฟล์​์ภาพ .jpg เพื่​่�อส่​่งให้​้โรงพิ​ิมพ์​์ดู​ูเป็​็นตั​ัวอย่​่างก่​่อนพิ​ิมพ์​์ คลิ​ิกเมนู​ู Fire > Export...

20. ตั้​้�งชื่​่�อไฟล์​์ เลื​ือกนามสกุ​ุลเป็​็น .jpg คลิ​ิกปุ่​่�ม Save color mode : RGB และปรั​ับ Resolution ตามต้​้องการ คลิ​ิกปุ่​่�ม OK

- 102 -

ภาพโปสเตอร์​์ที่​่�มี​ีการ Export เป็​็นไฟล์​์ .jpg เรี​ียบร้​้อยแล้​้ว

- 103 -

04

เทคนิ​ิคการออกแบบคอมพิ​ิวเตอร์​์กราฟิ​ิก ความหมายของคอมพิ​ิวเตอร์​์กราฟิ​ิก

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

ภาพที่​่� 4.1 Computer Graphics ที่​่�มา : https://www.selectoday.com (2018)

-104 -

หลั​ักการทำำ�งานของงานกราฟิ​ิก หลั​ักการทำำ�งานของภาพกราฟิ​ิก แบ่​่งออกเป็​็น 2 รู​ูปแบบ ได้​้แก่​่ 1. ภาพกราฟิ​ิกแบบราสเตอร์​์ (Raster) หรื​ือบิ​ิตแมพ (Bitmap)

ภาพกราฟิ​ิกแบบราสเตอร์​์ หรื​ือเรี​ียกอี​ีกอย่​่างหนึ่​่ง� ว่​่า บิ​ิตแมพ (Bitmap) เป็​็นภาพกราฟิ​ิก ที่​่�เกิ​ิดจากการเรี​ียงตั​ัวของจุ​ุดสี่​่�เหลี่​่�ยมเล็​็กๆ ที่​่�เรี​ียกว่​่า พิ​ิกเซล (Pixel) มี​ีการเก็​็บค่​่าสี​ีที่​่�เจาะจง ใน แต่​่ละตำำ�แหน่​่งจนเกิ​ิดเป็​็นภาพในลั​ักษณะต่​่างๆ เช่​่น ภาพถ่​่าย ดั​ังนั้​้�นภาพแบบราสเตอร์​์มี​ีข้​้อดี​ี และข้​้อเสี​ีย ดั​ังนี้​้�

ข้​้อดี​ี คื​ือ เหมาะสำำ�หรั​ับภาพที่​่�ต้​้องการสร้​้างสี​ีหรื​ือกำำ�หนดสี​ีที่​่�ต้​้องการความละเอี​ียด และสวยงามน

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

ภาพที่​่� 4.2 ภาพราสเตอร์​์ ที่​่�มา : https://sites.google.com (2018)

- 105 104 -

2. ภาพกราฟิ​ิกแบบเวกเตอร์​์ (Vector)

ภาพกราฟิ​ิกแบบเวกเตอร์ เป็​็นภาพกราฟิ​ิกที่​่�เกิ​ิดจากการประมวลผลโดยอาศั​ัยหลั​ัก การคำำ�นวณทางคณิ​ิตศาสตร์​์ มี​ีสีแี ละตำำ�แหน่​่งที่​่�แน่​่นอน ภาพจะมี​ีความเป็​็นอิ​ิสระต่​่อกั​ัน โดยแยก ชิ้​้น� ส่​่วนของภาพทั้​้�งหมดออกเป็​็นเส้​้นตรง เส้​้นโค้​้ง หรื​ือรู​ูปทรง เมื่​่อ� มี​ีการขยายภาพความละเอี​ียด ของภาพ จะไม่​่ลดลง เช่​่น ภาพการ์​์ตู​ูนเมื่​่�อถู​ูกขยายภาพออกมา ภาพที่​่�ได้​้ก็​็จะยั​ังคงรายละเอี​ียด และความชั​ัดเจนไว้​้เหมื​ือนเดิ​ิม และขนาดของไฟล์​์ภาพจะมี​ีขนาดเล็​็กกว่​่าภาพแบบราสเตอร์​์ โปรแกรมที่​่�นิ​ิยม ใช้​้สร้​้างภาพแบบเวกเตอร์​์ ได้​้แก่​่ โปรแกรม Adobe Illustrator โปรแกรม CorelDraw

ภาพที่​่� 4.3 ภาพเวกเตอร์​์

ที่​่�มา : นุ​ุจรี​ี บุ​ุรี​ีรั​ัตน์​์ (2564)

ประเภทของนามสกุ​ุลไฟล์​์ภาพกราฟิ​ิก ประเภทของไฟล์​์ภาพกราฟิ​ิก

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

- 106 -

ไฟล์​์ GIF ไฟล์​์ JPEG ไฟล์​์ PNG ภาพที่​่� 4.4 ภาพไฟล์​์นามสกุ​ุลต่​่างๆ

ที่​่�มา : https://tips.thaiware.com/1312.html (2564)

1. JPEG หรื​ือ JPG (Join Photographic Export Group)

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

จุ​ุดเด่​่น 1. สนั​ับสนุ​ุนสี​ีได้​้ถึ​ึง 24 bit 2. แสดงสี​ีได้​้ถึ​ึง 16.7 ล้​้านสี​ี 3. สามารถกำำ�หนดค่​่าการบี​ีบอั​ัดไฟล์​์ได้​้ตามที่​่�ต้​้องการ 4. มี​ีระบบแสดงผลแบบหยาบและค่​่อย ๆ ขยายไปสู่​่�ละเอี​ียดในระบบ Progressive 5. มี​ีโปรแกรมสนั​ับสนุ​ุนการสร้​้างจำำ�นวนมาก 6. เรี​ียกดู​ูได้​้กั​ับบราวเซอร์​์ (Browser) ทุ​ุกตั​ัว

จุ​ุดด้​้อย 1. ไม่​่สามารถทำำ�ภาพให้​้มี​ีพื้​้�นหลั​ังแบบโปร่​่งใส (Transparent) ได้​้ 2. ทำำ�ภาพเคลื่​่�อนไหว (Animation) ไม่​่ได้​้

2. GIF (Graphic Interchange Format)

เป็​็นไฟล์​์ภาพที่​่�สามารถบี​ีบอัดั ข้​้อมู​ูลให้​้มีขี นาดเล็​็กได้​้ส่ว่ นมากจะนำำ�ไปใช้​้บันั ทึ​ึกเป็​็นไฟล์​์ภาพ เคลื่​่�อนไหวและนิ​ิยมมากในการใช้​้งานบนเว็​็บเพจ - 107 -

จุ​ุดเด่​่น

1. สามารถใช้​้งานข้​้ามระบบไม่​่ว่า่ จะเป็​็นระบบปฏิ​ิบัติั กิ ารวิ​ินโดวส์​์ (Windows) หรื​ือระบบ ปฏิ​ิบั​ัติ​ิการยู​ูนิ​ิกซ์​์ (Unix) ก็​็สามารถเรี​ียกใช้​้ไฟล์​์ภาพสกุ​ุลนี้​้�ได้​้

2. ภาพมี​ีขนาดไฟล์​์ต่ำ�ำ� จากเทคโนโลยี​ีการบี​ีบอั​ัดภาพทำำ�ให้​้สามารถส่​่งไฟล์​์ภาพได้​้อย่​่าง รวดเร็​็ว

3. สามารถทำำ�ภาพพื้​้�นหลั​ังแบบโปร่​่งใสได้​้

4. มี​ีโปรแกรมสนั​ับสนุ​ุนการสร้​้างจำำ�นวนมาก

5. เรี​ียกดู​ูได้​้กั​ับบราวเซอร์​์ทุ​ุกตั​ัว

6. สามารถนำำ�เสนอแบบภาพเคลื่​่�อนไหวได้​้

จุ​ุดด้​้อย

1. แสดงสี​ีได้​้เพี​ียง 256 สี​ี

2. ไม่​่เหมาะกั​ับภาพที่​่�ต้​้องการความคมชั​ัดหรื​ือความสดใส

3. PNG (Portable Network Graphics)

เป็​็นชนิ​ิดของไฟล์​์ภาพที่​่�นำ�จุ ำ ดุ เด่​่นของไฟล์​์ภาพแบบ GIF และแบบ JPG มาพั​ัฒนาร่​่วมกั​ัน ทำำ�ให้​้ไฟล์​์ภาพชนิ​ิดนี้​้�แสดงสี​ีได้​้มากกว่​่า 256 สี​ี และยั​ังสามารถทำำ�พื้​้�นหลั​ังภาพให้​้โปร่​่งใสได้​้ จึ​ึงเป็​็นไฟล์​์ภาพที่​่�ได้​้รับั ความนิ​ิยมมากในปั​ัจจุ​ุบั​ัน

จุ​ุดเด่​่น

1. สนั​ับสนุ​ุนสี​ีได้​้ตามค่​่า True color (16 bit, 32 bit หรื​ือ 64 bit)

2. สามารถกำำ�หนดค่​่าการบี​ีบอั​ัดไฟล์​์ได้​้ตามที่​่�ต้​้องการ

3. ทำำ�ภาพพื้​้�นหลั​ังแบบโปร่​่งใสได้​้

จุ​ุดด้​้อย 1. หากกำำ�หนดค่​่าการบี​ีบอั​ัดไฟล์​์ไว้​้สู​ูงจะใช้​้เวลาในการคลายไฟล์​์ภาพสู​ูงตามไปด้​้วย 2. ไม่​่สนั​ับสนุ​ุนกั​ับบราวเซอร์​์รุ่​่�นเก่​่า 3. โปรแกรมสนั​ับสนุ​ุนในการสร้​้างมี​ีน้​้อย

-- 108 107 --

4. BMP (Bitmap)

เป็​็นรู​ูปแบบของไฟล์​์ภาพมาตรฐานที่​่�ใช้​้ได้​้ในระบบปฏิ​ิบั​ัติ​ิการวิ​ินโดวส์​์ โดยมี​ีลั​ักษณะ การจั​ัดเก็​็บไฟล์​์ภาพเป็​็นจุ​ุดสี​ีที​ีละจุ​ุดจึ​ึงทำำ�ให้​้ภาพดู​ูเสมื​ือนจริ​ิง

จุ​ุดเด่​่น 1. แสดงรายละเอี​ียดสี​ีได้​้ 24 บิ​ิต 2. ไม่​่มี​ีการสู​ูญเสี​ียข้​้อมู​ูลใด ๆ เมื่​่�อมี​ีการย่​่อหรื​ือขยายภาพ 3. นำำ�ไปใช้​้งานได้​้กั​ับทุ​ุกโปรแกรมในระบบปฏิ​ิบั​ัติ​ิการวิ​ินโดวส์​์

จุ​ุดด้​้อย 1. ภาพมี​ีขนาดใหญ่​่มากจึ​ึงใช้​้เนื้​้�อที่​่�ในการจั​ัดเก็​็บค่​่อนข้​้างมาก 2. ความละเอี​ียดของภาพอาจจะไม่​่ชั​ัดเจนเหมื​ือนต้​้นฉบั​ับ

5. TIF หรื​ือ TIFF (Tagged Image File)

เป็​็นไฟล์​์ที่​่�ใช้​้เก็​็บภาพแบบราสเตอร์​์คุ​ุณภาพสู​ูง เช่​่น ภาพกราฟิ​ิกที่​่�นำำ�ไปทำำ�งานด้​้าน สิ่​่ง� พิ​ิมพ์​์ สามารถเก็​็บข้อ้ มู​ูลของภาพไว้​้ได้​้ครบถ้​้วน ทำำ�ให้​้คุณ ุ ภาพของสี​ีเหมื​ือนต้​้นฉบั​ับ

จุ​ุดเด่​่น

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

2. แสดงรายละเอี​ียดสี​ีได้​้ 48 บิ​ิต

3. ไฟล์​์มี​ีความยื​ืดหยุ่​่�นสู​ูง สามารถเปลี่​่�ยนแปลงแก้​้ไขได้​้

4. เมื่​่�อมี​ีการบี​ีบอั​ัดไฟล์​์จะมี​ีการสู​ูญเสี​ียข้​้อมู​ูลน้​้อยมาก

5. มี​ีโปรแกรมสนั​ับสนุ​ุนการสร้​้างจำำ�นวนมาก

จุ​ุดด้​้อย 1. ไฟล์​์ภาพมี​ีขนาดค่​่อนข้​้างใหญ่​่ 2. ใช้​้พื้​้�นที่​่�ในการจั​ัดเก็​็บไฟล์​์ภาพสู​ูง

- 109 108 -

6. PSD (Photoshop Document)

เป็​็นไฟล์​์ภาพเฉพาะโปรแกรม Adobe Photoshop จะทำำ�การบั​ันทึ​ึกแบบแยกเลเยอร์​์ (Layer) โดยเก็​็บประวั​ัติกิ ารทำำ�งานและรายละเอี​ียดการตกแต่​่งภาพ เอาไว้​้ เพื่​่อ� ง่​่ายต่​่อการแก้​้ไขใน ภายหลั​ัง

จุ​ุดเด่​่น

1. มี​ีการบั​ันทึ​ึกแบบแยกเลเยอร์​์และเก็​็บประวั​ัติ​ิการทำำ�งานทุ​ุกขั้​้�นตอน

2. สามารถนำำ�ไฟล์​์ภาพมาแก้​้ไขได้​้ในภายหลั​ัง

จุ​ุดด้​้อย 1. ไฟล์​์ภาพมี​ีขนาดใหญ่​่เมื่​่�อเที​ียบกั​ับไฟล์​์ภาพประเภทอื่​่�น

ภาพที่​่� 4.5 ตั​ัวอย่​่างนามสกุ​ุลไฟล์​์ภาพ ที่​่�มา : นุ​ุจรี​ี บุ​ุรี​ีรั​ัตน์​์ (2564)

- 110 -

เทคนิ​ิคการออกแบบคอมพิ​ิวเตอร์​์กราฟิ​ิก

เทคนิ​ิคการออกแบบคอมพิ​ิวเตอร์​์กราฟิ​ิก

ภาพกราฟิ​ิก แบ่​่งเป็​็น 2 ประเภท คื​ือ ภาพกราฟิ​ิกแบบ 2 มิ​ิติ​ิ และแบบ 3 มิ​ิติ​ิ ภาพกราฟิ​ิกแบบ 2 มิ​ิติ​ิ เป็​็นภาพที่​่�พบเห็​็นโดยทั่​่�วไป เช่​่น ภาพถ่​่าย รู​ูปวาด ภาพ ลายเส้​้น สั​ัญลั​ักษณ์​์ กราฟ รวมถึ​ึงการ์​์ตู​ูนต่​่างๆ ในโทรทั​ัศน์​์ เช่​่น การ์​์ตู​ูนเรื่​่�องพิ​ิภพยมราช ชิ​ินจั​ัง และ โดเรมอน เป็​็นต้​้น ซึ่​่�งการ์​์ตู​ูนจะเป็​็นภาพกราฟิ​ิกเคลื่​่�อนไหว (Animation) 2 มิ​ิติ​ิ และแบบ 3 มิ​ิติ​ิ จะมี​ีกระบวนการสร้​้างที่​่�ซั​ับซ้​้อนกว่​่าภาพวาดปกติ​ิ ตั​ัวอย่​่างโปรแกรมที่​่�ใช้​้ในการสร้​้างภาพ กราฟิ​ิกแบบ 2 มิ​ิติ​ิ ได้​้แก่​่ Adobe Flash, Adobe Animate เป็​็นต้​้น

ภาพที่​่� 4.6 ภาพการ์​์ตู​ูน 2 มิ​ิติ​ิ ที่​่�มา : https://www.gamedesigning.org(2018)

- 111 -

ภาพกราฟิ​ิกแบบ 3 มิ​ิติ​ิ มี​ีการผสมผสานงานแบบสองมิ​ิติ​ิทั้​้�งแบบเวกเตอร์​์และภาพ แรสเตอร์​์เข้​้าด้​้วยกั​ัน คื​ือการขึ้​้�นโครงสร้​้างในแบบสามมิ​ิติ​ิ โดยใช้​้การกำำ�หนดลวดลายหรื​ือปรั​ับ รายละเอี​ียดพื้​้�นผิ​ิวด้​้วยภาพสองมิ​ิติ​ิ ให้​้เป็​็นภาพกราฟิ​ิก โดยใช้​้โปรแกรมในการสร้​้างภาพ 3 มิ​ิติ​ิ เข้​้ามาช่​่วย เช่​่น โปรแกรม 3 Ds max โปรแกรม Maya ซึ่�ง่ โปรแกรมเหล่​่านี้​้� จะทำำ�ให้​้ได้​้ภาพมี​ี สี​ีและแสงเงาเหมื​ือนจริ​ิง เหมาะกั​ับงานด้​้านสถาปั​ัตย์​์และการออกแบบต่​่างๆ รวมถึ​ึงการสร้​้าง เป็​็นภาพยนตร์​์การ์​์ตู​ูน หรื​ืองานโฆษณาสิ​ินค้​้าต่​่างๆ เช่​่น การ์​์ตู​ูน เรื่​่�อง Nemo The Bug และ ปั​ังปอนด์​์แอนิ​ิเมชั​ัน เป็​็นต้​้น

ภาพที่​่� 4.7 ภาพการ์​์ตู​ูน 3 มิ​ิติ​ิ ที่​่�มา : https://world.kapook.com (2018)

-112-

ตั​ัวอย่​่างการสร้​้างเอฟเฟคตกแต่​่งภาพ วิ​ิธี​ีการทำำ�ภาพบุ​ุคคลแบบ Multiple Exposure

การแต่​่งภาพ Multiple Exposure สามารถทำำ�ได้​้หลายวิ​ิธี​ี เช่​่นการแต่​่งภาพแบบ Surreal portrait ของช่​่างภาพ Piotr Skoczylas โดยใช้​้โปรแกรม Photoshop ซึ่​่�งมี​ีวิ​ิธี​ีทำำ�ดั​ังนี้​้�

1. เลื​ือกภาพที่​่�ต้​้องการมาสองภาพ เช่​่น ภาพคน และภาพถนน

2. นำำ�ภาพที่​่�ต้​้องการมาซ้​้อนทั​ับกั​ัน โดยคั​ัดลอกภาพถนนมาไว้​้บนอี​ีกภาพคน แล้​้วจั​ัด องค์​์ประกอบให้​้ดี​ี ในตั​ัวอย่​่าง อยากให้​้ถนนตรงกลางศี​ีรษะ หลั​ังจากจั​ัดเรี​ียบร้​้อยแล้​้ว เปลี่​่�ยน Blending mode ของภาพถนน เป็​็น Screen

3. ลด Saturate ทั้​้ง� ภาพ (จะกลายเป็​็นขาวดำำ�)

- 113 -

4. ปรั​ับแต่​่ง Contrast ในแต่​่ ล ะ Layer ให้​้ เหมาะสม

5. ลบส่​่วนที่​่�ไม่​่ ต้​้องการออก

6. ตกแต่​่งภาพโดยการ เพิ่​่�มนกเข้​้าไป

- 114 -

7. เพิ่​่�มแสงตรงกลาง อาจหาภาพสี​ี ส วย ๆ ม า แ ล ะ เ ปลี่​่� ย น Blending mode เป็​็น Screen และลบ ส่​่วนที่​่�ไม่​่ต้​้องการออก

8. ปรั​ับ Contrast และ สี​ี

9. เพิ่​่ม� ภาพ / เลเยอร์​์ เข้​้าไป เพื่​่อ� เพิ่​่ม� อารมณ์​์ ของภาพ ในที่​่น� เ�ี ป็​็นภาพ ฝนแบบเบลอ ๆ แล้​้วใช้​้ Blending mode เป็​็น Screen

- 115 -

10. เพิ่​่�มความคมด้​้วยการทำำ� High Pass filter แล้​้ว Blending mode เป็​็น Soft light

11. ถ้​้าพื้​้�นที่​่�ว่​่างด้​้านข้​้างมี​ีเยอะไป ก็​็สามารถครอปภาพให้​้แคบลงมาได้​้

- 116 -

การตกแต่​่งภาพบุ​ุคคลแบบ Multiple Exposure

ภาพบุ​ุคคลแบบ Multiple Exposure

- 117 116 -

05

รู​ูปแบบการนำำ�เสนอข้​้อมู​ูลผ่​่านสื่​่�อ จั​ัดเตรี​ียมไฟล์​์สำำ�หรั​ับการพิ​ิมพ์​์

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

การฝึ​ึกฝนเทคนิ​ิคที่​่�เกี่​่�ยวข้​้องกั​ับการพิ​ิมพ์​์จะเป็​็นหั​ัวใจสำำ�คั​ัญในการกำำ�หนดอารมณ์​์ และความรู้​้�สึ​ึกของผลงานที่​่�กำำ�ลั​ังจะถู​ูกสร้​้างขึ้​้�น การวางแผนในการพิ​ิมพ์​์เช่​่นการใส่​่สี​ีพิ​ิเศษ การจั​ัดการวั​ัตถุ​ุดิ​ิบ รวมถึ​ึงความรู้​้�ความสามารถในการพิ​ิมพ์​์ และทั​ันสมั​ัย จะช่​่วยให้​้งานมี​ีความ ละเอี​ียดมากยิ่​่�งขึ้​้�น พยายามฝึ​ึกให้​้เป็​็นนิ​ิสั​ัยและทำำ�งานได้​้อย่​่างเป็​็นขั้​้�นเป็​็นตอน โดยเราอาจจะ ลองสร้​้างเล่​่มตั​ัวอย่​่างในหลากหลายรู​ูปแบบ รวมถึ​ึงการสร้​้างแม่​่แบบของบรรจุ​ุภั​ัณฑ์​์ เทคนิ​ิค การเข้​้าเล่​่มให้​้สวยงาม แข็​็งแรง และรวดเร็​็ว มี​ีตั​ัวอย่​่างสี​ีที่​่�จะปรากฏอยู่​่�ในผลงานจริ​ิง (ที่​่�คุ​ุณภาพ อาจจะตกลงไปจากต้​้นฉบั​ับ) เช่​่น คุ​ุณอาจจะลองพิ​ิมพ์​์สี​ีแพนโทนเก็​็บไว้​้เป็​็นตั​ัวอย่​่างอ้​้างอิ​ิงก็​็ได้​้

ภาพที่​่� 5.1 วิ​ิธี​ีพิ​ิมพ์​์เอกสาร PDF ที่​่�มา : นุ​ุจรี​ี บุ​ุรี​ีรัตน์ ั ์ (2564)

- 118 -

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

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

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

ภาพที่​่� 5.2 PDF icon ที่​่�มา : https://worldvectorlogo.com (2018) - 119 -

บทบาทของไฟล์​์ PDF

เอกสาร PDF (Portable Document Format) คื​ือ ไฟล์​์ประเภทหนึ่​่�งที่​่�สร้​้างมาจาก โปรแกรมประเภท PDF Creator จาก Acrobat ที่​่�ถู​ูกพั​ัฒนาจากที​ีมงานของ Adobe โปรแกรม Adobe Acrobat คุ​ุณสมบั​ัติ​ิเบื้​้�องต้​้น จะเป็​็นไฟล์​์ที่​่�ไม่​่สามารถแก้​้ไขได้​้ รู​ูปแบบจะเหมื​ือนต้​้นฉบั​ับ เดิ​ิม จึ​ึงเหมาะสมกั​ับการทำำ�เอกสารตั​ัวอย่​่าง และการทำำ�เอกสารอิ​ิเล็​็กทรอนิ​ิกส์​์

เนื่​่�องจากไฟลที่​่�ได้​้มี​ีคุ​ุณภาพสู​ูงไม่​่ผิ​ิดไปจากต้​้นฉบั​ับเดิ​ิมที่​่�ออกแบ ผู้​้�ใช้​้ไม่​่สามารถแก้​้ไข รายละเอี​ียดต่​่างๆ ได้​้ และยั​ังสามารถรองรั​ับการอ่​่านข้​้อมู​ูลผ่​่านทาง Web Page ได้​้ดี​ี

ไฟล์​์ PDF หรื​ือ Portable Document format ได้​้มี​ีการพั​ัฒนามาไกลจนเปลี่​่�ยน พฤติ​ิกรรมในการทำำ�งานแบบไม่​่ต้​้องใช้​้กระดาษโดยที่​่�ที​ีมงานลู​ูกค้​้าโรงพิ​ิมพ์​์สามารถตรวจงานได้​้ ทั​ันที​ีจากไฟล์​์ตั้​้�งแต่​่เริ่​่�มร่​่างงาน จนถึ​ึงอนุ​ุมั​ัติ​ิงานหรื​ือเรี​ียกได้​้ว่​่าเป็​็นSoft Proof ไฟล์​์ PDF ได้​้รั​ับ การยอมรั​ับว่​่าเป็​็นมาตรฐานในระดั​ับอุ​ุตสาหกรรมโดยสามารถส่​่งไฟล์​์ PDF ไปตี​ีพิ​ิมพ์​์เป็​็น โฆษณาหรื​ือเนื้​้�อหาในสิ่​่�งพิ​ิมพ์​์อื่​่�นๆ และให้​้คุ​ุณภาพรวมถึ​ึงรายละเอี​ียดที่​่�ครบถ้​้วนคมชั​ัด

หลาย ๆ โปรแกรม ที่​่�ใช้​้ในการออกแบบได้​้รองรั​ับการสร้​้างไฟล์​์ PDF ค่​่าสี​ีรู​ูปแนบไป พร้​้อมแนบไฟล์​์ สำำ�หรั​ับโปรแกรม Acrobat InDesign หรื​ือ Illustrator ควรตั้​้�งค่​่าการ Save ไฟล์​์ PDF ให้​้เหมาะสมมากที่​่�สุ​ุดด้​้วยการไปที่​่�เมนู​ู Adobe PDF Presets > Press Quality สำำ�หรั​ับโปรแกรม InDesign หากต้​้องการปรั​ับแต่​่งค่​่าโดยละเอี​ียดด้​้วยตนเองสามารถทำำ�ได้​้โดย ไปที่​่�เมนู​ู File > Export แล้​้วเลื​ือกนามสกุ​ุลของไฟล์​์ที่​่�ต้​้องการก่​่อนจะคลิ​ิกปุ่​่�มเซฟจากนั้​้�นจะ มี​ีหน้​้าต่​่างตั​ัวเลื​ือกปรากฏขึ้​้�นให้​้เลื​ือก Compression > Do Not Downsample เลื​ือกเส้​้น Mark และ Bleed หรื​ือเส้​้นปรั​ับตกเพื่​่อ� กำำ�หนดขอบเขตของงานรวมถึ​ึงแนวการพิ​ิมพ์​์ให้​้กับั ทาง โรงพิ​ิมพเมื่​่อ� เซฟเสร็​็จเรี​ียบร้​้อยแล้​้วให้​้ทดลองเปิ​ิดโปรแกรม PDF ด้​้วย Acrobat ดู​ูว่า่ ทุ​ุกสิ่​่ง� ถู​ูกต้​้อง หรื​ือไม่​่

- 120 -

การฝั​ังไฟล์​์ Format ไม่​่ได้​้ฝั​ังไฟล์​์ฟอนต์​์ไปกั​ับงาน ทำำ�ให้​้ตั​ัวไฟล์​์และการคั​ัดลอกไฟล์​์ หรื​ือตกหล่​่นระหว่​่างการคั​ัดลอกข้​้อมู​ูล เมื่​่�อผู้​้�ที่​่�รั​ับไฟล์​์เปิ​ิดไฟล์​์เพื่​่�อนำำ�เข้​้าสู่​่�ระบบการพิ​ิมพ์​์ ส่​่วน ที่​่�ไม่​่มี​ีผลดั​ังกล่​่าวจะถู​ูกแทนที่​่�ด้​้วยเฟอร์​์นิ​ิเจอร์​์อื่​่�นๆ ซึ่�ง่ จะทำำ�ให้​้เกิ​ิดเหตุ​ุการณ์​์เลวร้​้ายตามมา ดั​ังนั้​้�นการฝั​ังไฟล์​์ก่​่อนจะช่​่วยป้​้องกั​ันการแทนที่​่�ซ้​้อนและช่​่วยให้​้งานพิ​ิมพ์​์ออกมาตรงกั​ับสิ่​่�งที่​่� ต้​้องการเครื่​่�องมื​ือตรวจสอบไฟล์​์งานก่​่อนการพิ​ิมพ์​์ในโปรแกรม In Design หรื​ือ Illustrator จะ ช่​่วยลดความผิ​ิดพลาดก่​่อนจะเซฟเป็​็นไฟล์​์ PDF แต่​่ควรเปิ​ิดดู​ูคุ​ุณสมบั​ัติ​ิหรื​ือ Properties ของ ไฟล์​์ PDF ที่​่�ได้​้มาเพื่​่�อตรวจสอบด้​้วย

PDF/X การตรวจสอบไฟล์​์งานก่​่อนการพิ​ิมพ์​์แบบไฟล์​์ PDF/Xและ PDF/A โดยมาตรฐาน ดั​ังกล่​่าวถู​ูกกำำ�หนดโดยองค์​์การระหว่​่างประเทศว่​่าด้​้วยการมาตรฐาน (International organization for Standardization, ISO) เพื่​่�อให้​้เป็​็นรู​ูปแบบเดี​ียวกั​ันทั้​้�งหมดอาจสร้​้างไฟล์​์ งานตั​ัวอย่​่าง ด้​้วยการคลิ​ิกเลื​ือก PDF-X1 จากเมนู​ู Adobe PDF Presets ซึ่�ง่ เป็​็นหนึ่​่�งในตั​ัว เลื​ือกที่​่� มั่​่� น ใจได้​้ ว่​่ า ไฟล์​์ จ ะมี​ี ค วามถู​ู ก ต้​้ อ งและปลอดภั​ั ย ตรงกั​ั บที่​่� อ อกแบบไว้​้ ใ นโปรแกรม InDesign

ชนิ​ิดของไฟล์​์และการบี​ีบอั​ัดไฟล์​์

การจั​ัดเก็​็บและการบี​ีบอั​ัดไฟล์​์ของแต่​่ละโปรแกรมมี​ีมาตรฐานที่​่�ต่​่างกั​ัน ดั​ังนั้​้�นการใช้​้ งานไม่​่ถู​ูกต้​้องย่​่อมสร้​้างปั​ัญหาให้​้กั​ับนั​ักออกแบบ การรู้​้�จั​ักชนิ​ิดของไฟล์​์ย่​่อมเป็​็นการป้​้องกั​ัน ปั​ัญหาที่​่�อาจเกิ​ิดขึ้​้�นได้​้

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

.ZIP และ .SIT เป็​็นนามสกุ​ุลของไฟล์​์ที่​่�ถู​ูกบี​ีบอั​ัดแล้​้ว โดยหลั​ักการคื​ือโปรแกรมจะลบ ข้​้อมู​ูลที่​่�มี​ีความซ้ำำ�ซ้ � ้อนออก ก่​่อนจะคั​ัดลอกมาเติ​ิมเต็​็มอี​ีกครั้​้�งด้​้วยการ “Unzip” หรื​ือ “Unstuff” ผ่​่านโปรแกรมอย่​่าง WinZip หรื​ือ Stuffit และได้​้ไฟล์​์ที่​่�เหมื​ือนต้​้นฉบั​ับกลั​ับมา

- 121 -

การสร้​้างงานนำำ�เสนอที่​่�น่​่าดึ​ึงดู​ูด

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

สี​ี

เครื่อ�่ งปริ้​้�นสี​ีคุณ ุ ภาพสู​ูง จะให้​้ผลลั​ัพธ์ที่​่์ ใ� กล้​้เคี​ียงกั​ับการพิ​ิมพ์​์ 4 สี​ีในขั้​้น� ตอนการผลิ​ิต แต่​่ อาจแตกต่​่างออกไปจากการพิ​ิมพ์​์ใช้​้เสี​ียงพิ​ิมพ์​์แพนโทน ส่​่วนสี​ีที่​่แ� สดงบนจอมอนิ​ิเตอร์​์นั้​้น� แตกต่​่าง กั​ับการพิ​ิมพ์​์แน่​่นอนเนื่​่อ� งจากมี​ีค่า่ สี​ีที่​่ต่� า่ งกั​ัน เว้​้นแต่​่หน้​้าจอมอนิ​ิเตอร์​์จะได้​้รับั การสอบเที​ียบค่​่าสี​ี Calibrate มาเป็​็นอย่​่างดี​ี หรื​ือจะใช้​้รหั​ัสสี​ีแพนโทนในการอ้​้างอิ​ิงสี​ีก็ไ็ ด้​้ โดยเราอาจเลื​ือกผสมและ ปรั​ับแต่​่งสี​ีให้​้เรี​ียบร้​้อยก่​่อนจะจดบั​ันทึ​ึกรหั​ัสสี​ีนั้​้�นเอาไว้​้หรื​ือสร้​้างไฟล์​์แยกเพื่​่�อบั​ันทึ​ึกค่​่าสี​ีทั้​้�งหมด และตั้​้ง� ชื่​่อ� ว่​่า “Comp” ก่​่อนจะส่​่งไฟล์​์ดังั กล่​่าวนี้​้ใ� ห้​้กับลู ั กู ค้​้าหรื​ือโรงพิ​ิมพ์​์ต่อ่ ไป

รู​ูปแบบ

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

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

- 122 -

ภาพที่​่� 5.3 สมุ​ุดทำำ�มื​ือ ที่​่�มา : http://www.blisby.com (2018)

สร้​้างต้​้นแบบด้​้วยมื​ือ

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

- 123 -

การเลื​ือกใช้​้กระดาษและการเก็​็บงาน

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

กระดาษนั้​้น� ผลิ​ิตจากเยื่​่อ� ไม้​้ คอตตอน หรื​ือกระดาษรี​ีไซเคิ​ิล คุ​ุณสมบั​ัติขิ องกระดาษ สามารถแบ่​่งได้​้ 7 คุ​ุณสมบั​ัติ​ิดั​ังนี้​้�

1. น้ำ�หนั​ัก เป็​็นตั​ัวบอกความหนาของเยื่​่�อกระดาษที่​่�มาทำำ�เป็​็นแผ่​่น หน่​่วยเป็​็นปอนด์​์ หรื​ือกรั​ัมต่​่อตารางเมตร กระดาษซองจดหมายอาจมี​ีน้ำ�หนั​ัก 24 ปอนด์​์หรื​ือหน้​้าปกเอกสารอาจ มี​ีน้ำ�หนั​ักถึ​ึง 140 ปอนด์​์

2. ความหนาวั​ัดได้​้โดยใช้​้เครื่​่�องคาลิ​ิปเปอร์​์ (Caliper) หน่​่วยเป็​็นนิ้​้�วหรื​ือมิ​ิลลิ​ิเมตร อย่​่างไรก็​็ตามกระดาษที่​่�หนากว่​่าไม่​่ได้​้หมายความว่​่าจะให้​้คุ​ุณภาพการพิ​ิมพ์​์ที่​่�ดี​ีกว่​่า

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

4. ความแข็​็งแรง (ความตึ​ึงและยื​ืดหยุ่​่�น) เป็​็นผลที่​่�เกิ​ิดจากพื้​้�นผิ​ิว ความหนาแน่​่น น้ำ�หนั​ัก และความหนารวมกั​ัน

5. ความโปร่​่งใส ขึ้​้�นกั​ับความหนาแน่​่นและความหนาของกระดาษเป็​็นตั​ัวบอกว่​่า ข้​้อความหรื​ือรู​ูปที่​่�พิ​ิมพ์​์บนกระดาษนั้​้�นจะทะลุ​ุไปอี​ีกด้​้านหนึ่​่�งของกระดาษได้​้มากน้​้อยเพี​ียงใด กระดาษเวลลั​ัม (Vellum Paper) เป็​็นกระดาษที่​่�มี​ีความโปร่​่งใสมากที่​่�สุ​ุดผลิ​ิตได้​้โดยการนำำ� กระดาษคุ​ุณภาพสู​ูงไปแช่​่ลงในกรด

6. ความสว่​่าง ขึ้​้น� กั​ับว่า่ เยื่​่อ� กระดาษได้​้ฟอกขาวก่​่อนนำำ�มากดอั​ัดเป็​็นแผ่​่นมากน้​้อยเพี​ียงไร กระดาษที่​่�สว่​่างกว่​่าคื​ือกระดาษที่​่�มี​ีการสะท้​้อนแสงกลั​ับมามากกว่​่าให้​้ความรู้​้�สึ​ึกสดใสกว่​่า การ เก็​็บรั​ักษาก็​็ส่​่งผลต่​่อความสว่​่าง หากเก็​็บกระดาษในสภาพแวดล้​้อมที่​่�ไม่​่มี​ีการควบคุ​ุมความสว่​่าง จะลดลงตามกาลเวลา

- 124 -

7. สี​ีของกระดาษ เกิ​ิดจากการใส่​่สี​ีย้​้อมลงไปในเยื่​่�อกระดาษก่​่อนจะกดอั​ัด กระดาษสี​ีจะ มี​ีค่​่าใช้​้จ่​่ายในการผลิ​ิตสู​ูงกว่​่ากระดาษขาว

ภาพที่​่� 5.4 กระดาษด้​้าน ที่​่�มา : https://www.iop.co.th (2018)

ผิ​ิวด้​้าน (Matte) ซาติ​ิน (Satin) และมั​ันเงา (Glossy)

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

- 125 -

ภาพที่​่� 5.5 นามบั​ัตรปั๊​๊�มนู​ูน ที่​่�มา : http://www.3bprinting.com (2018)

การใส่​่เทคนิ​ิคพิ​ิเศษและการเคลื​ือบผิ​ิว

เทคนิ​ิคพิ​ิเศษและการเคลื​ือบผิ​ิวสามารถนำำ�ไปใช้​้กั​ับสิ่​่�งพิ​ิมพ์​์ทั้​้�งแผ่​่นหรื​ือเฉพาะบางจุ​ุด ก็​็ได้​้ แบ่​่งเป็​็น 5 รู​ูปแบบหลั​ัก ดั​ังนี้​้�

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

2. อาบ UV คื​ือการอาบน้ำำ��ยาลงบนพื้​้�นผิ​ิว และทำำ�ให้​้เป็​็นชั้​้�นฟิ​ิล์​์มด้​้วยการใช้​้แสงอั​ัลตรา ไวโอเล็​็ต สามารถเคลื​ือบได้​้ทั้​้�งแบบด้​้านและมั​ันเงา ระบุ​ุเฉพาะบริ​ิเวณที่​่�ต้​้องการได้​้อี​ีกด้​้วย

3. การพ่​่นสี​ีที่​่�ใช้​้น้ำำ��เป็​็นตั​ัวทำำ�ละลาย (Aqueous coathing) สามารถเคลื​ือบได้​้ทั้​้�งแบบ ด้​้าน ซาติ​ิน และมั​ันเงา มี​ีค่​่าใช้​้จ่​่ายสู​ูง ยากต่​่อการควบคุ​ุมพื้​้�นที่​่� เหมาะต่​่อการพ่​่นเคลื​ือบทั้​้�งแผ่​่น มากกว่​่า

4. ลามิ​ิเนต (Laminate) ใช้​้แผ่​่นพลาสติ​ิกใสหรื​ือของเหลวใสเพื่​่�อเป็​็นเนื้​้�อเดี​ียวกั​ับ กระดาษ ซึ่​่�งจะช่​่วยปกป้​้องเนื้​้�อกระดาษได้​้ด้​้วย

5. ปั๊​๊�มนู​ูน (Emboss) กระดาษสามารถปั๊​๊�มตั​ัวอั​ักษรหรื​ือโลโก้​้ให้​้นู​ูนออกมาได้​้ อี​ีกทั้​้�งยั​ัง นำำ�ไปปั๊​๊�มศรี​ีโลหะโดยการใช้​้แผ่​่นฟอยล์​์หรื​ือเพิ่​่�มความมั​ันเงา สี​ีสะท้​้อนแสง เอฟเฟคพิ​ิเศษต่​่างๆ หรื​ือใช้​้เลเซอร์​์ฉลุ​ุลวดลาย เทคนิ​ิคเหล่​่านี้​้�จะสร้​้างความประทั​ับใจให้​้กั​ับชิ้​้�นงานแต่​่มั​ักจะมี​ีค่​่าใช้​้ จ่​่ายสู​ูง ดั​ังนั้​้�น อย่​่าลื​ืมประเมิ​ินงบประมาณให้​้เหมาะสมกั​ับเทคนิ​ิคที่​่�จะเลื​ือกใช้​้ด้​้วย

- 126 -

การพิ​ิมพ์​์ดิ​ิจิ​ิทั​ัล

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

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

- 127 126 -

น้ำ�หมึ​ึกและผงหมึ​ึก

ในการพิ​ิมพ์​์ดิจิ​ิ ิทั​ัลที่​่�ใช้​้ผงหมึ​ึก ผงหมึ​ึก จะไม่​่ซึ​ึมทะลุ​ุกระดาษเหมื​ือนน้ำำ�� หมึ​ึก แต่​่ผง หมึ​ึกจะไปสร้​้างเป็​็นชั้​้�นฟิ​ิล์​์มบางๆ บนผิ​ิว กระดาษ นั​ักออกแบบและโรงพิ​ิมพ์​์บางที่​่�เชื่​่�อ ว่​่ า การพิ​ิ ม พ์​์ แ บบดิ​ิ จิ​ิ ต อลทำำ� ให้​้ สี​ี ที่​่� ส ดกว่​่ า เนื่​่�องจากแสงที่​่�ตกกระทบผงหมึ​ึกจะไม่​่ถู​ูกดู​ูด ซั​ับด้​้วยกระดาษ ต่​่างกั​ับน้ำำ��หมึ​ึกที่​่�จงอยู่​่�ในเนื้​้�อ กระดาษทำำ�ให้​้เสี​ียแสงไปส่​่วนหนึ่​่�ง แต่​่สี​ีที่​่�สด กว่​่าอาจไม่​่ได้​้ดี​ีกว่​่าเสมอไป เพราะบางครั้​้�งจะดู​ู เจิ​ิดจ้​้าเกิ​ินไป ดั​ังนั้​้�นอย่​่าลื​ืมปรั​ับค่​่าความสด ของสี​ีให้​้ตรงกั​ับความต้​้องการก่​่อนเริ่​่�มพิ​ิมพ์​์จริ​ิง ภาพที่​่� 5.6 สี​ีผงหมึ​ึก ที่​่�มา : https://th.pngtree.com (2018) เสมอ บางครั้​้�งการใช้​้ผงหมึ​ึกกั​ับเครื่​่�องพิ​ิมพ์​์ดิ​ิจิ​ิทั​ัลบางรุ่​่�นอาจมี​ีปั​ัญหาเรื่​่�องแถบสี​ีประหลาด จากการผสมหรื​ือซ้​้อนทั​ับกั​ันของผงหมึ​ึก ดั​ังนั้​้�นอาจขอให้​้ทางสำำ�นั​ักพิ​ิมพ์​์พิ​ิมพ์​์ต้​้นฉบั​ับขึ้​้�นมา สั​ักหนึ่​่�งชุ​ุดเพื่​่�อตรวจสอบว่​่าถู​ูกต้​้องตรงตามความต้​้องการหรื​ือไม่​่

กรอบเวลา

การพิ​ิมพ์​์ดิจิ​ิ ิทั​ัลไม่​่ต้​้องเสี​ียเวลาระหว่​่างพิ​ิมพ์​์ เนื่​่�องจากไม่​่ต้​้องเตรี​ียมการอะไรมากนั​ัก สำำ�นั​ักพิ​ิมพ์​์บางแห่​่งอาจใช้​้เทคนิ​ิคการพิ​ิมพ์​์งานหลายๆ ชิ้​้�นที่​่�ใช้​้กระดาษแบบเดี​ียวกั​ันพร้​้อมกั​ัน ทำำ�ให้​้ไม่​่ต้​้องเปลี่​่�ยนกระดาษไปมา ประหยั​ัดเวลาทำำ�งาน

การพิ​ิมพ์​์เฉพาะชิ้​้�นงาน

การพิ​ิ ม พ์​์ ดิ​ิ จิ​ิ ทั​ั ล เหมาะสำำ� หรั​ั บสิ่​่� ง พิ​ิ ม พ์​์ ที่​่� มี​ี ก ารเปลี่​่� ย นแปลงข้​้ อ มู​ู ล จากฐานข้​้ อ มู​ู ล ตลอดเวลา ทำำ�ให้​้สิ่​่�งพิ​ิมพ์​์แต่​่ละชุ​ุดไม่​่ซ้ำำ��กั​ัน สื่​่�อสิ่​่�งพิ​ิมพ์​์ใดที่​่�มี​ีความหลากหลายของข้​้อมู​ูล หรื​ือ การออกแบบเฉพาะชิ้​้�นงาน

- 128 -

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

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

องค์​์ประกอบในการแสดงผลงานออนไลน์​์

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

ภาพที่​่� 5.7 การเผยแพร่​่งานทางออนไลน์​์ ที่​่�มา : https://steemit.com (2018)

- 129 -

เตรี​ียมรู​ูปภาพงานตั​ัวอย่​่าง

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

จุ​ุดเริ่​่�มต้​้นในการแสดงผลงาน

การก้​้าวข้​้ามจากนั​ักออกแบบฝึ​ึกหั​ัดไปสู่​่�นั​ักออกแบบมื​ืออาชี​ีพ ควรเริ่​่ม� ต้​้นจากการสร้​้าง ชื่​่อ� โดเมน (Domain) และบั​ัญชี​ีสำ�ำ หรั​ับผู้​้�บริ​ิการฝากเว็​็บไซต์​์ (Web Hosting) ชื่​่�อโดเมนเปรี​ียบได้​้ กั​ับการเช่​่ารถ โดยผู้​้�บริ​ิการรั​ับฝากเว็​็บไซต์​์เป็​็นเหมื​ือนผู้​้�ให้​้บริ​ิการที่​่�จอดรถ ดั​ังนั้​้�นต้​้องมี​ีทั้​้�ง 2 ส่​่วนเพื่​่�อให้​้สามารถแสดงผลงานออนไลน์​์ได้​้

แสดงผลงานตั​ัวอย่​่างแบบง่​่ายๆ (Low-Tech Portfolios) คื​ือการที่​่�นั​ักออกแบบที่​่�อาจไม่​่ถนั​ัดในการสร้​้างเว็​็บไซต์​์ได้​้อั​ัปโหลดผลงานตั​ัวอย่​่างขึ้​้�น ไปบนเว็​็บไซต์​์ที่​่�รั​ับฝากรู​ูป และรั​ับลิ​ิงก์​์ของรู​ูปนั้​้�นๆ จากนั้​้�นหากมี​ีลู​ูกค้​้าสนใจติ​ิดต่​่อขอดู​ูผลงาน ตั​ัวอย่​่าง นั​ักออกแบบสามารถแนบลิ​ิงก์​์ดั​ังกล่​่าวไปในอี​ีเมลได้​้ทั​ันที​ีโดยไม่​่ต้​้องแนบรู​ูปไปใน อี​ีเมลใหม่​่ทุ​ุกๆ ครั้​้�ง วิ​ิธี​ีนี้​้�ได้​้รั​ับความนิ​ิยมในกลุ่​่�มผู้​้�ที่​่�ไม่​่ได้​้เป็​็นนั​ักออกแบบเว็​็บไซต์​์ ลิ​ิงก์​์ของ รู​ูปภาพควรสามารถนำำ�ผู้​้�ชมไปยั​ังข้​้อมู​ูลที่​่�เกี่​่�ยวข้​้องรวมถึ​ึงช่​่องทางการติ​ิดต่​่อกั​ับนั​ักออกแบบ ด้​้วย

- 130 -

ภาพที่​่� 5.8 Flickr.com ที่​่�มา : https://www.flickr.com (2018) Flickr.com เป็​็นหนึ่​่�งเว็​็บไซต์​์ยอดนิ​ิยมในการแสดงผลงานตั​ัวอย่​่าง สามารถแบ่​่ง หมวดของรู​ูปภาพในแกลอรี่​่�ของฟลิ​ิคเกอร์​์ โดยไม่​่จำำ�เป็​็นว่​่ารู​ูปจะต้​้องถู​ูกจั​ัดเรี​ียง ตามลำำ�ดั​ั บ เวลาที่​่� อั​ั ป โหลดหน้​้ า ต่​่ า งการใช้​้ ง านของฟลิ​ิ ค เกอร์​์ นั้​้� น ง่​่ า ยและ เป็​็นมิ​ิตรกั​ับผู้​้�ใช้​้

- 131 130 -

Dribbble.com, Behance.net และ Ducked.com เป็​็นเหมื​ือน Social Network ขนาดย่​่อม ที่​่ส� ามารถติ​ิดตามนั​ักออกแบบท่​่านอื่​่น� หรื​ือผู้​้�อื่น�่ มาติ​ิดตามก็​็ได้​้ ช่​่วยให้​้สามารถ Upload ผลงานตั​ัวอย่​่างทางเว็​็บไซต์​์ จะจั​ัดรู​ูปแบบให้​้สวยงามสะอาดตาพร้​้อมนำำ�เสนอออนไลน์​์ให้​้โดย อั​ัตโนมั​ัติ​ิ Ducked.com เป็​็นเว็​็บไซต์​์ในแบบเดี​ียวกั​ับ Behance.net ซึ่​่ง� สามารถปรั​ับแต่​่งการแสดง ผลงานตั​ัวอย่​่างเพิ่​่ม� เติ​ิมได้​้

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

WordPress เป็​็นตั​ัวเลื​ือกหนึ่​่ง� ที่​่นั� กั ออกแบบส่​่วนใหญ่​่เลื​ือกใช้​้ มี​ีระบบการจั​ัดการเนื้​้อ� หา (CMS) ทำำ�ให้​้สามารถปรั​ับแต่​่งองค์​์ประกอบได้​้หลากหลายรู​ูปแบบ สามารถนำำ�มาใช้​้สร้​้างเว็​็บไซต์​์ เพื่​่อ� แสดงผลงานตั​ัวอย่​่างได้​้อย่​่างมี​ีประสิ​ิทธิ​ิภาพ แม้​้จะมี​ีความซั​ับซ้อ้ น แต่​่ก็เ็ พิ่​่ม� ฟั​ังก์​์ชันั และสร้​้าง สไตล์​์ได้​้อย่​่างอิ​ิสระ

ทิ​ิศทางของเว็​็บไซต์​์แสดงผลงาน

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

ทดสอบผลงาน

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

เปิ​ิดเว็​็บไซต์​์รุ่​่�นเบต้​้า (Beta Test) ให้​้คนอื่​่น� ช่​่วยดู​ูและวิ​ิจารณ์​์เกี่​่ย� วกั​ับเว็​็บไซต์​์ ปรั​ับแต่​่ง ตามคำำ�แนะนำำ�ตามที่​่เ� ห็​็นสมควร ก่​่อนที่​่จ� ะใช้​้เว็​็บไซต์​์ออกไปยั​ังกลุ่​่�มผู้​้�ชมจำำ�นวนมาก

- 132 -

ตั​ัวอย่​่างการนำำ�เสนอผ่​่านสื่​่�อออนไลน์​์ ตั​ัวอย่​่างการอั​ัปโหลดไฟล์​์เพื่​่�อนำำ�เสนอผ่​่านสื่​่�อออนไลน์​์

การนำำ�เสนอผลงานผ่​่านช่​่องทางออนไลน์​์ด้​้วยเว็​็บไซต์​์ https://issuu.com โดยมี​ีขั้​้�น ตอนดั​ังต่​่อไปนี้​้�

1. เตรี​ียมงานที่​่�ต้​้องการอั​ัปโหลดลงเว็​็ปไซต์​์ให้​้พร้​้อม โดยต้​้องบั​ันทึ​ึกเป็​็นไฟล์​์ .pdf แบบ หน้​้าเดี่​่�ยว และเปิ​ิดเว็​็บไซต์​์ https://issuu.com

2. Longin เข้​้าสู่​่�ระบบ

- 133 -

3. คลิ​ิก Upload ตรงมุ​ุมขวา 4. คลิ​ิก Select file to Upload เลื​ือกไฟล์​์ที่​่�จะอั​ัปโหลด

5. รออั​ัปโหลดจนกว่​่าจะเสร็​็จ

- 134 -

6. เมื่​่�ออั​ัปโหลดเสร็​็จให้​้ตั้​้�งชื่​่�อ e-Book และใส่​่รายละเอี​ียดต่​่างๆ เลื​ือกประเภทของ ผลงาน เมื่​่�อใส่​่รายละเอี​ียดต่​่างๆ เรี​ียบร้​้อยแล้​้วกด Publish Now

7. กดเลื​ือก e-Book ที่​่ต้� อ้ งการ และกด EMBED เป็​็นอั​ันเสร็​็จเรี​ียบร้​้อย สามารถแบ่​่งปั​ัน (Share) ผลงานผ่​่านทางเครื​ือข่​่ายสั​ังคมออนไลน์​์ได้​้ต่​่อไป

- 135 -

WORKSHOP

ตั​ัวอย่​่างการออกแบบสื่​่�อรู​ูปแบบต่​่าง ๆ

การออกแบบโลโก้​้

การออกแบบโลโก้ โดยใช้โปรแกรม Adobe Illustrator ในการออกแบบชิ้นงาน เพื่อ นำ�ไปใช้ในการสร้างสรรค์สื่อรูปแบบต่าง ๆ

1. ให้เปิดไฟล์ และสร้างหน้ากะดาษขึ้นมาหม่ โดยกด Ctrl + N

2. ทำ�การตั้งค่าขนาดของโลโก้ที่ต้องการ ในแถบเครื่องมือทางฝั่งขวามือ ช่อง Width และช่อง Height จากนั้นกดปุ่ม Create

- 136 -

3. แถบด้​้านซ้​้ายมื​ือ มี​ีเมนู​ูการใช้​้งานต่​่างๆ ให้​้ทำำ�การเลื​ือกเครื่​่�องมื​ือที่​่�เรี​ียกว่​่า Ellipse Tool หรื​ืออาจใช้​้คี​ีย์​์ลั​ัดในการวาด โดยการกดที่​่�แป้​้นคี​ีย์​์บอร์​์ดที่​่�ตั​ัวอั​ักษร L

4. ทำำ�การคลิ​ิกพื้​้�นที่​่�ว่​่างและกำำ�หนดตำำ�แหน่​่ง ขนาด ตามที่​่�ต้​้องการ

5. ทำำ�การเลื​ือกสี​ีตามความต้​้องการ

- 137 -

6. ให้​้คลิ​ิกเลื​ือกวงกลมที่​่�ทำำ�การสร้​้างไว้​้ เพื่​่�อจะทำำ�การก๊​๊อปปี้​้�วงกลมขึ้​้�นมาอี​ีก 1 วงกลม หรื​ือใช้​้วิ​ิธี​ีกด Ctrl + C ที่​่�แป้​้นคี​ีย์​์บอร์​์ดพร้​้อมกั​ัน

7. ทำำ�การกดที่​่�แป้​้นคี​ีย์​์บอร์​์ด กด Ctrl + Shift + V เพื่​่�อวางวงกลมที่​่�ได้​้ทำำ�การ Copy ไว้​้เพิ่​่�มขึ้​้�นมาอี​ีก 1 อั​ัน

8. ทำำ�การลดขนาดของวงกลมที่​่�ได้​้ทำำ�การ Copy ขึ้​้�นมา ให้​้มี​ีขนาดเล็​็กกว่​่าวงกลมวง แรก โดยการกดปุ่​่�มที่​่�แป้​้นคี​ีย์​์บอร์​์ด โดยการกด Shift + Alt เพื่​่�อทำำ�การลดขนาดของวงกลมให้​้มี​ี ขนาดที่​่�เล็​็กลงกว่​่าวงกลมวงแรก

9. ทำำ�การเลื​ือกเครื่​่�องมื​ือ เพื่​่�อทำำ�การใส่​่สี​ีที่​่�ต้​้องการให้​้กั​ับวงกลมที่​่�ได้​้ทำำ�การวาดไว้​้

- 138 -

10. ทำำ�การพิ​ิมพ์​์อั​ักษร โดยเลื​ือกใช้​้เครื่​่�องมื​ือ Type Tool หรื​ือใช้​้ปุ่​่�มคี​ีย์​์ลั​ัดโดยการกด อั​ักษร T ที่​่�แป้​้นพิ​ิมพ์​์ เพื่​่�อพิ​ิมพ์​์อั​ักษรต่​่าง ๆตามต้​้องการ

11. ทำำ�การเลื​ือก Font ตามความต้​้องการ

12. ปรั​ับขนาด และ ตำำ�แหน่​่งของตั​ัวอั​ักษรให้​้มี​ีความเหมาะสม

13. ใส่​่สี​ีของตั​ัวอั​ักษรตามที่​่�ต้​้องการ

- 139 -

14. เลื​ือกเครื่​่�องมื​ือ Ellipse Tool หรื​ือกดคี​ีย์​์ลั​ัด L 15. ปรั​ับขนาดให้​้เล็​็กลง

16. เลื​ือกเครื่​่�องมื​ือ Scissors Tool ทำำ�การตั​ัดเส้​้นวงกลม สำำ�หรั​ับพิ​ิมพ์​์อั​ักษรให้​้มี​ี ลั​ักษณะโค้​้งตามเส้​้นวงกลม ซึ่​่�งอาจใช้​้การกดคี​ีย์​์ลั​ัด โดยการกดที่​่�แป้​้นพิ​ิมพ์​์ แล้​้วกด C

17. ทำำ�การตั​ัดจุ​ุดตั​ัดของวงกลมทั้​้�งสองฝั่​่�งออก

- 140 -

18. ทำำ�การพิ​ิมพ์​์ตั​ัวอั​ักษรให้​้มี​ีลั​ักษณะตามเส้​้นวงกลม เลื​ือกเครื่​่�องมื​ือ Type Tool หรื​ือการกด คี​ีย์​์ลั​ัดที่​่�แป้​้นพิ​ิมพ์​์ กด T เพื่​่�อพิ​ิมพ์​์ตั​ัวอั​ักษรที่​่�ต้​้องการ

19. ทำำ�การคลิ​ิกที่​่�เส้​้นครึ่​่�งวงกลมที่​่�ได้​้ทำำ�การตั​ัดไว้​้ แล้​้วจึ​ึงพิ​ิมพ์​์ข้​้อความตามที่​่�ต้​้องการ

20. นำำ�เมาส์​์ไปตรงเส้​้นเมื่​่อ� ขึ้​้น� สั​ัญญาลั​ักษณ์​์ 21. เลื่​่�อนตำำ�แหน่​่งตามที่​่�ต้​้องการ 22. ทำำ�แบบเดิ​ิมอี​ีกฝั่​่�งหนึ่​่�ง

- 141 -

ให้​้เลื่​่อ� นเมาส์​์ขึ้น้� เพื่​่อ� กลั​ับด้า้ นตั​ัวอั​ักษร

23. การตกแต่​่งรายละเอี​ียดเพิ่​่�มเติ​ิมให้​้สวยงามนั้​้�น หาภาพมาประกอบ หรื​ือจะวาดลง ไปในชิ้​้�นงานและตกแต่​่งให้​้สวยงามยิ่​่�งขึ้​้�น

- 142 -

การออกแบบโปสเตอร์​์

การออกแบบโปสเตอร์​์ ด้​้วยโปรแกรม Illustrator สิ่​่�งแรกของการจั​ัดเตรี​ียมคื​ือ การ เตรี​ียมภาพประกอบต่​่างๆ จั​ัดเก็​็บไว้​้ในโฟลเดอร์​์ให้​้เรี​ียบร้​้อยเป็​็นสิ่​่�งแรก จึ​ึงเริ่​่�มเปิ​ิดโปรแกรม เพื่​่�อสร้​้างงานในขั้​้�นตอนดั​ังนี้​้�

1. เปิ​ิดโปรแกรม Adobe Illustrator ทำำ�การสร้​้างหน้​้ากระดาษใหม่​่ โดยใช้​้ปุ่​่�มคำำ�สั่​่�ง คี​ีย์​์ลั​ัดโดยกด Ctrl + N เพื่​่�อเลื​ือกขนาดของกระดาษตามต้​้องการ หรื​ือไม่​่ใช้​้ปุ่​่�มคี​ีย์​์ลั​ัด เมื่​่�อเลื​ือก ขนาดกระดาษตามต้​้องการแล้​้ว กดปุ่​่�ม Create

- 143 -

การจั​ัดวางองค์​์ประกอบสำำ�หรั​ับการทำำ�โปสเตอร์​์ เป็​็นการนำำ�ไฟล์​์ภาพต่​่างๆ นำำ�มาจั​ัด เรี​ียงให้​้เกิ​ิดความสวยงาม การนำำ�ภาพพื้​้�นหลั​ังที่​่�จั​ัดเก็​็บไว้​้ โดยทำำ�ขั้​้�นตอนต่​่อไปนี้​้�

2. คลิ​ิกเลื​ือก File จากนั้​้�น คลิ​ิก Open หรื​ือกดคี​ีย์​์ลั​ัด Ctrl + O

3. เลื​ือกไฟล์​์ภาพพื้​้�นหลั​ังที่​่�จั​ัดเก็​็บไว้​้ จากนั้​้�นคลิ​ิก Open

- 144 -

4. คลิ​ิก เพื่​่�อสร้​้าง Layer 5. คลิ​ิก File จากนั้​้�น คลิ​ิก Open หรื​ือคี​ีย์​์ลั​ัด Ctrl + O 6. เลื​ือกรู​ูปที่​่�ต้​้องการ จากนั้​้�นคลิ​ิก Open

7. เครื่​่�องมื​ือ Ellipse Tool หรื​ือคี​ีย์​์ลั​ัด L 8. กด Shift + Alt จากนั้​้�นสร้​้างวงกลมให้​้มี​ีขนาดใหญ่​่กว่​่ารู​ูปภาพเล็​็กน้​้อย

- 145 -

9. กด Shift คลิ​ิกวงกลม + รู​ูปภาพ 10. คลิ​ิกเมาส์​์ขวา เลื​ือก Make Clipping Mask

A รู​ูปที่​่�ทำำ�การตั​ัดพื้​้�นหลั​ังเป็​็นที่​่�เรี​ียบร้​้อย โดยใช้​้คำ�สั่​่ ำ �ง Make Clipping Mask

- 146 -

11. ลากรู​ูปภาพไปยั​ังหน้​้ากระดาษที่​่�เป็​็นพื้​้�นเราที่​่�เราสร้​้างไว้​้

12. คลิ​ิก เพื่​่�อสร้​้าง Layer

13. คลิ​ิก File จากนั้​้�น คลิ​ิก Open หรื​ือคี​ีย์​์ลั​ัด Ctrl + O เพื่​่�อเปิ​ิดไฟล์​์ภาพที่​่�จะนำำ�มา ประกอบกั​ับชิ้​้�นงานนี้​้�

14. เลื​ือกรู​ูปที่​่�ต้​้องการ จากนั้​้�นคลิ​ิก Open

- 147 -

15.

16. รู​ูปภาพเล็​็กน้​้อย

เลื​ือกเครื่​่�องมื​ือ Ellipse Tool หรื​ือคี​ีย์​์ลั​ัด L เพื่​่�อเลื​ือกเฉพาะรู​ูปภาพที่​่�ต้​้องการ กด Shift + Alt จากนั้​้�นจึ​ึงสร้​้างวงกลมล้​้อมรอบภาพ โดยให้​้มี​ีขนาดใหญ่​่กว่​่า

17. กด Shift คลิ​ิกวงกลม + รู​ูปภาพ 18. คลิ​ิกขวาที่​่�เมาส์​์ เลื​ือก Make Clipping Mask

- 148 -

19. ลากรู​ูปภาพมาใส่​่ Layer 3 20. ขยายภาพ 2 โดยกด Shift + Alt ปรั​ับขนาดให้​้เท่​่ากั​ับภาพแรก

21.

22.

เลื​ือกเครื่​่�องมื​ือ Rectangle Tool หรื​ือคี​ีย์​์ลั​ัด M สร้​้างสี่​่�เหลี่​่�ยมขึ้​้�นมา

- 149 -

23. คลิ​ิกที่​่�สี่​่�เหลี่​่�ยม + รู​ูปภาพที่​่� 2

24. คลิ​ิกขวาที่​่�เมาส์​์ เลื​ือก Make Clipping Mask เพื่​่�อเลื​ือกภาพผั​ัดซี​ีอิ้​้�วให้​้ ปรากฏอยู่​่�ในกรอบสี่​่�เหลี่​่�ยมผื​ืนผ้​้า

ก็​็จะได้​้ดั​ังภาพ B

- 150 -

25. คลิ​ิก เพื่​่�อสร้​้าง Layer รู​ูปภาพที่​่� 3 26. คลิ​ิก File จากนั้​้�น คลิ​ิก Open หรื​ือคี​ีย์​์ลั​ัด Ctrl + O 27. เลื​ือกรู​ูปที่​่�ต้​้องการ จากนั้​้�นคลิ​ิก Open

28. คลิ​ิกเครื่​่�องมื​ือ Ellipse Tool หรื​ือคี​ีย์​์ลั​ัด L 29. กด Shift + Alt จากนั้​้�นสร้​้างวงกลมให้​้มี​ีขนาดใหญ่​่กว่​่ารู​ูปภาพเล็​็กน้​้อย

- 151 -

30. กด Shift คลิ​ิกวงกลม + รู​ูปภาพ 31. คลิ​ิกขวาที่​่�เมาส์​์ เลื​ือก Make Clipping Mask

32. ลากรู​ูปภาพมาใส่​่ Layer 4 33. ขยายภาพ 3 โดยกด Shift + Alt ปรั​ับขนาดให้​้เท่​่ากั​ับภาพอื่​่�นๆ

- 152 -

34.

35.

36.

37.

เลื​ือกเครื่​่�องมื​ือ Rectangle Tool หรื​ือคี​ีย์​์ลั​ัด M สร้​้างสี​ีเหลี่​่�ยมขึ้​้�นมา คลิ​ิกที่​่�สี่​่�เหลี่​่�ยม + รู​ูปภาพที่​่� 2 คลิ​ิกขวาที่​่�เมาส์​์ เลื​ือก Make Clipping Mask

C เมื่​่�อทำำ�การตั​ัดต่​่อภาพและจั​ัดเรี​ียงภาพต่​่างๆ เข้​้าด้​้วยกั​ัน ขั้​้�นต่​่อไปเป็​็นการพิ​ิมพ์​์ อั​ักษรประกอบข้​้อมู​ูลบนภาพโปสเตอร์​์

- 153 -

38. คลิ​ิก เพื่​่�อสร้​้าง Layer

39. เลื​ือกเครื่​่�องมื​ือ Type Tool หรื​ือคี​ีย์​์ลั​ัด T สำำ�หรั​ับการพิ​ิมพ์​์ตั​ัวอั​ักษร ประกอบภาพ เพื่​่�อสื่​่�อความหมาย

40. สร้​้างตั​ัวอั​ักษรใน Layer 5

41. เลื​ือกฟอนต์​์ สี​ี และ ปรั​ับขนาดตามที่​่�ต้​้องการ

42. คลิ​ิกเมนู​ู เพื่​่�อสร้​้างรู​ูปแบบตั​ัวอั​ักษร

43. ปรากฎแถบเครื่​่�องมื​ือที่​่�ผู้​้�ใช้​้สามารถคลิ​ิกเลื​ือก Style ของตั​ัวอั​ักษรจากแถบเครื่​่�อง มื​ือได้​้ตามความต้​้องการ

44. สามารถเลื​ือกการปรั​ับขนาดของตั​ัวอั​ักษร ให้​้มี​ีความเหมาะสมตามความต้​้องการ ของผู้​้�ใช้​้งาน

- 154 -

45. เลื​ือกเครื่​่�องมื​ือ Ellipse Tool หรื​ือกดคี​ีย์​์ลั​ัดกดแป้​้นพิ​ิมพ์​์ L เพื่​่�อสร้​้างวงกลม 46. เลื​ือกเครื่​่อ� งมื​ือ Scissors หรื​ือคี​ีย์​์ลั​ัด C 47. ทำำ�การตั​ัดจุ​ุดตั​ัดทั้​้�งสองฝั่​่�ง

- 155 -

48. เลื​ือกเครื่​่�องมื​ือ Type Tool หรื​ือคี​ีย์​์ลั​ัด T 49. คลิ​ิกที่​่�ครึ่​่ง� วงกลมที่​่�ตั​ัดไว้​้ จากนั้​้�นพิ​ิมพ์​์ข้​้อความตามที่​่�ต้​้องการ 50. เลื​ือก ฟอนต์​์ สี​ี ขนาด ตามที่​่�ต้​้องการ

51. การเพิ่​่�มข้​้อความตกแต่​่งให้​้โปสเตอร์​์มี​ีความน่​่าสนใจมากขึ้​้�น โดยใช้​้เครื่​่�องมื​ือ Type Tool หรื​ือคี​ีย์​์ลั​ัด T

- 156 -

52.

53.

54.

55.

คลิ​ิกปุ่​่�ม เพื่​่�อสร้​้าง Layer ลาก Layer ที่​่�สร้​้างล่​่าสุ​ุดไว้​้ล่​่าง Layer ตั​ัวอั​ักษร เลื​ือกเครื่​่�องมื​ือ Rectangle Tool หรื​ือคี​ีย์​์ลั​ัด M สร้​้างกรอบไว้​้ใต้​้ข้​้อความ

56. คลิ​ิกที่​่�จุ​ุดตามรู​ูปภาพ จากนั้​้�นเลื่​่�อนเมาส์​์เข้​้า เพื่​่�อให้​้กรอบเกิ​ิดความโค้​้งมน D ก็​็ จะได้​้ดั​ังภาพ

- 157 -

57. นำำ�รู​ูปภาพมาตกแต่​่งเพื่​่�อความสวยงาม

58. การวาดลายเส้​้น โดยการใช้​้เครื่​่�องมื​ือ Paintbrush Tool หรื​ือคี​ีย์​์ลั​ัด B วาดและ ตกแต่​่งบริ​ิเวณพื้​้�นที่​่�ที่​่�ต้​้องการ

- 158 -

- 159 -

การออกแบบโฆษณาสิ​ินค้​้า

การออกแบบโฆษณาสิ​ินค้​้า ด้​้วยโปรแกรม Adobe Photoshop

1. เปิ​ิดโปรแกรม AdobePhotoshop ทำำ�การสร้​้างหน้​้ากระดาษใหม่​่ โดยใช้​้ปุ่​่�มคำำ�สั่​่�ง คี​ีย์​์ลั​ัดโดยกด Ctrl + N เพื่​่�อเลื​ือกขนาดของกระดาษตามต้​้องการ หรื​ือไม่​่ใช้​้ปุ่​่�มคี​ีย์​์ลั​ัด เมื่​่�อ เลื​ือกขนาดกระดาษตามต้​้องการแล้​้ว กดปุ่​่�ม Create แล้​้วคลิ​ิกเมนู​ู Print

2. เลื​ือกขนาดกระดาษที่​่�จะสร้​้างผลงาน

3. กดปุ่​่�ม Create

- 160 -

4. เลื​ือกแถบเครื่​่�องมื​ือ Gradient Tool เพื่​่�อสร้​้างพื้​้�นหลั​ังให้​้เป็​็นแบบไล่​่โทนแสงเงา

5. คลิ​ิก เพื่​่�อเลื​ือกโทนสี​ีในการออกแบบ

6. ปกติ​ิเครื่​่�องมื​ือจะกำำ�หนดให้​้สี​ีแบบ 2 ระดั​ับ หากต้​้องการออกแบบโดยใช้​้สี​ีมากกว่​่า 2 ระดั​ับขึ้​้�นไป ให้​้คลิ​ิกเม้​้าส์​์บริ​ิเวณแถบเครื่​่�องมี​ี

- 161 -

7. คลิ​ิกเลื​ือกสี​ีที่​่�ต้​้องการทำำ�การออกแบบ

8. คลิ​ิกเลื​ือกรู​ูปแบบการไล่​่ระดั​ับสี​ีตามความต้​้องการ

9. คลิ​ิกเม้​้าส์​์บริ​ิเวณพื้​้�นหลั​ัง และลากเม้​้าส์​์ไปตามทิ​ิศทางที่​่�ผู้​้�ออกแบบต้​้องการให้​้มี​ีการ ไล่​่โทนสี​ี

- 162 -

10. คลิ​ิก เพื่​่�อเพิ่​่�ม Layer ในการทำำ�งาน 11-12. เลื​ือกไฟล์​์ภาพที่​่�จั​ัดเก็​็บข้​้อมู​ูลไว้​้ และนำำ�มาตกแต่​่ง

13. คลิ​ิกเลื​ือกเครื่​่�องมื​ือ Quick Selection Tool และคลิ​ิกที่​่�ภาพ เพื่​่�อจะทำำ�การตั​ัด ภาพจากพื้​้�นหลั​ัง

14. คลิ​ิกระบายส่​่วนที่​่�ต้​้องการจะตั​ัดภาพ หากมี​ีส่​่วนเกิ​ิน เลื​ือกพู่​่�กั​ันลบ ลบส่​่วนที่​่�เกิ​ิน ออก

- 163 -

15. ทำำ�การคั​ัดลอกภาพที่​่�ได้​้ทำำ�การตั​ัดพื้​้�นหลั​ังเป็​็นที่​่�เรี​ียบร้​้อยแล้​้ว โดยกด Ctrl + C และกด Ctrl + V เพื่​่�อนำำ�ภาพที่​่�ทำำ�การตั​ัดแล้​้วมาเพิ่​่�มเลเยอร์​์ใหม่​่

16. คลิ​ิกเครื่​่�อง Move Tool เพื่​่�อเคลื่​่�อนย้​้ายภาพ และจั​ัดวางให้​้เหมาะสม

17-18. คลิ​ิกเลื​ือกเครื่​่�องมื​ือ ที่​่�ช่​่วยสร้​้างแสงเงา ความสว่​่างให้​้กั​ับรู​ูปภาพให้​้มี​ีความ โดดเด่​่นยิ่​่�งขึ้​้�น หลั​ังจากนั้​้�นกดปุ่​่�ม OK

- 164 -

19. ทำำ�การตกแต่​่งภาพเพิ่​่�มเติ​ิมและจั​ัดองค์​์ประกอบให้​้เหมาะสม กด Ctrl + C และ Ctrl + V เพื่​่�อคั​ัดลอกรู​ูปภาพ

20. ตกแต่​่งบริ​ิเวณพื้​้�นที่​่�ส่​่วนด้​้านล่​่างให้​้โดดเด่​่นยิ่​่�งขึ้​้�น สามารถโหลดไฟล์​์ภาพต่​่างๆ หรื​ือภาพเวกเตอร์​์ จากเว็​็บไซต์​์ freepik.com นำำ�มาตกแต่​่งชิ้​้�นงานให้​้น่​่าสนใจยิ่​่�งขึ้​้�น

- 165 -

21. คลิ​ิกเลื​ือกเครื่​่�องมื​ือสำำ�หรั​ับการพิ​ิมพ์​์อั​ักษร

22. ตกแต่​่งโดยใช้​้เครื่​่�องมื​ือ Ellipse Tool สร้​้างวงกลมเพิ่​่�มเติ​ิมเพื่​่�อที่​่�จะนำำ�รูปู ภาพมา วางในพื้​้�นที่​่�วงกลมที่​่�วาดไว้​้

- 166 -

23. การเอารู​ูปภาพที่​่�เป็​็นรู​ูปทรงกรอบสี่​่�เหลี่​่�ยม นำำ�มาจั​ัดวางให้​้อยู่​่�ในพื้​้�นที่​่�วงกลม ให้​้ นำำ�เลเยอร์​์รู​ูปภาพ วางในตำำ�แหน่​่งด้​้านบนของเลเยอร์​์วงกลมที่​่�ต้​้องการจะใส่​่รู​ูปภาพลงไป

24. คลิ​ิกเลื​ือกคำำ�สั่​่�ง Create Clipping Mask เพื่​่�อใส่​่รู​ูปภาพภายในวงกลมให้​้ครบ

- 167 -

25-. เมื่​่​่�อออกแบบตกแต่​่งภาพเป็​็นที่​่�เรี​ียบร้​้อยแล้​้ว ทำำ�การเตรี​ียม Export งานเพื่​่�อนำำ� ไปใช้​้ต่​่อไป

- 168-

26-27. เมื่​่�อออกแบบเป็​็นที่​่�เรี​ียบร้​้อยแล้​้ว ให้​้ทำำ�การจั​ัดเก็​็บไฟล์​์ภาพ สามารถเลื​ือก นามสกุ​ุลของการจั​ัดเก็​็บไฟล์​์ภาพได้​้ตามต้​้องการ

- 169-

- 170-

การรี​ีทั​ัชภาพขาวดำำ�ให้​้เป็​็นภาพสี​ี

1. คลิ​ิก File เลื​ือก Open 2. เลื​ือกรู​ูปที่​่�ต้​้องการ จากนั้​้�นคลิ​ิก Open

- 171-

3. คลิ​ิก

เลื​ือก Solid Color

4. เลื​ือกสี​ีของโทนผิ​ิว (สร้​้างสามารถปรั​ับเปลี่​่�ยนสี​ีผิ​ิวได้​้ในภายหลั​ัง) จากนั้​้�นกด OK

5. เลื​ือกกรอบข้​้อความดั​ังภาพ จากนั้​้�นให้​้เลื​ือก Color

- 172 -

6. คลิ​ิกที่​่� Layer mask ดั​ังภาพ จากนั้​้�นกด Ctrl + I

7. คลิ​ิก Brush Tool หรื​ือคี​ีย์​์ลั​ัด B 8. จากนั้​้�นให้​้ระบายในส่​่วนของสี​ีผิ​ิวทั้​้�งหมด

- 173 -

9. เพื่​่�อให้​้สี​ีผิ​ิวดู​ูสมจริ​ิงขึ้​้�น Double click ตรงกรอบ เพื่​่�อเรี​ียก Layer Style ขึ้​้�นมา

10. ปรั​ับค่​่า Underlying Layer ปรั​ับค่​่าตามความเหมาะสม โดยการ กด Alt + คลิ​ิก ลากออกจากกั​ัน จากนั้​้�นกด OK

11. คลิ​ิก 12. คลิ​ิก

จากนั้​้�นเลื​ือก Hue / Saturation เพื่​่�อให้​้ Hue / Saturation มี​ีผลแค่​่ Layer ล่​่างเท่​่านั้​้�น

- 174 -

14. คลิ​ิก Layer ที่​่�อยู่​่�ข้​้างบนสุ​ุดจากนั้​้�น คลิ​ิก

15. เลื​ือกสี​ีของปากจากนั้​้�นกด OK

- 175 -

เลื​ือก Solid Color

16. เลื​ือกกรอบข้​้อความดั​ังภาพ จากนั้​้�นให้​้เลื​ือก Color

17.

คลิ​ิกที่​่� Layer mask ดั​ังภาพ จากนั้​้�นกด Ctrl + I

- 176 -

18. คลิ​ิก Brush Tool หรื​ือคี​ีย์​์ลั​ัด B 19. จากนั้​้�นให้​้ระบายในส่​่วนของสี​ีปากทั้​้�งหมด

20. เพิ่​่�มสี​ีปากให้​้ดู​ูจริ​ิงขึ้​้�น Double click ตรงกรอบ เพื่​่�อเรี​ียก Layer Style ขึ้​้�นมา

21. ปรั​ับค่​่า Underlying Layer ปรั​ับค่​่าตามความเหมาะสม โดยการ กด Alt + คลิ​ิก ลากออกจากกั​ัน จากนั้​้�นกด OK

- 177 -

22. คลิ​ิก Layer ที่​่�อยู่​่�ข้​้างบนสุ​ุดจากนั้​้�น คลิ​ิก

23. เลื​ือกสี​ีของตาจากนั้​้�นกด OK

- 178 -

เลื​ือก Solid Color

24. เลื​ือกกรอบข้​้อความดั​ังภาพ จากนั้​้�นให้​้เลื​ือก Color

25. คลิ​ิกที่​่� Layer mask ดั​ังภาพ จากนั้​้�นกด Ctrl + I

- 179 -

26. คลิ​ิก Brush Tool หรื​ือคี​ีย์​์ลั​ัด B 27. จากนั้​้�นให้​้ระบายในส่​่วนของสี​ีตาทั้​้�งหมด

ก่​่อนทำำ�รี​ีทั​ัชภาพ

หลั​ังทำำ�รี​ีทั​ัชภาพ

- 180 -

การออกแบบการ์​์ดขอบคุ​ุณ

ปั​ัจจุ​ุบั​ันการจำำ�หน่​่ายสิ​ินค้​้าหรื​ือบริ​ิการด้​้านต่​่างๆ เมื่​่�อบริ​ิษั​ัททำำ�การส่​่งมอบสิ​ินค้​้าและ บริ​ิการไปยั​ังลู​ูกค้​้า มั​ักจะจั​ัดทำำ�การ์​์ดขอบคุ​ุณไปพร้​้อมกั​ับสิ​ินค้​้าและบริ​ิการนั้​้�นๆ

1. คลิ​ิก File เลื​ือก New จากนั้​้�นเลื​ือกขนาดของการ์​์ดตามที่​่�ต้​้องการ กดเลื​ือก Create

- 181 -

2. คลิ​ิกเครื่​่�องมื​ือ Rectangle Tool หรื​ือคี​ีย์​์ลั​ัด M เพื่​่�อสร้​้างพื้​้�นหลั​ัง 3. เลื​ือกสี​ีพื้​้�นหลั​ังตามที่​่�ต้​้องการ 4. จากนั้​้�นสร้​้างพื้​้�นภาพดั​ังภาพ

เครื่​่�องหมายที่​่�สื่​่�อความหมาย

5. สร้​้าง Layer ขึ้​้�นมาหนึ่​่�ง Layer 6. เลื​ือกเครื่​่�องมื​ือ Type Tool หรื​ือคี​ีย์​์ลั​ัด T 7. พิ​ิมพ์​์ข้​้อความตามที่​่�ต้​้องการ และ เลื​ือกสี​ี ขนาด ตามความเหมาะสม

- 182 -

8. สร้​้าง Layer ขึ้​้�นมาหนึ่​่�ง Layer 9. เลื​ือกเครื่​่�องมื​ือ Blob Brush Tool หรื​ือคี​ีย์​์ลั​ัด Shift + B 10. วาดลวดลายตามความต้​้องการ

11. สร้​้าง Layer ขึ้​้�นมาหนึ่​่�ง Layer 12. เลื​ือกเครื่​่�องมื​ือ Blob Brush Tool หรื​ือคี​ีย์​์ลั​ัด Shift + B 13. วาดลวดลายตามความต้​้องการ

- 183 -

14. เลื​ือก File จากนั้​้�นเลื​ือก Open 15. เลื​ือกไฟล์​์ Logo จากนั้​้�นเลื​ือก Open

16. จากนั้​้�นเลื​ือกจั​ัดวางตามที่​่�ต้​้องการ

- 184 -

17. คลิ​ิก File เลื​ือก New ออกแบบการ์​์ดด้​้านหลั​ัง เลื​ือกขนาดของการ์​์ดให้​้เท่​่าขนาด เดิ​ิม จากนั้​้�นเลื​ือก Create

18. คลิ​ิกเครื่​่�องมื​ือ Rectangle Tool หรื​ือคี​ีย์​์ลั​ัด M เพื่​่�อสร้​้างพื้​้�นหลั​ัง 19. เลื​ือกสี​ีพื้​้�นหลั​ังตามที่​่�ต้​้องการ 20. จากนั้​้�นสร้​้างพื้​้�นภาพดั​ังภาพ

- 185 -

21. สร้​้าง Layer ขึ้​้�นมาหนึ่​่�ง Layer 22. เลื​ือกเครื่​่�องมื​ือ Type Tool หรื​ือคี​ีย์​์ลั​ัด T 23. พิ​ิมพ์​์ข้​้อความตามที่​่�ต้​้องการ และ เลื​ือกสี​ี ขนาด ตามความเหมาะสม

24. เลื​ือก File จากนั้​้�นเลื​ือก Open 25. เลื​ือกไฟล์​์ Icon จากนั้​้�นเลื​ือก Open

- 186 -

26. จั​ัดวางตามที่​่�ต้​้องการ

27. สร้​้าง Layer ขึ้​้�นมาหนึ่​่�ง Layer 28. เลื​ือกเครื่​่�องมื​ือ Blob Brush Tool หรื​ือคี​ีย์​์ลั​ัด Shift + B 29. วาดลวดลายตามความต้​้องการ

- 187 -

30. สร้​้าง Layer ขึ้​้�นมาหนึ่​่�ง Layer 31. เลื​ือกเครื่​่�องมื​ือ Blob Brush Tool หรื​ือคี​ีย์​์ลั​ัด Shift + B 32. วาดลวดลายและตกแต่​่งตามความต้​้องการ

- 188 -

- 189-

การออกแบบ Label

ตั้​้�งค่​่างานที่​่�จะออกแบบ โดยเปลี่​่�ยนหน่​่วยเป็​็นเซ็​็นติ​ิเมตร ตั้​้�งขนาด 3 x 3 ซม. ปรั​ับ ความชั​ัดตามความชอบ และเลื​ือก Create

- 190 -

วาดวงกลมให้​้เท่​่ากั​ับพื้​้�นที่​่�การทำำ�งาน จำำ�เป็​็นต้​้องรู้​้�พื้​้�นที่​่�การทำำ�งานก่​่อน วิ​ิธี​ีการคื​ือ คลิ​ิกเมนู​ู Image เลื​ือก Canvas Size จำำ�ขนาดความกว้​้าง สู​ูง จะบอกหน่​่วยเป็​็น Pixels

เริ่​่�มสร้​้างวงกลม คลิ​ิกเลื​ือก Ellipse Tool คลิ​ิกพื้​้�นที่​่�งาน 1 ครั้​้�ง ปรากฏหน้​้าต่​่าง Create Ellipse ขึ้​้�นมา ให้​้กรอกค่​่าตั​ัวเลขที่​่�เป็​็นหน่​่วย Pixels กด OK

- 191 -

เมื่​่�อได้​้วงกลม จะต้​้องปรั​ับวงกลมให้​้อยู่​่�ตรงกลางพื้​้�นที่​่�ที่​่�ทำำ�งาน โดย

1. เลื​ือก Move Tool กด Ctrl + A

2. กดเมนู​ูด้​้านบน

ทำำ�การ Duplicate Layer วงกลม

1. โดยคลิ​ิกขวาที่​่� Layer วงกลม

2. เลื​ือก Duplicate Layer - 192 -

ปราฏหน้​้าต่​่าง Dupticate Layer สามารถตั้​้�งชื่​่�อ Layer ใหม่​่ได้​้ กด OK

1. การปรั​ับขนาดวงกลมเล็​็กลงเพิ่​่�มอี​ีก 1 วงกลมให้​้ได้​้สั​ัดส่​่วน โดย Ctrl+T 2. กด ALT ค้​้าง +ลากเมาส์​์ ย่​่อ/ขยายวงกลมให้​้เล็​็กกว่​่าวงกลมแรกตามที่​่�ต้​้องการ

- 193 -

การเลื​ือกสี​ีให้​้กั​ับพื้​้�นผิ​ิววงกลมและเส้​้นขอบของวงกลม โดยกด Layer วงกลมที่​่� ต้​้องการจะเปลี่​่�ยนสี​ี เลื​ือกเมนู​ูด้​้านบน Fill กั​ับ Stroke

พิ​ิมพ์​์ตั​ัวอั​ักษรข้​้างในเส้​้นขอบวงกลม โดยสร้​้างวงกลมเพิ่​่�มอี​ีก 1 วงกลมสำำ�หรั​ับ เตรี​ียมพิ​ิมพ์​์อั​ักษร และย่​่อขนาดเล็​็กกว่​่าวงกลม 2 วงกลมแรก โดยการกด Alt ค้​้างและลากเม้​้าส์​์ เมื่​่�อได้​้ขนาดที่​่�ต้​้องการแล้​้ว กด Enter

- 194 -

1. กด Ctrl + A 2. กด Ctrl + Alt + คลิ​ิกที่​่�รู​ูป Layer วงกลมล่​่าสุ​ุด 3. เลื​ือกเครื่​่อ� งมื​ือ Marquee Tool คลิ​ิกขวาในพื้​้�นที่​่�วงกลมที่​่�จะพิ​ิมพ์​์ตั​ัวอั​ักษร เลื​ือก

1. กด Ctrl+D เพื่​่�อยกเลิ​ิกเส้​้นประ ปิ​ิดมุ​ุมมอง Layer วงกลม 2. เลื​ือก Horizontal Type Tool พิ​ิมพ์​์ตั​ัวอั​ักษร 3. คลิ​ิกเมาส์​์ที่​่�เส้​้นขอบวงกลม พิ​ิมพ์​์ตั​ัวอั​ักษร

- 195 -

กด Ctrl + T ทำำ�การหมุ​ุนตั​ัวอั​ักษรตามที่​่�ต้​้องการ

1. สร้​้างวงกลมเพิ่​่�มอี​ีก 1 วงกลม แล้​้วกด Ctrl + T 2. กด Alt ค้​้างไว้​้ + ลากย่​่อ/ขยายวงกลม

- 196 -

ทำำ�การพิ​ิมพ์​์ตั​ัวอั​ักษร อยู่​่�กึ่​่�งกลาง

1. ปิ​ิดมุ​ุมมอง Layer ที่​่�ทำำ�งานล่​่าสุ​ุด เพื่​่�อไม่​่ให้​้งานทั​ับกั​ัน

2. เลื​ือก Horizontal Type Tool พิ​ิมพ์​์ตั​ัวอั​ักษร

3. วางเมาส์​์ตรงจุ​ุดที่​่�ต้​้องการพิ​ิมพ์​์อั​ักษร คลิ​ิกเมาส์​์ และพิ​ิมพ์​์อั​ักษรที่​่� ต้​้องการ

4. เลื​ือกรู​ูปแบบอั​ักษร

5. เลื​ือกปรั​ับขนาดตั​ัวอั​ักษร

- 197 -

เปิ​ิดมุ​ุมมอง Layer ตั​ัวอั​ักษรรอบวงกลม จะปรากฏภาพข้​้างต้​้น

คลิ​ิกเครื่​่�องมื​ือ Rectangle Tool ทำำ�การวาดสี่​่�เหลี่​่�ยม และให้​้แน่​่ใจว่​่า Layer ล่​่าง Layer GOOD CAFE ภาพก็​็จะทั​ับตั​ัวอั​ักษร

- 198 -

การย่​่อรู​ูปวงกลมเพื่​่�อทำำ�หางริ​ิบบิ้​้�น ให้​้กดเมาส์​์ครอบรู​ูปภาพทั้​้�งหมด กด Ctrl + T กด Alt กดเมาส์​์ย่​่อรู​ูป

จะพบว่​่า เส้​้นขอบวงกลมทั​ับตั​ัวริ​ิบบิ้​้�น ให้​้ทำำ�การลาก Layer GOOD CAFE กั​ับ Layer ริ​ิบบิ้​้�นพร้​้อมกั​ัน โดยกด Ctrl คลิ​ิก Layer ที่​่�ต้​้องการ ทำำ�การลากและวางเหนื​ือ Layer วงกลม

- 199 -

การทำำ�หางริ​ิบบิ้​้�น

1. คลิ​ิก Layer ริ​ิบบิ้​้�นอั​ันล่​่าสุ​ุด คลิ​ิกขวา Layer Duplicate Layer กด OK

2. เลื​ือกเครื่​่�องมื​ือ Move Tool ลาก Layer Duplicat ลงมาวางต่ำำ�� กว่​่า

Layer ริ​ิบบิ้​้�น

3. Ctrl+T

4. กด Shift ค้​้างไว้​้+ลากขยายความยาวทั้​้�งสองด้​้าน

- 200 -

ทำำ�การเปลี่​่�ยนสี​ีหางริ​ิบบิ้​้�น โดย

1. เลื​ือกเครื่​่�องมื​ือ Rectangle Tool ทำำ�การเลื​ือกเมนู​ูด้​้านบนคลิ​ิกเปลี่​่�ยนสี​ี

2. ลาก Layer หางริ​ิบบิ้​้�นให้​้อยู่​่�ท้​้ายวงกลมสี​ีเขี​ียว

1. เลื​ือกเครื่​่�องมื​ือ Polygonal Tool วาดตามเส้​้นในรู​ูปภาพ

2. เลื​ือกเครื่​่อ� งมื​ือ Eyedropper คลิ​ิกเมาส์​์ซ้​้ายตรงพื้​้�นที่​่�ที่​่�จะดู​ูดสี​ี

3. เทสี​ีโดยใช้​้เครื่​่�องมื​ือ Paint Bucket Tool โดยคลิ​ิกซ้​้ายตรงบริ​ิเวณพื้​้�นที่​่�ที่​่�ได้​้วาดไว้​้ ในครั้​้�งแรก

- 201 -

วาดรู​ูปสี่​่�เหลี่​่�ยม เลื​ือกเครื่​่�องมื​ือ Rectangle Tool โดยกด Shift ค้​้างลากเมาส์​์วาด สี่​่�เหลี่​่�ยม กด Ctrl+T กด Shift ทำำ�การหมุ​ุนรู​ูปสี่​่�เหลี่​่�ยม และทำำ�ทั้​้�งสองด้​้าน

- 202 -

ปรากฎดั​ังภาพ หลั​ังจากนั้​้�นจะตั​ัดให้​้เป็​็นรอยหยั​ักของริ​ิบบิ้​้�นโดย

1. เลื​ือก Quice Selection Tool ระบายตรงส่​่วนที่​่�ต้​้องการจะตั​ัดให้​้เป็​็นรอยหยั​ัก

2. จากนั้​้�นกด Ctrl เลื​ือก Layer หางริ​ิบบิ้​้�น กดปุ่​่�ม Delete เพื่​่�อตั​ัดส่​่วนที่​่�เลื​ือกไว้​้

ตกแต่​่งรู​ูปภาพ ค้​้นหาภาพจากอิ​ินเทอร์​์เน็​็ตหรื​ือใช้​้วิ​ิธี​ีวาดก็​็ได้​้ นำำ�มาวางในตำำ�แหน่​่งที่​่� ต้​้องการ

- 203 -

ทำำ�การ Duplicate Layer วงกลมเพิ่​่�มอี​ีก 1 วงกลม จากนั้​้�นปรั​ับขนาด โดยกด Ctrl+T ปรากฏเส้​้นขอบ กด Alt ค้​้างทำำ�การย่​่อ/ขยายวงกลม ให้​้ได้​้ตามภาพ เปลี่​่�ยนสี​ีพื้​้�นที่​่�วงกลมกั​ับ เส้​้นขอบ โดยเลื​ือกเมนู​ูข้​้างบนในภาพ

ทำำ�การ Duplicate Layer วงกลมเพิ่​่�มอี​ีก 1 วงกลม จากนั้​้�นปรั​ับขนาด โดยกด Ctrl+T ปรากฏเส้​้นขอบ กด Alt ค้​้างทำำ�การย่​่อ/ขยายวงกลม ให้​้ได้​้ตามภาพ เพื่​่�อพิ​ิมพ์​์ตั​ัวอั​ักษร

- 204 -

ตามเส้​้นกรอบด้​้านนอกของวงกลม เลื​ือก Horizental Type Tool วางบนเส้​้นกรอบ คลิ​ิกซ้​้าย พิ​ิมพ์​์ข้​้อความ

พิ​ิมพ์​์ข้​้อความ “กู๊​ู�ดคาเฟ่​่ ที่​่�นี่​่� มอบแต่​่สิ่​่�งดี​ีๆ” ลั​ักษณะอั​ักษรที่​่�ปรากฏ อาจวางไม่​่ตรง ตำำ�แหน่​่งที่​่�ต้​้องการ ให้​้ใช้​้วิ​ิธี​ีกด Ctrl + T ทำำ�การเคลื่​่�อนตำำ�แหน่​่งตั​ัวอั​ักษรให้​้ตรงตามที่​่�ต้​้องการ จึ​ึงกด Enter ทำำ�การปิ​ิดมุ​ุมมอง Layer วงกลมที่​่�เป็​็นแม่​่แบบในการพิ​ิมพ์​์ตั​ัวอั​ักษร สามารถใช้​้ Paint bucket Tool ทำำ�การตกแต่​่งชิ้​้�นงานให้​้มี​ีความสมบู​ูรณ์​์ยิ่​่�งขึ้​้�น จะได้​้ Label ที่​่�เสร็​็จสิ้​้�น แล้​้ว ดั​ังรู​ูปภาพ

- 205 -

วิ​ิธี​ีการทำำ� GIF แอนิ​ิเมชั​ัน ด้​้วยโปรแกรม Photoshop

เมนู​ู File คลิ​ิกเลื​ือก Scripts 1. คลิ​ิกเลื​ือก Load Files into Stack

- 206 -

2. เลื​ือก File ภาพจั​ัดเตรี​ียมจะทำำ� Gif แอนิ​ิเมชั​ัน โดยกด Browse

3. เลื​ือกภาพที่​่�ต้​้องการ และกด OK

- 207 -

4. ปรากฏชื่​่�อไฟล์​์ภาพทั้​้�งหมด และกด OK

5. เปิ​ิดหน้​้าต่​่าง Timeline โดยคลิ​ิกที่​่�เมนู​ู Window และกดที่​่� Timeline

- 208 -

6. กดปุ่​่�ม

บนหน้​้าต่​่าง Timeline และเลื​ือก Create Frame Animation

7. กดปุ่​่�ม

เลื​ือก Make Frames From Layers

- 209 -

8. ปรากฏภาพทั้​้�งหมดบนหน้​้าต่​่าง Timeline สามารถกดปุ่​่�มเล่​่น หรื​ือหยุ​ุดภาพ เคลื่​่�อนไหวได้​้

9. ภาพที่​่� Import มาจาก Layer เวลากดเล่​่นภาพจะเล่​่นในลั​ักษณะย้​้อนกลั​ับ เพราะ จะการทำำ�ลั​ักษณะนี้​้� จะ Import โดยเรี​ียง Layer ใหม่​่ ไปหา Layer เก่​่า (บนลงล่​่าง) หาก ต้​้องการให้​้ภาพเล่​่นแบบไม่​่ต้​้องย้​้อนกลั​ับ ให้​้คลิ​ิกปุ่​่�ม เลื​ือก Reverse Frames

- 210 -

10. ทำำ�การ Export File หรื​ือกดคี​ีย์​์ลั​ัด Alt+Shift+Ctrl+S

11. ทำำ�การตั้​้�งรู​ูปแบบไฟล์​์ที่​่�จะ Save ให้​้เป็​็น File Gif ตั้​้�งค่​่า Colors เป็​็น 256 และตั้​้�ง ค่​่า Looping Options เป็​็น Forever กด OK

- 211 -

12. เลื​ือกที่​่�อยู่​่�ในการจั​ัดเก็​็บไฟล์​์ข้​้อมู​ูล เป็​็นอั​ันเสร็​็จเรี​ียบร้​้อย จากนั้​้�นเราสามารถนำำ� ไฟล์​์ Gif ไปประยุ​ุกต์​์ใช้​้ในงานต่​่าง ๆ ได้​้ เช่​่นเว็​็บไซต์​์ งานนำำ�เสนออื่​่�น ๆ เป็​็นต้​้น

- 212 -

เอกสารอ้​้างอิ​ิง เกรี​ียงศั​ักดิ์​์� เจริ​ิญวงศ์​์ศั​ักดิ์​์�. (2545). การคิ​ิดสร้​้างสรรค์​์. กรุ​ุงเทพฯ: ซั​ัคเซสมี​ีเดี​ีย. นวลน้​้อย บุ​ุญวงษ์​์. หลั​ักการออกแบบ. กรุ​ุงเทพฯ : สำำ�นั​ักพิ​ิมพ์​์จุ​ุฬาลงกรณ์​์มหาวิ​ิทยาลั​ัย, 2539. ปาพจน์​์ หนุ​ุนภั​ักดี​ี. 2555. Graphic Design Principlas 2nd edition. นนทบุ​ุรี​ี : ไอดี​ีซี​ีฯ. ปิ​ิยะบุ​ุตร สุ​ุทธิ​ิดารา. 2560. Graphic Design The New Basic. นนทบุ​ุรี​ี : ไอดี​ีซี​ีฯ. รุ​ุจิ​ิรั​ัตน์​์ บั​ัวลา. (2546). การพั​ัฒนาโปรแกรมฝึ​ึกอบรมครู​ู เรื่​่�อง การประยุ​ุกต์​์ใช้​้ผลงานวิ​ิจั​ัย

ทางสมองในการจั​ัดการเรี​ียนการสอน. กรุ​ุงเทพฯ: สำำ�นั​ักพิ​ิมพ์​์แห่​่งจุ​ุฬาลงกรณ์​์

มหาวิ​ิทยาลั​ัย. ศศิ​ิตรา. (2556). เรี​ียนให้​้เก่​่งขึ้​้�นได้​้ด้​้วยการพั​ัฒนาสมองซี​ีกขวา.

ได้​้จาก http://www.oknation.net ค้​้นเมื่​่�อวั​ันที่​่� 30 ธั​ันวาคม 2563. ศุ​ุภรา อรุ​ุณศรี​ีมรกต.(2561). วารสาร Veridian-E-Journal ฉบั​ับภาษาไทย

สาขามนุ​ุษยศาสตร์​์ สั​ังคมศาสตร์​์และศิ​ิลปะ ( มกราคม - เมษายน 2561 ) เสาวนี​ีย์​์ พิ​ิสิ​ิฐานุ​ุสรณ์​์. (2553). สหรั​ัฐฯ เผชิ​ิญวิ​ิกฤติ​ิความคิ​ิดสร้​้างสรรค์​์.

ได้​้จาก : http://info.gotomanager.com ค้​้นเมื่​่�อวั​ันที่​่� 15 ธั​ันวาคม 2563. อนั​ัน วาโชะ. 2558. Graphic Design for Printing & Publishing. นนทบุ​ุรี​ี : ไอดี​ีซี​ีฯ. อโณทั​ัย เชี่​่�ยวชาญ.(2554) แผ่​่นพั​ับคื​ือ. ได้​้จาก : http://anothai573.blogspot.

com/2011/06/blogpost_20.html ค้​้นเมื่​่�อวั​ันที่​่� 25 ธั​ันวาคม 2563. อารยะ ศรี​ีกั​ัลยาณบุ​ุตร. 2541. การออกแบบตราสั​ัญลั​ักษณ์​์. กรุ​ุงเทพฯ : จุ​ุฬาลงกรณ์​์

มหาวิ​ิทยาลั​ัย, หน้​้า 23.

Elkhonon, G., Kenneth, P. & Mark L. (1994). Lateralization of frontal lobe

functions and cognitive novelty. Journal Of Neuropsychiatry,6(4),

371-378.

Kotler, Philip and Armstrong, Gary. (2014). Principles of Marketing : Global Edition.15th ed.,Harlow, England : Pearson Education Limited.

Piotr Skoczylas. (2016). วิ​ิธีกี ารทำำ�ภาพบุ​ุคคลแบบ Multiple Exposure แบบเก๋​๋ไก๋​๋.

สื​ืบค้​้นเมื่​่�อ กั​ันยายน 19, 2561 : https://fotofaka.com/multiple-exposure-

- 213 -

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

ดัชนีคำ� 47 1 1 1 49 48 2, 3 2, 3 3 3 3 2 3 77 77 82 25 126 3 2 128 5 91 94 95 73

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

- 214 -

72 97 2 53 12 12 26 12 23 40 6 7 7 27 103 51 67 67 67 54 48 48

จ จิ​ิตวิ​ิทยา จิ​ิตวิ​ิทยาการรั​ับรู้​้�ทางตา จิ​ินตนาการ ต ตรวจทาน

ตราประทั​ับโลหะ เตรี​ียมไฟล์​์เพื่​่�อจั​ัดพิ​ิมพ์​์

น นั​ักการตลาด นั​ักจิ​ิตวิ​ิทยา นั​ักออกแบบ นั​ักออกแบบกราฟิ​ิก นำ้​้��หนั​ักของสี​ี นิ​ิตยสาร เนื้​้�อหา แนวความคิ​ิด

บ บริ​ิบท บิ​ิตแมพ แบรนด์​์ ใบปลิ​ิว ป ประชาสั​ัมพั​ันธ์​์ ประเภทของนิ​ิตยสาร ประสบการณ์​์ ปั​ังปอนต์​์แอนิ​ิเมชั​ัน

ดัชนีค ำ� 1 9 2 95 122 76 52 3 10, 26 9 27 66 76 4, 5, 6 4, 6 25 34 88 77 66 5 111

ป ปริ​ิมาตร ป้​้าย เป้​้าหมายทางการตลาด โปสเตอร์​์ เป้​้าหมายทางการเมื​ือง

ผ เผยแพร่​่ข่​่าวสาร แผ่​่นพั​ับ

พ พาดหั​ัว พื้​้�นผิ​ิว พื้​้�นผิ​ิวกลมกลื​ืนและขั​ัดแย้​้ง พื้​้�นผิ​ิวรู​ูปธรรม

ภ ภาพกราฟิ​ิก ภาพการ์​์ตู​ูน ภาพติ​ิดตา ภาพถ่​่าย ภาพลั​ักษณ์​์องค์​์กร

ม มั​ัลติ​ิมี​ีเดี​ีย เมนู​ูสคริ​ิปต์​์

ร ร่​่องรอย ระนาบ ระบบปฏิ​ิบัติั ิการ

- 215 -

22 69 4 74 4 4 68 75 23 24 24 92 92 13 86 52 46 70 12 15 89

ร ระยะทาง รายเดื​ือน รายปั​ักษ์​์ รายสั​ัปดาห์​์ ราสเตอร์​์ รู​ูปทรง รู​ูปแบบการนำำ�เสนอข้​้อมู​ูลผ่​่านสื่​่�อ รู​ูปภาพ รู​ูปร่​่าง ล ลวงตา ลั​ักษณะของสื่​่�อโฆษณา เลเยอร์​์ เล่​่าเรื่​่�องในงานกราฟิ​ิก

ว วงจรสี​ีธรรมชาติ​ิ วิ​ิธี​ีการออกแบบ วิ​ิธี​ีการออกแบบเบื้​้�องต้​้น เวกเตอร์​์

ศ ศั​ักยภาพในการแข่​่งขั​ัน

ส สตอรี่​่�บอร์​์ด สมมาตร สมองซี​ีกขวา สมองซี​ีกซ้​้าย

ดัชนีค ำ� 13 66 66 66 56 22 99 75 22 14 65 79 15 28 3 7 87 9 46 11 2 2

ส สี​ีของกระดาษ สื่​่�อถึ​ึงบุ​ุคคล สื่​่�อนอกบ้​้าน สื่​่�อประชาสั​ัมพั​ันธ์​์ สื่​่�อแฝงบรรยากาศ เส้​้น ส้​้นคลื่​่�น เส้​้นโค้​้งก้​้นหอย เส้​้นโค้​้งกลม เส้​้นโค้​้งแคบ เส้​้นเฉี​ียง เส้​้นตรง เส้​้นตั้​้�ง เส้​้นนอน เส้​้นฟั​ันปลา

ห หนั​ังสื​ือ หนั​ังสื​ือพิ​ิมพ์​์ หลั​ักการใช้​้สี​ีในการออกแบบ เหตุ​ุผล อ องค์​์ประกอบของอั​ัตลั​ักษณ์​์ ออกแบบกราฟิ​ิก ออฟเซต

อั​ัตลั​ักษณ์​์องค์​์กร อายุ​ุการรั​ับรู้​้�

- 216 -

106 67 69 65 69 19 19 19 19 19 19 19 19 19 19 15 65 29 2 51 14 108 52 14

INDEX

A D Abstract Shape Composition 20 Deviant Art Ambient 69 Direct Mail Animation 46 Display Advertising Animation Graphic 47 Donald O.Hebb Art Director 39 Duotone Art board 62, 64 E Art Editor 39 e-book

B Edgar John Rubin Bitmap 86 Edward de Bono, Dr Blending mode 96 Effect BMP 90 EMBED Bob Gill 35 Export Browser 88 F

C Figure and Ground Circle in Inkscape 17 flickr.com Cinderella 32 Fraser’s Spiral Classified Advertising 65 Flyer CMYK 27 FTP Comprehensive Layout 42 Fullscreen Concept 1, 103 G Corporate Identity 52 GIF Compression 102 Graphic Design Contour 10 Graphic Inerchange Format contrast 95 Guide Create New Layer 81 H Crop Tool 78 Handbill

- 217 -

20 67 65 10 103 116 11 3 59 116 58 10 112 14 67 102 116 88 17 88 54, 64 67

H

INDEX

High Pass filter 97

I Illustrator 61 InDesign 63 Intensity 26 Installation Art 43 issuu.com 114

J Join Photographic Export Group 88 JPG 88

L Layer 60, 91 Leaflet

67 Long Narrative 15 Logo 50 Logo Type 50 Low-Tech Portfolios 111

M Magazine 66 Massimo Vignelli 35 Max Luscher 33 Maya 93 Menu bar 60, 62, 64 Milton Glaser 33 PMIT Media Laboratoryaul 34 Moira Cullen 35

M Monochrome 29 Multiple Exposure 94

N Nemo 93 Nucco Brain 15

O Option Bar 60, 62, 64 Out of home 69

P Panel 60, 62, 64 Patern 79 Patern overlay 79 Paul Rand 22 PDF 101 PDF/X 101 PDF/A 101 Periodical Publication 66 Perspective 22 Photoshop 59 Photoshop Decument 91 Publish Now 116 Pixel 86 PNG 89 Portable Document format 101 Portable Network Graphics 89 Poftfolio 110

- 218 -

P Poster Principle of visual arts PSD

R Raster Rectangle Tool Retouch RGB Rough Layout

S saturate Scale Scissor Tool Scratch area Screen search engine Shot Narrative Sir Isaac newton Site Map Smart Guides soft light Soft Proof Stop Motion Graphic Storyboard Symbol

INDEX 69 10 91 86 56 59 27 41 94 79 55 62 94 44 15 1 44 54 97 101 47 46 50

T Tagged Imaged File 90 Texture 77 The Bug 93 The Color of Death 29 Thumbnail Sketches Layout 41 Tibor Kalman 34 TIFF 90 To Inform 36 To Persuade 36 Toolbox 60, 62, 64 Transparent 88 Tritone 103 True color 89 Type Tool 81

U Unix 89 Unstaff 102 Unzip 102

V Vector Vector Graphic W Web Hosting Website Window

- 219 -

82 61 111 44 89

ประวั​ัติ​ิผู้​้�เขี​ียน ประวั​ัติ​ิส่​่วนตั​ัว

ชื่​่�อ นางนุ​ุจรี​ี นามสกุ​ุล บุ​ุรี​ีรั​ัตน์​์

เกิ​ิดวั​ันที่​่� 21 เดื​ือน ธั​ันวาคม พ.ศ. 2520 ที่​่�ทำำ�งานปั​ัจจุ​ุบั​ัน เลขที่​่� 399 ถ.สามเสน

แขวงวชิ​ิรพยาบาล

เขตดุ​ุสิติ กทม. 10300 อี​ีเมล nuchjaree.b@rmutp.ac.th

หน่​่วยงานที่​่�สั​ังกั​ัด สาขาวิ​ิชาเทคโนโลยี​ีมั​ัลติ​ิมี​ีเดี​ีย

คณะเทคโนโลยี​ีสื่​่�อสารมวลชน

มหาวิ​ิทยาลั​ัยเทคโนโลยี​ีราชมงคลพระนคร

ประวั​ัติ​ิการศึ​ึกษา

ปริ​ิญญาเอก ปร.ด. (เทคโนโลยี​ีเทคนิ​ิคศึ​ึกษา)

มหาวิ​ิทยาลั​ัยเทคโนโลยี​ีพระจอมเกล้​้าพระนครเหนื​ือ 2561 ปริ​ิญญาโท วท.ม. (เทคโนโลยี​ีสารสนเทศ) มหาวิ​ิทยาลั​ัยสยาม 2549 ปริ​ิญญาตรี​ี วท.บ. (วิ​ิทยาการคอมพิ​ิวเตอร์​์) สถาบั​ันราชภั​ัฏพระนครศรี​ีอยุ​ุธยา

(ปั​ัจจุ​ุบั​ันเปลี่​่�ยนเป็​็นมหาวิ​ิทยาลั​ัยราชภั​ัฏพระนครศรี​ีอยุ​ุธยา) 2543

ประวั​ัติ​ิการทำำ�งาน

- ปี​ี 2545-2550 อาจารย์​์ประจำำ�สาขาวิ​ิชาระบบสารสนเทศ คณะบริ​ิหารธุ​ุรกิ​ิจ

มหาวิ​ิทยาลั​ัยเทคโนโลยี​ีราชมงคลพระนคร (พณิ​ิชยการพระนคร)

- ปี​ี 2551 อาจารย์​์ประจำำ�สาขาวิ​ิชาเทคโนโลยี​ีมั​ัลติ​ิมี​ีเดี​ีย คณะเทคโนโลยี​ีสื่​่�อสารมวลชน มหาวิ​ิทยาลั​ัยเทคโนโลยี​ีราชมงคลพระนคร - ปี​ี 2551 - 2555 หั​ัวหน้​้างานฝ่​่ายประชาสั​ัมพั​ันธ์​์ คณะเทคโนโลยี​ีสื่​่�อสารมวลชน มหาวิ​ิทยาลั​ัยเทคโนโลยี​ีราชมงคลพระนคร - ปี​ี 2555 - 2561 หั​ัวหน้​้าสาขาวิ​ิชาเทคโนโลยี​ีมั​ัลติมีิ ีเดี​ีย คณะเทคโนโลยี​ีสื่​่�อสารมวลชน มหาวิ​ิทยาลั​ัยเทคโนโลยี​ีราชมงคลพระนคร - ปี​ี 2561 - ปั​ัจจุ​ุบั​ัน ดำำ�รงตำำ�แหน่​่งรองคณบดี​ีฝ่​่ายกิ​ิจการนั​ักศึ​ึกษา คณะเทคโนโลยี​ีสื่​่�อสารมวลชน มหาวิ​ิทยาลั​ัยเทคโนโลยี​ีราชมงคลพระนคร

- 220 -