ผลต่างระหว่างรุ่นของ "Material Design"

จาก Morange Wiki
แถว 1: แถว 1:
== หัวข้อ Material Design ==
 
* [[ Material Design Introduction ]]
 
* Blank
 
  
 
----
 
----
แถว 13: แถว 10:
 
----
 
----
  
== แนวทางการออกแบบ ==
+
== แนวทางการออกแบบหรือหลักการออกแบบ (Principles) ==
 +
=== มี 3 ปัจจัยสำคัญ ===
 +
;  Material is the metaphor
 +
: Material คือ วัสดุที่เสมือนจริง ทางด้านกายภาพ ทั้งเรื่องของ แสง-เงา (Light-Edge Shadow) ,พื้นผิว (Surface) การตอบสนองหรือ การเคลื่อนไหว สิ่งนี้คือการอุปมาสำหรับแนวทางการออกแบบ
 +
: ว่าง่ายๆคือ พื้นผิวและเงาของขอบวัตถุที่ออกแบบนั้น เป็นหัวใจสำคัญของการบ่งบอกว่า วัตถุนั้นเคลื่อนย้ายหรือเคลื่อนไหวอย่างไรและมีความสัมพันธ์กับวัตถุอื่นๆอย่างไร
 +
: และแสงที่เสมือนแสงจริง จะแสดงให้เห็น การแบ่งแยกพื้นที่ของวัตถุและส่วนที่มีการเคลื่อนไหวของวัตถุนั้น
 +
;  Bold, graphic, intentional
 +
: คือการจงใจออกแบบส่วนสำคัญต่างๆ อันได้แก่ ช่องตารางการออกแบบ (Grid) , ตัวอักษรในการการออก (Typography) , พื้นที่ว่าง (Space) , สี (Color) และ รูปภาพ (Imagery)
 +
: การจัดลำดับชั้นของความหมายและบ่งบอกจุดโฟกัสที่สำคัญของสายตา เน้นการกระทำของผู้ใช้เป็นหลัก (UX)
 +
;  Motion provides meaning
 +
:

รุ่นแก้ไขเมื่อ 04:49, 25 กรกฎาคม 2559


Material Design Introduction

Material Design ถูกคิดค้นหรือเป็นแนวทางการออกแบบ โดย Google และเปิดตัว Material Design ในงาน Google I/O ในปี 2014 โดย Material Design ที่ Google ได้วางแนวทางไว้นั้น เหตุเพราะ Google เป็นบริษัทเปิดหรือ แบบเสรี ที่นักพัฒนาจะสามารถหยิบเอาบางส่วนไปพัฒนาต่อได้ หรือเปรียบเสมือนกับ Open Source Company โดย จึงยากต่อการควบคุมนักพัฒนาซอฟต์แวร์ว่า จะต้องออกแบบหรือบังคับให้ใช้แบบนี้ตามนี้ Google สร้าง Metaphor (อุปมา) ขึ้นมาเพื่อเป็นแนวทางการออกแบบ เรียกว่า Material Design และเปรียบเสมือน ภาษาของการออกแบบ (Visual Language) โดยจะรวบรวม แนวทางการออกแบบ ไว้ด้วยกัน


แนวทางการออกแบบหรือหลักการออกแบบ (Principles)

มี 3 ปัจจัยสำคัญ

Material is the metaphor
Material คือ วัสดุที่เสมือนจริง ทางด้านกายภาพ ทั้งเรื่องของ แสง-เงา (Light-Edge Shadow) ,พื้นผิว (Surface) การตอบสนองหรือ การเคลื่อนไหว สิ่งนี้คือการอุปมาสำหรับแนวทางการออกแบบ
ว่าง่ายๆคือ พื้นผิวและเงาของขอบวัตถุที่ออกแบบนั้น เป็นหัวใจสำคัญของการบ่งบอกว่า วัตถุนั้นเคลื่อนย้ายหรือเคลื่อนไหวอย่างไรและมีความสัมพันธ์กับวัตถุอื่นๆอย่างไร
และแสงที่เสมือนแสงจริง จะแสดงให้เห็น การแบ่งแยกพื้นที่ของวัตถุและส่วนที่มีการเคลื่อนไหวของวัตถุนั้น
Bold, graphic, intentional
คือการจงใจออกแบบส่วนสำคัญต่างๆ อันได้แก่ ช่องตารางการออกแบบ (Grid) , ตัวอักษรในการการออก (Typography) , พื้นที่ว่าง (Space) , สี (Color) และ รูปภาพ (Imagery)
การจัดลำดับชั้นของความหมายและบ่งบอกจุดโฟกัสที่สำคัญของสายตา เน้นการกระทำของผู้ใช้เป็นหลัก (UX)
Motion provides meaning