ทำไมต้องใช้ดีไซน์ Material? การชั่งน้ำหนักข้อดีข้อเสีย

เผยแพร่แล้ว: 2022-03-11

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

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

ทำไมต้องใช้ดีไซน์ Material
Simplenote เป็นตัวอย่างหนึ่งของอินเทอร์เฟซแบบ Material Design ที่ใช้นอกเหนือจากแพลตฟอร์มดั้งเดิมของ Google

การออกแบบวัสดุคืออะไร?

ดีไซน์ Material สร้างขึ้นโดย Google ในปี 2014 โดยอิงบางส่วนจากเลย์เอาต์แบบการ์ดที่ใช้ใน Google Now รูปแบบการออกแบบที่ใช้กระดาษพยักหน้าทำให้แตกต่างจากรูปแบบการออกแบบเรียบๆ ที่ใช้กันอย่างแพร่หลายในขณะนั้น

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

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

การออกแบบวัสดุคืออะไร
โครงสร้างแบบการ์ดของ Basil มีรากฐานมาจากแนวทางเลย์เอาต์ของดีไซน์ Material

ทำไมต้องใช้ดีไซน์ Material?

เช่นเดียวกับระบบการออกแบบที่เป็นที่ยอมรับ มีข้อดีที่สำคัญบางประการในการใช้ดีไซน์ Material ที่นักออกแบบควรพิจารณา

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

Google รักษาดีไซน์ Material และเก็บเอกสารประกอบอย่างละเอียดเกี่ยวกับวิธีใช้และใช้งาน การสนับสนุนและเอกสารประเภทนี้อาจไม่เพียงพอสำหรับระบบการออกแบบที่ทันสมัยจำนวนมาก

กรอบการออกแบบวัสดุ
Shrine ใช้เลย์เอาต์ที่ซับซ้อนจำนวนหนึ่ง รวมถึงหน้าผลิตภัณฑ์ที่ใช้การ์ด

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

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

ต้องการนักออกแบบ UI อิสระที่ทำงานเต็มเวลาในสหรัฐอเมริกา

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

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

รูปแบบการออกแบบวัสดุของ Google
Rally นำธีมการออกแบบวัสดุที่มืดมาใช้ได้อย่างยอดเยี่ยม

ข้อเสียของการใช้ดีไซน์ Material

แม้ว่าดีไซน์ Material จะมีข้อดีที่ชัดเจน แต่ก็ไม่ได้หมายความว่าจะไม่มีข้อเสียใดๆ ที่เข้ากันได้ดีกับการใช้งาน

อย่างแรกเลย Material Design สามารถระบุได้ทันทีและมีความเกี่ยวข้องอย่างยิ่งกับ Google และโดยเฉพาะอย่างยิ่ง Android แม้ว่าสิ่งนี้จะไม่ใช่สิ่งเลวร้ายสำหรับทุกคน แต่ก็อาจส่งผลเสียสำหรับบางคน

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

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

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

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

องค์ประกอบการออกแบบวัสดุของ Google
เครนใช้ทั้งธีมสีอ่อนและสีเข้มเพื่อสร้างการออกแบบที่ซับซ้อนและสวยงาม

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

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

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

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

องค์ประกอบการออกแบบวัสดุของ Google
ตอบกลับจะแก้ไขไอคอนการนำทางแบบลอยด้วยเมนูสไลด์เอาต์ที่มีรายละเอียดมากขึ้นซึ่งรวมถึงป้ายข้อความ

บทสรุป

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

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

• • •

อ่านเพิ่มเติมเกี่ยวกับบล็อก Toptal Design:

  • วิธีสร้างกรอบการออกแบบที่มีประสิทธิภาพ (พร้อมไฟล์ Sketch ฟรี)
  • การสร้างคู่มือสไตล์ UI เพื่อ UX . ที่ดีขึ้น
  • การทำความเข้าใจระบบการออกแบบและรูปแบบ
  • การทดสอบ A/B UX สำหรับเฟรมเวิร์กแบบอิงคอมโพเนนต์
  • จิตวิทยาการออกแบบและประสาทวิทยาศาสตร์ของ Awesome UX