12 สิ่งที่บอกว่า Design ดูดีหรือยัง?

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

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

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

• ใข้การทำซ้ำ เรามีวิธีเรียกการซ้ำองค์ประกอบได้หลายอย่างเช่น  Pattern , Repeat , Loop ฯลฯ แต่ไม่ว่าจะเรียกมันว่าอะไร การทำซ้ำไม่ได้หมายถึงแค่การก็อปปี้วัตถุออกมาเท่านั้น แต่มันคือการสร้างจังหวะบางอย่างที่มีทิศทางเดียวกันเพื่อให้มันนำไปสู่เรื่องราวหรือทิศทางอื่นได้

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

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

• พื้นที่ว่าง ( White Space ) คือส่วนที่ว่างจริงๆ ที่เป็นสีขาวหรือสีพื้นไปเลย เราไม่จำเป็นต้องทำให้ทุกพื้นที่เต็มไปด้วยองค์ประกอบ เพราะพื้นที่ว่างก็เป็นองค์ประกอบหนึ่งที่นำมาใช้ประโยชน์ได้เช่นกัน

ตัวอย่างภาพด้านล่างเราจะเห็นการแบ่งกลุ่มก้อนและการใช้พื้นที่ว่าง ที่จัดวางอย่างลงตัวทั้งระยะห่างและขนาดของตัวหนังสือ/กราฟฟิค

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

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

ในหลายๆครั้งเราอาจจะไม่ได้ใช้ Typefaces ( หรือที่เรียกติดปากว่า font ) เพียงแบบเดียวในการออกแบบ เช่นเราอาจจะมี Headline เป็นฟอนต์นึง แต่เนื้อหาอาจต้องใข้อีกฟอนต์ที่อ่านง่ายกว่า สิ่งที่ต้องคิดคือการใช้ฟอนต์สองสามรูปแบบนี้ให้กลมกลืนกัน

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

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

• ขนาด เป็นพื้นฐานที่สุดแล้ว อยากให้อ่านง่ายก็ทำใหญ่ๆสิ แต่การทำใหญ่ทำเล็กก็ควรเป็นไปด้วยนัยยะสำคัญของลำดับขั้นการสื่อสารด้วยนะครับ ด้วยหลักการง่ายๆว่าอะไรสำคัญสุดก็ควรใหญ่สุดก็ถือว่าดีแล้ว

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

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

• สไตล์ บางทีเราจำเป็นต้องใช้ฟอนต์ที่เฉี่ยวๆเท่ๆ  เราจึงต้องจัดวางอย่างระมัดระวังและตรวจสอบว่ามันลงตัวกับฟอนต์อื่นๆที่เรียบนิ่งด้วยหรือเปล่า

ตัวอย่างด้านล่างโชว์ให้เห็นการใช้สีเข้มอ่อนเน้นตัวอักษรอย่างคำว่า Wilson ให้โดดเด่น ในขณะที่ส่วนอื่นก็ยังคงดูเข้ากันและมีสไตล์ย้อนยุคอย่างที่ตั้งใจSteve Wolf/Dribbble

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

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

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

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

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

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

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

• ความใกล้กัน คือการวางองค์ประกอบที่เกี่ยวเนื่องกันให้อยู่ใกล้เคียงกัน เว้นระยะห่างพอประมาณพอให้ได้รู้ว่ามีจังหวะบางอย่างอยู่ เพื่อสร้างความต่อเนื่องของการจัดวางให้สมดุลน่าสนใจมากขึ้น

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

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

คือการที่ภาพรวมทั้งหมดดูเข้ากันและไปกันได้อย่างแนบเนียน พูดง่ายๆว่า Mood & Tone ของภาพสื่อสารอะไรบางอย่างออกมาอย่างถูกต้อง ไม่ว่าจะด้วยรูปแบบตัวหนังสือ สีสัน รูปแบบกราฟิคที่ใช้ บวกกับการจัดวางที่พาให้งานชิ้นนั้นๆอยู่ในภาวะบางอย่าง

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

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

เป็นเรื่องสำคัญมากในการเลือกใช้สีอย่างเหมาะสม และเรามีเครื่องมือในการเลือกใช้สีมากมาย

• เว็บชุดสีที่ตามเทรนด์และมีหลายประเภทให้เลือกหยิบมาใช้ครับ –http://goo.gl/fNlbzU
• เว็บสร้างชุดสีของ Adobe มีสียอดนิยมอัพเดทด้วยนะครับ –https://goo.gl/3SMWnm

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

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

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

ตัวอย่างง่ายๆ เช่น เมื่อคุณทำภาพสำหรับลง Facebook ด้วยขนาด 1000 x 1000 pixel แล้วต่อมาจึงเอาไปพิมพ์เป็น poster ขนาด A3 ภาพที่ได้จะไม่มีความคมชัดและงานดีๆของคุณเมื่อไปอยู่ในรูปแบบที่ไม่เหมาะสม มันก็จะดูแย่ได้อย่างไม่น่าเชื่อเลย

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

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

เราจึงนำมาเรียบเรียงเพื่อใช้เป็นเหตุผลอ้างอิงในเวลาที่คุณไม่รู้ว่าจะพรีเซนต์หรือคอมเมนท์งานอย่างไรเท่านั้นเองครับ

Source : Canva Design School