ตัวอย่างการวางแผนการสอนวิชา Graphic Design

อ้างอิงบทความนี้: พราว อรุณรังสีเวช. (2563). ตัวอย่างการวางแผนการสอนวิชา Graphic Design. เอกสารประกอบการสอนวิชา Graphic Design. สืบค้นจาก https://sw-eden.net/2020/03/28/graphic-design-teaching-plan/
Cite this Article: Arunrangsiwed, P. (2020). Graphic design teaching plan. Teacher Publication for Graphic Design Class. Retrieved from https://sw-eden.net/2020/03/28/graphic-design-teaching-plan/

นี่คืองานของ ผศ.ดร.พราว อรุณรังสีเวช สมัยก่อน ตอนที่เข้ามาทำงานเป็นอาจารย์ปีแรก เขาได้มอบหมายให้สอนวิชาประเภท Graphic Design ของหลายสาขาวิชา และก็เคยได้สอนสาขาประชาสัมพันธ์ ซึ่งนักศึกษาน่ารักมาก ตอนนี้ ผศ.ดร.พราว อรุณรังสีเวช ถูกสั่งให้ทำงานที่บ้าน เหมือนกับอาจารย์คนอื่น ๆ ในช่วงมีนาคมและเมษายน 2563 เนื่องจากเรื่องโรคระบาด COVID-19 ที่สถาบันการศึกษาจะปิดทำการชั่วคราว ข้าพเจ้า เลยเอาไฟล์มากมายจากมหาวิทยาลัยมาใส่ในเครื่องคอมพิวเตอร์ส่วนตัวที่บ้าน และก็ไปเจอไฟล์นี้ ที่ทำไว้เมื่อประมาณ 7-8 ปีที่แล้ว ตอนที่จะวางแผนการสอนวิชา Graphic Design เลยเอามาโพสแปะไว้ที่นี่ ขอให้คนที่อ่านอย่า Copy นะ แต่ให้นำไปปรับเป็นแนวทางของตัวเอง ข้าพเจ้าไม่ใช่คนที่เก่งที่สุด เลยอยากให้คนที่จะปรับใช้ลองปรับเนื้อหาให้ทันสมัยและดีขึ้นกว่าที่เห็น เพราะนี่ก็ 7-8 ปีแล้ว

PCC2402 3(2-2-5)
การสร้างสรรค์งานกราฟิก Graphic Design
แนวคิด หลักการ กระบวนการ และการฝึกสร้างสรรค์งานกราฟิก งานดิจิทัลมีเดีย และงานมัลติมีเดีย โดยใช้ซอฟท์แวร์ที่เกี่ยวข้อง เพื่อนำไปใช้ในงานประชาสัมพันธ์และงานสื่อสารองค์กรอย่างสร้างสรรค์

คาบที่ 1

o อภิปรายแผนการเรียนการสอน
o ความหมายของ Graphic Design
o ทำไงให้คนอ่าน ทำไงให้คนดู ทำไงให้คนโทรหา ทำไงให้คนคลิก ทำไงให้คนกลับมาดูใหม่ ทำไงให้คนเอาไปเผยแพร่ต่อ
o แนะนำเครื่องมือและอุปกรณ์ที่เกี่ยวข้อง
o ตัวอย่าง Graphic Design ในชีวิตประจำวัน
o ภาพสัญลักษณ์ประเภทต่าง ๆ
o ประวัติโดยสังเขปของงาน Graphic Design ตัวอักษร อียิปต์ จีน การบันทึก
o ประวัติโดยสังเขปของงาน Graphic Design สมัยใหม่ ตาม Wiki
**งานที่ดีไม่จำเป็นต้อง trace ทับ หรือมี Swirly Curly Ornate Floral Vector มีเยอะ แล้วไม่ตรงประเด็น คนกลับไม่มอง

Exercise
o ให้โครงกระดูกสัตว์ และให้ลองวาด outline ความน่าจะเป็นของตอนที่มันยังมีชีวิตอยู่
o แจกใบคำศัพท์ภาษาอังกฤษ ให้ไปท่อง
o ทุกคนบอกชื่อ แล้วคิดว่า Graphic Design คืออะไร และอยากเรียนอะไรในวิชานี้
o การใช้โปรแกรม Adobe Illustrator เบื้องต้น เช่น การตั้งค่าหน้ากระดาษ การส่งออกภาพ การบันทึกข้อมูล การใช้เครื่องมือ Pen, Pencil

คาบที่ 2

o องค์ประกอบของงานออกแบบ the Elements of Design
มี 5 อย่าง
– Line เส้น straight, curved, thick, thin, solid, and not-solid
เอามาทำเป็น Texture ได้
– Shapes รูปร่าง รูปทรง เลขาคณิต หรือรูปอิสระ สื่อสารด้านจิตวิทยาได้ด้วย
สามารถสร้าง Shape ขึ้นมาใหม่จาก Shape เล็ก ๆ หมาย ๆ อัน
– Mass มวลมีทั้ง 2-3 มิติ คือน้ำหนักของส่วนประกอบในงาน ตั้งแต่ขนาดในระนาบ 2 มิติ จนถึงงานนูน ว่านูนมากหรือน้อย
– Texture พื้นผิว อาจเลือกกระดาษหรือผ้าที่พิมพ์ จนกระทั่งออกแบบใน file ตั้งแต่ต้น
ถ้างาน Interia ก็เล่นได้เยอะ หรือ Landscape ใช้ไม้นานาพันธุ์
– Color สี อิทธิพลของสีต่อจิตใต้สำนึก สีใดเหมาะกับกลุ่มเป้าหมาย สถานที่หรือสินค้าใด

o สี
ประสบการณ์ จิตใต้สำนึก วัฒนธรรม
o ทฤษฎีคู่สี
o สี เย็น ร้อน

o พูดถึงความเป็นมิตรกับเส้นโค้ง Organic Form ให้พูดถึง Fractal สูตรแบบธรรมชาติ

Exercise
ให้ระบายสี และบอกว่าร้าน หรือป้าย กำลังสื่ออะไร ให้ความรู้สึกอย่างไร

o การใช้โปรแกรม Adobe Illustrator เช่น Stoke, Mess Tool
o ประเภทของสี เช่น Brighten, Darken, Different

คาบที่ 3

o หลักการออกแบบ the Principles of Design
มี 6 อย่าง
– Balance ความสมดุล (ซ้ายขวามากกว่าบนล่าง) การจัดวางส่วนต่าง ๆ ให้ Symetrical, radial รัศมี, formal ในกรอบ ปกติ, and informal waysไม่ปกติ เพื่อให้สมดุล Also covers the ‘rule of thirds’ and other structural elements.
ไม่สมดุลทำให้เกิด Movement
นาฬิกาเข็มตรงไหนที่เหมือนเดินจริง ๆ
– Proximity/Unity ความใกล้ชิด/ความเป็นหนึ่ง
ระยะห่างหรือระยะใกล้ ตามความหมายที่ต้องการสื่อ หรือเอามาวางใกล้ ๆ กันเพื่อสร้างจุดเด่น
– Alignment การจัดวางของภาพหรือตัวอักษร แม้ว่าตำแหน่งกลางจะง่ายสุดที่จะทำให้เด่น แต่ควรทำให้น่าสนใจกว่านั้น
– Repetition/Consistency การทำซ้ำ ความสอดคล้อง
เข้าใจความสำคัญของความสอดคล้อง เพื่อผู้อ่านและวิธีการสร้าง ลักษณะ ที่มั่นคงเหนียวแน่นและสมดุล ผ่านการซ้ำกันในลักษณะต่าง ๆ
– Contrast ความแตกต่าง รวมถึง ขนาด สี เข้มอ่อน texture เพื่อให้เกิดความน่าสนใจ
– White Space พื้นที่ว่าง ในทางสถาปัตยกรรมคือ Space ให้คนสามารถเข้าไปเป็นส่วนหนึ่งได้
(เพิ่ม) Columns and/or Grids สำหรับจัดหน้าหนังสือ หรือเป็นโครงร่าง ไม่จำเป็นต้อง 90 องศาเสมอไป
o Gestalt Psychology
o กฎของข้าเอง
– ลำดับการอ่าน คนเริ่มอ่านจากจุดเด่น หรือถ้าเป็นภาพที่มีคน คนจะดูคนก่อน
– Emotion สื่อความหมายให้ได้
– สถานที่ที่จะนำไปจัดแสดง ทั้งนี้รวมถึง Visual Task (ประสิทธิภาพของสายตาที่จะมองวัตถุชิ้นหนึ่ง ๆ) และ การทำให้เหมาะกับค่านิยม หรือสิ่งที่คนมองหาในเวลานั้น ๆ

Exercise
สร้างภาพ Graphic จากภาพถ่าย คน/สัตว์/สิ่งของ จริง แล้วเอามาให้เพื่อนดู ว่าดูออกหรือไม่

o ฝึกหัด Vector ภาพคน ด้วย Adobe Illustrator

คาบที่ 4

o สิ่งที่ต้องคำนึงถึง
– Visual Task
– Purpose
– Target Audience
** ย้อนกลับไปที่ กฎของข้าเอง

o Graphic Design ในงานประชาสัมพันธ์
– โบชัว
– โปสเตอร์หนัง (ออกแบบตัวหนังสือ ชื่อภาพยนต์)

o ตัวหนังสือในงาน Graphic
o ไม่จำเป็นต้องทำทั้งหมด ให้เลือกเฉพาะที่เหมาะสมกับงาน
– ขนาด สามารถมีหลายขนาดเรียง ๆ กัน
– ชนิด font อาจมีหลายชนิดตามอารมณ์ของแต่ละคำ ความหนา
– สี
– เงา ด้านนอก ด้านใน เงาด้านในจะทำให้เหมือนตัวหนังสือกรวง
– การจัดวาง ให้เป็นรูปต่าง ๆ
– การ fill พื้นที่ว่างด้วยตัวหนังสือ
– การตัดทอน ครึ่งหนึ่งของตัวหนังสือ ให้เกิดความน่าสนใจ
– การเชื่อมต่อกันของตัวหนังสือ
– พื้นผิวตัวหนังสือ
– ตัวหนังสืออาจเป็น Negative หรือ Positive Space ก็ได้ เช่นมีภาพในตัวหนังสือตัวหนา
– บางตัวอาจเป็นส่วนหนึ่งของภาพ เช่น O เป็นหัวคน
– ต่อเนื่อง และกลมกลืนกับภาพ เช่นต้นไม้เลื้อยมาพัน หรือ ภาพค่อย ๆ กลายร่างเป็นตัวอักษร หรือพุ่งขึ้นมาจากตัวอักษร
– Movement เส้นบรรทัดอาจคดเคียว เป็นวงกลม ทิศทางอาจเป็นไปตามจุดเด่นของภาพประกอบ

Exercise
ออกแบบ Doodle
o ฝึกหัดการสร้างงาน Graphic ด้วย Adobe Illustrator

คาบที่ 5

o ออกแบบหน้านิตยสาร
– การแบ่ง column เหมือน ๆ กันทั้งเล่ม
– การแบ่ง column เพื่อให้อ่านง่าย ไม่หลงบรรทัด
– ภาพใหญ่ชิดขอบ
– ขึ้นย่อหน้าใหม่
– เลขหน้า หรือหัวข้อเรื่องที่ขอบบน-ล่าง
– เลือก Quote ที่น่าสนใจมาวางใหญ่ ๆ หรือ Break Column ได้
o ออกแบบโฆษณาในหน้านิตยสาร/หนังสือพิมพ์ ไม่ให้คนเปิดข้าม
– Time ดึงดูดคนให้ใช้เวลานาน ๆ กับหน้านั้น ในการหาคำตอบ คือมีคำถาม หรือมีเกมส์เล็ก ๆ หรือมีกิจกรรมให้ทำ (พับกระดาษ)
– Routine เป็นสิ่งที่เกี่ยวข้องกับชีวิตประจำวันของคน คนจะอยากรู้ เช่นความรู้ใหม่ ๆ เรื่องการใช้งานของสินค้า จนกระทั่งเรื่องสุขภาพ
– Call เรียกกลุ่มเป้าหมาย เช่น “ใครชอบหมา ห้ามพลาด” หรือเอารูปที่จูงใจกลุ่มเป้าหมาย
– ทำความกลมกลืนกับนิตยสารหรือหนังสือพิมพ์ เช่นไม่ให้คนรู้ว่านี่คือหน้าโฆษณา เพราะนิสัยคนจะไม่ยอมดูหน้าโฆษณา
– หลักการอื่น ๆ ก็คือกฎเดิม ๆ

o การนำ .pdf จาก Adobe Illutrator มา Paste ลงใน Adobe Indesign เพื่อส่งให้โรงพิมพ์
o ทำ Interactive Book จาก Adobe Indesign

คาบที่ 6

o ออกแบบหน้าเว็ปไซต์
– ปุ่มที่เป็น Graphic
o การใช้ Adobe Flash เบื้องต้น
o การตั้งค่าหน้ากระดาษ
o การส่งออกภาพ
o การบันทึกข้อมูล
o การใช้เครื่องมือสร้างภาพต่าง ๆ

คาบที่ 7

o ออกแบบโฆษณาในเว็บไซต์
o การใช้ Adobe Flash ในการออกแบบเว็ปไซต์
o ทำปุ่มและใส่ Link ให้กับปุ่ม
o การทำ Animation อย่างง่าย
o การทำ Application หรือ Game อย่างง่าย

คาบที่ 8

o Graphic ในการให้ข้อมูล
o การใช้ Graphic ให้ข้อมูล เช่น แผนที่ ชนิดคำในหนังสือทักทาย หรือแยกหัวข้อในเว็บไซต์
o การใช้ Microsoft Excel ทำ Graph ประเภทต่าง ๆ เพื่อให้ข้อมูล
o การใช้ Adobe Flash ให้ข้อมูลในแผนที่

คาบที่ 9

o Motion Graphic
o การใช้ Adobe AfterEffect เบื้องต้น

คาบที่ 10

o ออกแบบพื้นผิว ระนาบ 2 มิติบนงาน 3 มิติ
o ออกแบบลวดลายบรรจุภัณฑ์ต่าง ๆ
o ต้องมี Logo และ Concept ของแต่ละรสชาติ รวมถึงข้อมูลทางโภชนาการ
– กล่อง
– ขวด
o การทำให้วัตถุเคลื่อนที่

คาบที่ 11

o ออกแบบพื้นผิว ระนาบ 2 มิติบนงาน 3 มิติ เช่น ร่ม บอลลูน เครื่องบิน ออกแบบลวดลายเสื้อผ้า พรม กระเบื้อง ผ้าม่าน Wall Paper
o การเคลื่อนย้านวัตถุใน Adobe AfterEffect
o การส่งออก Video
o การใส่พื้นผิวที่ออกแบบใน Autodesk 3Ds Max หรือ Maya

คาบที่ 12

o พื้นที่จริง เช่น Booth ตามห้างสรรพสินค้า
o ทางเข้าตัวอาคาร
o Interior Design
o การสร้างภาพ 3 มิติใน Adobe AfterEffect

คาบที่ 13

o สถาปัตยกรรม
o เสาโรมัน
o ภาพ Bird View ของ Landscape ที่ตัดต้นไม้เป็นรูปต่าง ๆ
o การใช้ Adobe Flash หรือ Adobe Animate ร่วมกับ Video ทั่วไป และ Adobe AfterEffect