วันอังคาร, ตุลาคม 27

3-9 การออกแบบภาพสัญลักษณ์: หลักการออกแบบภาพสัญลักษณ์

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

แต่ในหัวข้อนี้หลักการออกแบบภาพสัญลักษณ์ อาจารย์ก็จะขอเน้นไปที่ การออกแบบโลโก้หรือว่าตราสัญลักษณ์นะครับ
เดี๋ยวไปเริ่มกันเลยนะครับ
หลักการออกแบบภาพสัญลักษณ์
ต่อไปอาจารย์ขอใช้คำว่าโลโก้แล้วกันนะครับ
พูดง่ายดี จริงก็จะมีคำว่า Communication Mark คำว่า Little Mark คำว่า Mascot เยอะแยะเลยนะครับ

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

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

ดังนั้นที่มาของโลโก้ก็คือลูกศร 4 อัน กำลังพุ่งเข้าสู่จุดตรงกลาง นะครับ
เลยทำให้กลายเป็น โลโก้เซ็นทรัลที่ใช้อยู่ในปัจจุบันนะครับ
ซึ่งจดตรงกลางก็จะกลายเป็นตัว c นะครับ
ที่ย่อมาจาก เซ็นทรัลนะครับ
นี้ และคือโลโก้ที่มีที่มาที่ไปมีแนวคิดที่ดีนะครับ
ต่อมาโลโก้ Amazon นะครับ
Amazon
เป็นเว็บที่ขายสินค้าออนไลน์นะครับ
มีตัวอักษร a m a z o n .com และที่สำคัญมีลูกศรชี้ตั้งแต่ ตัว a ไปถึงตัว z นั้นหมายความว่าเว็บนี้ขาย ของทุกอย่างที่มีในโลกนี้ ควบคุมตัวอักษร ตั้งแต่ a ถึง z หมดเลยนะครับ
คุณอยากได้สินค้าอะไรนะครับ
คุณ คุณก็เข้าไปที่เว็บ amazon
มีของครบจบที่เดียวนะครับ
หรืออันนี้โลโก้ FedEX เนอะเราเคยเจอแล้ว FedEX เป็นบริษัทขนส่งสินค้านะครับ
ระหว่างตัว E กับ ตัว X เห็นมัยครับ
ว่ามีลูกศรชี้ไปทางขวาเราเคยเรียนไปแล้วในสัปดาห์ที่แล้ว แล้วบ้างคนยังหาไม่เจอเลยว่าลูกศรอยู่ทางไหนนะครับ
เดี๋ยวทีมงานช่วนขึ้นกระพริบๆให้อาจารย์ด้วยนะครับ
ว่าลูกศรนั้นอยู่ตรงไหน นะครับ
อ่าแบบนี้นะครับ
นี้คือลูกศรที่ซ้อนอยู่ในโลโก้ FedEX นะครับ

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

ถ้านักศึกษาขับรถไปทีอุทยานแห่งชาติเขาใหญ่แล้วไปเจอป้ายที่มีรูปกวางแสดงว่า ใกล้จะถึงวันคริสต์มาสแล้วหรือป่าว มีซานตาคลอสยืนรอเราอยู่ข้างหน้านี้หรือป่าวครับ
ไม่ใช่นะครับ
แสดงว่าแถวนี้มีกวางสัญจรไปมาคุณต้องขับรถให้ระวังนะครับ
หรืออันนี้เป็นโลโก้ของสวนสยามทะเล กรุงเทพฯ นะครับ
อันข้างบนเป็นภาพโลโก้เก่า ใช้เป็นภาพคลื่นน้ำ เพราะว่าสวนสยาม บริการเกี่ยวกับทะเลเทียม ทะเลกรุงเทพฯ ใช้เป็นรูปคลื่นน้ำแสดงว่าที่นี้ก็ต้องเป็นสวนน้ำนะครับ
และต่อมาสวนสยามก็ได้มีแบรด์ใหม่เป็น ครับ
เป็น
siam park city เค้าก็ใช้ป็นรูปกล่อง 5 กล่อง 5 สี เป็นกล่องเก็บความสนุก
ถ้าดูดีๆจะมีรูปไดโนเสาร์ มีเป็นสไลเดอร์มีเป็นหอคอย เป็นรถไฟเหอะ เป็นม้าหมุน อะไรเต็มไปหมดเลยนะครับ
โลโก้นี้ก็สื่อถึงว่า
ถ้าคุณไปที่ siam park city
นี้ก็จะได้เล่นอะไรได้หลากหลายนะครับ
หลักการออกแบบภาพสัญลักษณ์ที่ดี นอกจากที่จะต้องมีแนวคิดที่ดีมีการสื่อความหมายได้ชันเจนนะครับ
บ้างทีภาพไหนที่มันมีรายละเอียด ที่ค่อนข้างซับซ้อนนะครับ
เราก็จะต้องทำการลดทอนรายละเอียด ของภาพลง นะครับ
การลดทอนลายระเอียดของภาพ ภาษาอังกฤษ จะใช้คำว่า Symbolization นะครับ
นักศึกษาจำคำนี้ให้ดีนะครับ
คำว่า Symbolization
คือการลดทอนรายละเอียดของภาพ อย่างในภาพตัวอย่างนี้ป็นโลโก้ของใส้กรอก CP นะครับ
เห็นมัยครับ
ว่าในตัว C มันมีรูปไก่ด้วยนะครับ
จริงๆแล้วไก่ มันมีทั้งปีกมีทั้งหงอน มีทั้งตา มีทั้งขา เล็บอะไรเยอะแยะเลย
แต่อย่างในรูปนี้ที่อยู่ในรูปตัว C ไก่มีลายระเอียดเยอะมัยครับ
ไม่มีเลยเป็นแค่ตัวกลมๆ แล้วก็มีหงอน มีปากนิดเดี๋ยวเองมีตา อยู่จุดหนึ่ง
แต่เรารู้ว่าเป็นรูปไก่ รวมถึงรูปหมู รูปหมูก็มีแค่มีแค่ปากจมูกตา มีนิดเดี๋ยว ไม่ได้มีรายละเอียดอะไรที่ซับซ้อนนะครับ

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

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

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

ถ้าเป็นภาพสีโคด สี รหัสสี ที่ชัดเจนนะครับ
รหัสสี CMYK ว่า ใช้ C เท่ารัย ใช้ M ใช้ Y ใช้ K เท่ารัยเพื่อที่จะให้เป็นมาตรฐานเดียวกันนะครับ

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

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

ก็ต้องปรับโลโก้นะครับ
นี้ก็คือเป็น 5ข้อของสาเหตุในการปรับปรุงที่พบได้ในปัจจุบัน อย่างเช่นโลโก้ของกาแฟ Starbucksอย่างโลโก้แรกเลยปี 1971 มีทั้งเป็นตัวเลยดูท่าจะเป็นนางเงือกนะครับ

ถ้าอาจารย์จำไม่ผิด เป็นนางเงือกมีข้อความ Starbuck coffee tea spices นะครับ
เยอะไปหมดเลยต่อมาก็ค่อยๆลดลงเรื่อยๆ อย่างปี 1987 ก็ทำเป็น เปลี่ยนเป็นสีเขียวตัวหนังสือก็เปลี่ยนเป็น Starbuck coffee นะครับ
ปี 1992 นางเงือกจะถูกซูมเข้าไป นิดหนึ่งนะครับ
มาในยุคปัจจุบันนี้ ซูมเข้าไปหนักกว่าเดิมอีกนะครับ
โดยการตัดคำว่า Starbuck และ coffee ออกไปด้วยนะครับ
เพราะว่าคนจำได้แล้วนะครับ
ว่าเห็นนางเงือกสีเขียวๆนี้ที่ไหนแสดงว่านี่คือร้าน Starbuck นะครับ
อันนี้เป็นโลโก้ของการบินไทยครับ
นักศึกาลองจินตนาการดู
ถ้าตอนนี้การบินไทยยังใช้โลโก้ ในยุคแรกเลยนะครับ
เป็นรูปของคนกำลังฟอนรำอยู่นะครับ
และก็มีคำว่าไทย โลโก้นี้ติดอยู่ที่เครื่องบินมันอาจจะดูเหมือนไม่ค่อยสวยนักนะครับ
ต่อมามีการปรับเปลี่ยนให้มีความทันสมัยมากขึ้น อย่างโลโก้ที่เป้นภาษาอังกฤษก็จะใช้ Thai ที่จะเป็นตัวพิมใหญ่ทั้งหมด ก็เห็นชัดเจนดีเนอะเวลามันอยู่ในเครื่องบินนะครับ
หรือภาพนี้เป็นโลโก้ของเครือสิงห์นะครับ
เช่นเบียร์สิงห์หรือน้ำดื่มตราสิงห์
ถ้าดุทั้งฝังซ้ายและฝังขวามันอาจจะดูเป็น จะดูไม่แตกต่างกันเท่าไรนะครับ

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

แต่…

ถ้าเป้นโลโก้เดิมไม่สามารถขยุมได้เพราะเล็บชี้ออก นะครับ
อันนี้ก็เป็นรายละเอียด เล็กๆน้อยๆที่เกิดขึ้นกับโลโก้สิงห์นะครับ
แล้วทั้งหมดนี้นะครับ
ก็เป็นเนื้อหาของบทที่ 3 นักศึกษาได้เรียนกับอาจารย์ไปทั้งหมด สองสัปดาห์นะครับ
สัปดาห์ที่แล้วเป้นเรื่องของการออกแบบภาพกราฟฟิก แล้วก็ ศิลปะการออกแบบนะครับ
ส่วนในสัปดาห์
ประกอบไปด้วย 3 หัวข้อใหญ่ๆด้วยกัน หัวข้อที่1คือหลักการ การใช้สี ต่อมาเป็นกลักการใช้ตัวอักษร สุดท้ายเป็น หลักการใช้สัญลักษณ์นะครับ
อาจารย์ก็หวังว่านักศึกษาก็จะนำความรู้ที่ได้เรียนกับอาจารย์ไปใช้ในการพัฒนาระบบอีก Element สำหรับการเรียน ในสัปดาห์ต่อไปรวมถึงใช้ในชีวิตประจำวันด้วยนะครับ
ในสัปดาห์ที่4นะครับ
สัปดาห์หน้านะครับ
นักศึกษาก็จะได้พบกับอาจารย์ธีรศักดิ์ สังข์ศรี นะครับ
ซึ่งท่านก็จะมาให้ความรู้ทางด้านเทคนิค เกี่ยวกับภาษา HTML5 และ Element/tag พื้นฐานของ HTML5
สำหรับใช้พัฒนา ecommerce นะครับ
ก่อนจากกันในวันนี้นะครับ
นักศึกษาอย่าลืม
ไปทำแบบฝึกหัดเก็บคะแนนด้วยนะครับ
หรือว่าใคร มีข้อเสนอแนะ ข้อสงสัยเกี่ยวกับการเรียนต่างๆนักศึกษาสามารถฝากข้อความ โพสข้อความไว้ได้นะครับ
เดี๋ยวอาจารย์จะเข้าไปตอบให้ แล้วพบกันใหม่ในโอกาสหน้าครับ
สวัสดีครับ

ใส่ความเห็น

อีเมลของคุณจะไม่แสดงให้คนอื่นเห็น ช่องข้อมูลจำเป็นถูกทำเครื่องหมาย *