กลับไปหน้าบทความ

อ่าน 9 นาที

เมโทร (ภาษาการออกแบบ)

ภาษาการออกแบบของ Microsoft (หรือ MDL ) [ 1 ] หรือที่รู้จักกันในชื่อ Metro เป็น ภาษาการออกแบบ ที่สร้างโดย Microsoft และอิงตาม สไตล์ การออกแบบแบบเรียบง่าย ภาษาการออกแบบนี้เน้นที่...

เมโทร (ภาษาการออกแบบ)

เครื่องคิดเลข Windowsที่สร้างขึ้นโดยใช้ดีไซน์ Metro ในWindows 8.1 : ส่วนประกอบหลักของ Metro ดังที่แสดงในภาพ ได้แก่ ฟอนต์แบบบาง/เบา และไอคอนแบบเรียบ

ภาษาการออกแบบของ Microsoft (หรือMDL ) [ 1 ]หรือที่รู้จักกันในชื่อMetroเป็นภาษาการออกแบบที่สร้างโดยMicrosoftและอิงตาม สไตล์ การออกแบบแบบเรียบง่ายภาษาการออกแบบนี้เน้นที่การจัดวางตัวอักษรและไอคอน ที่เรียบง่าย การไม่มีสิ่งรก การเพิ่มอัตราส่วนเนื้อหาต่อพื้นหลัง ("เนื้อหาก่อนพื้นหลัง") และรูปทรงเรขาคณิตพื้นฐาน

ศูนย์รวมเพลงและวิดีโอใน Windows Phone แสดงองค์ประกอบการออกแบบสไตล์ Metro รวมถึงหัวข้อตัวพิมพ์เล็กและไทล์ขนาดกว้าง

ตัวอย่างแรกๆ ของหลักการ MDL สามารถพบได้ในEncarta 95และMSN 2.0 [ 2 ] [ 3 ] ภาษาการออกแบบได้รับการพัฒนาในWindows Media CenterและZuneและได้รับการเปิดตัวอย่างเป็นทางการในชื่อ Metro ในระหว่างการเปิดตัวWindows Phone 7ในปี 2010 หลังจากนั้นก็ถูกนำไปใช้ในผลิตภัณฑ์อื่นๆ ของบริษัทหลายรายการ รวมถึงซอฟต์แวร์ระบบ Xbox 360และซอฟต์แวร์ระบบ Xbox One , Windows 8 , Windows PhoneและOutlook.com [ 4 ] [ 5 ]ก่อนที่ชื่อ "ภาษาการออกแบบของ Microsoft" จะกลายเป็นชื่ออย่างเป็นทางการ Qi Lu ผู้บริหารของ Microsoft ได้กล่าวถึงมันว่าเป็น ภาษาการออกแบบ UI สมัยใหม่ ใน สุนทรพจน์หลักของเขาในการประชุม MIXX [ 6 ]ตามที่ Microsoft กล่าว "Metro" เป็นเพียงชื่อรหัสมาโดยตลอดและไม่เคยมีจุดประสงค์เพื่อเป็นผลิตภัณฑ์ขั้นสุดท้าย แต่เว็บไซต์ข่าวระบุว่าการเปลี่ยนแปลงนี้เกิดจากปัญหาเครื่องหมายการค้า[ 4 ]

Microsoft Design Language 2 (MDL2) ได้รับการพัฒนาควบคู่ไปกับWindows 10โดยมีการปรับเปลี่ยนหลายอย่าง[ 7 ] [ 8 ]ในปี 2017 ไมโครซอฟต์ได้เปิดตัวFluent Design Systemซึ่งค่อยๆ เข้ามาแทนที่ Metro ในปีต่อๆ มา[ 9 ]

ประวัติศาสตร์

ภาษาการออกแบบนั้นอิงตามหลักการออกแบบของกราฟิกดีไซน์แบบคลาสสิกของสวิสสามารถมองเห็นรูปแบบนี้ได้ในWindows Media CenterสำหรับWindows XP Media Center Edition [ 10 ]ซึ่งเน้นการใช้ข้อความเป็นรูปแบบหลักในการนำทาง รวมถึงแนวคิดเริ่มต้นของNeptune [ 11 ]อินเทอร์เฟซนี้ยังคงใช้ใน Media Center เวอร์ชันต่อๆ มา ในปี 2549 Zune ได้ปรับปรุงอินเทอร์เฟซ ใหม่โดยใช้หลักการเหล่านี้ นักออกแบบของ Microsoft ตัดสินใจที่จะออกแบบอินเทอร์เฟซใหม่โดยเน้นที่การจัดวางตัวอักษรที่สะอาดตาและลดการใช้ UI chrome ลง[ 12 ]หลักการเหล่านี้และ UI ใหม่ของ Zune ได้ถูกนำไปใช้กับWindows Phoneซึ่งเปิดตัวครั้งแรกในปี 2553 (ซึ่งได้รับแรงบันดาลใจอย่างมากจาก Windows 8) Zune Desktop Client ก็ได้รับการออกแบบใหม่โดยเน้นที่การจัดวางตัวอักษรและการออกแบบที่สะอาดตา ซึ่งแตกต่างจาก UI ของ Zune รุ่นก่อน หน้าที่ใช้ Portable Media Center "live tiles" สีแบนถูกนำมาใช้ในภาษาการออกแบบในระหว่างการศึกษา Windows Phone ในช่วงแรกๆ

ในการสัมภาษณ์มีการอธิบายว่าแผนกต่างๆ ของ Microsoft ใช้ผลิตภัณฑ์ของกันและกัน และการขยาย Metro ไม่ใช่แนวทางที่ใช้ทั่วทั้งบริษัท แต่เป็นเพราะทีมต่างๆ เช่นXboxชอบ Metro และนำไปปรับใช้กับผลิตภัณฑ์ของตนเอง แผนกต่างๆ ของ Microsoft หลายแห่งจึงนำ Metro มาใช้ในที่สุด[ 13 ]

Microsoft Design Language 2 (MDL2) ได้รับการพัฒนาควบคู่ไปกับ Windows 10 เวอร์ชันนี้ได้แนะนำ วิดเจ็ตชุดใหม่รวมถึงตัวเลือกวันที่ สวิตช์ และตัวสลับ และลดความหนาของเส้นขอบสำหรับองค์ประกอบอินเทอร์เฟซผู้ใช้ทั้งหมด[ 7 ] [ 8 ]การเปลี่ยนแปลงอื่นๆ ได้แก่ปุ่มแฮมเบอร์เกอร์เพื่อเข้าถึงมุมมองต่างๆ แทนพาโนรามา/แครูเซลของ Metro ดั้งเดิม[ 14 ]

หลักการ

แบบอักษร Segoe UIในWindows VistaและWindows 7 (ด้านบน); และWindows 8 , Windows 8.1และWindows 10 (ด้านล่าง)
หลักการออกแบบภาษาของ Microsoft ที่อยู่เบื้องหลังหน้าจอเริ่มต้นในWindows 8และXbox One (ด้านบน) และ "Threshold" ใน Windows 10 (ด้านล่าง) ซึ่งใช้ในWindows Store , Xbox MusicและXbox Video ด้วยนั้น ได้แก่: ไทล์แสดงถึงหน่วยข้อมูลพื้นฐาน

ทีมออกแบบของ Microsoft อ้างถึงป้ายภาษาการออกแบบที่พบได้ทั่วไปในระบบขนส่งสาธารณะเป็นแรงบันดาลใจ[ 15 ]ภาษาการออกแบบนี้เน้นที่การจัดวางตัวอักษรที่ดีและมีตัวอักษรขนาดใหญ่ที่ดึงดูดสายตา Microsoft มองว่าภาษาการออกแบบนี้ "เรียบหรู รวดเร็ว ทันสมัย" และเป็นการ "ปรับปรุงใหม่" จาก อิน เท อร์เฟซแบบ ไอคอนของ Windows, AndroidและiOS [ 16 ] ทุกกรณีใช้แบบอักษรที่อิงตาม ตระกูลแบบอักษร Segoeที่ออกแบบโดยSteve Mattesonที่Agfa Monotypeและได้รับอนุญาตให้ Microsoft ใช้ สำหรับ Zune นั้น Microsoft ได้สร้างเวอร์ชันที่กำหนดเองชื่อ Zegoe UI [ 17 ]และสำหรับWindows Phone นั้น Microsoft ได้สร้างตระกูลแบบอักษร Segoe WP แบบอักษรเหล่านี้ส่วนใหญ่แตกต่างกันเพียงรายละเอียดเล็กน้อย ความแตกต่างที่ชัดเจนยิ่งขึ้นระหว่าง Segoe UI และ Segoe WP นั้นเห็นได้ชัดในตัวเลข แบบอักษร Segoe UI ใน Windows 8 มีความแตกต่างที่ชัดเจน – คล้ายกับ Segoe WP ตัวอักษรที่มีการเปลี่ยนแปลงทางด้านการพิมพ์ที่เห็นได้ชัด ได้แก่ 1, 2, 4, 5, 7, 8, I และ Q

โจ เบลฟิโอเรเป็นหนึ่งในสถาปนิกของเมโทร ในงานNokia World 2011 เบลฟิโอเรอธิบายว่า UI มีเป้าหมายที่จะเป็น "ศิลปะ" ในองค์ประกอบข้อความและไอคอนเขายังกล่าวถึง "การเคลื่อนไหว" ของ UI โดยเฉพาะใน Windows Phone ของ Live Tiles จุดที่เคลื่อนไหว และการเลื่อนแบบจลนพลศาสตร์[ 18 ]

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

แอนิเมชันมีบทบาทสำคัญมาก ไมโครซอฟต์แนะนำให้รับรู้การเปลี่ยนผ่านและการโต้ตอบของผู้ใช้ (เช่น การกดหรือการปัด) อย่างสม่ำเสมอด้วยแอนิเมชันหรือการเคลื่อนไหวที่เป็นธรรมชาติบางรูปแบบ ซึ่งมีจุดมุ่งหมายเพื่อให้ผู้ใช้รู้สึกถึง UI ที่ "มีชีวิตชีวา" และตอบสนองได้ดี พร้อม "ความรู้สึกถึงความลึกที่เพิ่มขึ้น" [ 19 ] [ 20 ]

แผนกต้อนรับ

บนมือถือ

การตอบรับเบื้องต้นต่อภาษาโดยทั่วไปเป็นไปในเชิงบวก ในการรีวิวZune HD Engadget กล่าวว่า "Microsoft ยังคงผลักดันการใช้ตัวอักษรขนาดใหญ่ต่อไป โดยนำเสนอเค้าโครงที่ซับซ้อนและออกแบบอย่างเรียบร้อย ซึ่งใช้งานได้จริงและน่าดึงดูดใจ" [ 21 ] CNETชื่นชมภาษาการออกแบบ โดยกล่าวว่า "มันดูกล้าหาญและไม่เป็นทางการมากกว่าตารางไอคอนที่แน่นและเมนูแบบ Rolodex ของ iPhone และ iPod Touch" [ 22 ]

ในพิธี IDEA 2011 สมาคมนักออกแบบอุตสาหกรรมแห่งอเมริกา (IDSA) ได้มอบรางวัล "Gold Interactive", "People's Choice Award" และ "Best in Show" ให้กับ Windows Phone 7 ซึ่งใช้ UI [ 23 ] [ 24 ] Isabel Ancona ที่ปรึกษาด้านประสบการณ์ผู้ใช้ของ IDSA อธิบายว่าทำไม Windows Phone ถึงได้รับรางวัล: [ 25 ]

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

มีรายงานว่า UI ได้รับการตอบรับที่ดีกว่าจากผู้หญิงและผู้ใช้ครั้งแรก[ 18 ]

คำวิจารณ์มุ่งเน้นไปที่การใช้ ข้อความ ตัวพิมพ์ใหญ่ทั้งหมด เป็นพิเศษ ด้วยการเพิ่มขึ้นของการใช้งานอินเทอร์เน็ต นักวิจารณ์ได้เปรียบเทียบสิ่งนี้กับโปรแกรมคอมพิวเตอร์ที่ตะโกนใส่ผู้ใช้ นักข่าวไอที Lee Hutchinson อธิบายการใช้แนวปฏิบัตินี้ของ Microsoft ในOneNoteเวอร์ชันmacOSว่าแย่มาก โดยอ้างว่ามัน "ถูกสาปด้วยเมนูหน้าต่างแอปพลิเคชันที่ไม่เป็นมาตรฐานและบ้าคลั่งในรูปแบบตัวพิมพ์ใหญ่ทั้งหมด ซึ่งไม่เพียงแต่ละเมิดข้อกำหนดการออกแบบของ OS X เท่านั้น แต่ยังเหมือนกับการเอาพวกมันไปไว้หลังโรงเก็บของ ราดน้ำมันเบนซิน แล้วจุดไฟเผา" [ 26 ]

บนเดสก์ท็อป Windows 8

เมื่อWindows 8 ออกมา อินเทอร์เฟซผู้ใช้ของระบบปฏิบัติการและการใช้ภาษาการออกแบบได้รับเสียงวิจารณ์ในแง่ลบโดยทั่วไป เมื่อวันที่ 25 สิงหาคม 2555 Peter Bright จากArs Technicaได้รีวิวเวอร์ชันพรีวิวของ Windows 8 โดยอุทิศส่วนแรกของการรีวิวให้กับการเปรียบเทียบ การออกแบบ เมนู Startที่ใช้ใน Windows 8 และ Windows 7 โดยกล่าวถึงข้อดีและข้อเสีย Peter Bright สรุปว่าเมนู Start ใน Windows 8 (เรียกว่าหน้าจอ Start) แม้จะไม่ใช่ไม่มีปัญหา แต่ก็เป็นผู้ชนะอย่างชัดเจน อย่างไรก็ตาม เขาได้สรุปว่าอินเทอร์เฟซผู้ใช้ของ Windows 8 นั้นน่าหงุดหงิด และแง่มุมต่างๆ ของอินเทอร์เฟซผู้ใช้ไม่ได้ทำงานร่วมกันได้ดี[ 27 ] Woody Leonhard วิจารณ์อย่างรุนแรงยิ่งกว่าเมื่อเขากล่าวว่า "จากมุมมองของผู้ใช้ Windows 8 ล้มเหลว – เป็นการผสมผสานที่งุ่มง่ามซึ่งดึงผู้ใช้ไปในสองทิศทางพร้อมกัน" [ 28 ]

นอกจากการเปลี่ยนแปลงเมนู Start แล้ว Windows 8 ยังใช้แนวทางแบบโมดอลมากขึ้นด้วยการใช้แอปแบบเต็มหน้าจอซึ่งหลีกเลี่ยงการพึ่งพาอินเทอร์เฟซเดสก์ท็อปแบบไอคอน อย่างไรก็ตาม ในการทำเช่นนั้น ไมโครซอฟต์ได้เปลี่ยนจุดสนใจไปจากการทำงานหลายอย่างพร้อมกันและประสิทธิภาพทางธุรกิจ[ 29 ]

การเปลี่ยนชื่อ

ในเดือนสิงหาคม 2012 The Vergeประกาศว่ามีการส่งบันทึกภายในไปยังนักพัฒนาและพนักงานของ Microsoft เพื่อประกาศการตัดสินใจที่จะ "ยุติการใช้" คำว่า "Metro" เนื่องจาก "การหารือกับพันธมิตรสำคัญในยุโรป" และพวกเขากำลัง "ดำเนินการเกี่ยวกับคำทดแทน" [ 30 ]สำนักข่าวเทคโนโลยีArs Technica [ 31 ] TechRadar [ 32 ] CNET [ 33 ] Engadget [ 34 ] และ Network World [ 35 ]และสื่อกระแสหลักBits BlogจากThe New York Times Company [ 36 ]และBBC News Online [ 37 ]เผยแพร่ว่าพันธมิตรที่กล่าวถึงในบันทึกอาจเป็นหนึ่งในพันธมิตรค้าปลีกของ Microsoft บริษัทMetro AG ของ เยอรมนี เนื่องจากชื่อดัง กล่าวมีศักยภาพที่จะละเมิดเครื่องหมายการค้า "Metro" ของพวกเขา ต่อมา Microsoft ระบุว่าเหตุผลที่ลดความสำคัญของชื่อนั้นไม่เกี่ยวข้องกับการฟ้องร้องใดๆ ในปัจจุบัน และ "Metro" เป็นเพียงชื่อรหัสโครงการภายในเท่านั้น[ 38 ]แม้ว่าจะมีการโปรโมตแบรนด์นี้ต่อสาธารณะอย่างมากก็ตาม[ 39 ]ในบางบริบท บริษัทเริ่มใช้คำว่า "Modern" หรือคำขยายความทั่วไปอย่าง "Windows 8" เพื่ออ้างถึงการออกแบบใหม่ ซึ่งอาจเป็นเพียงคำชั่วคราว[ 40 ]

ในเดือนกันยายน พ.ศ. 2555 "ภาษาการออกแบบของ Microsoft" ได้รับการยอมรับให้เป็นชื่ออย่างเป็นทางการสำหรับรูปแบบการออกแบบ[ 1 ] [ 41 ]คำนี้ถูกใช้ในเอกสารเครือข่ายนักพัฒนาของ Microsoft [ 42 ] [ 43 ] [ 44 ] [ 45 ]และในการ ประชุม Microsoft Build ปี พ.ศ. 2555 เพื่ออ้างถึงภาษาการออกแบบ[ 1 ] [ 46 ]

ในการเปลี่ยนแปลงที่เกี่ยวข้อง ไมโครซอฟต์ได้ยกเลิกการใช้คำว่า " แอปสไตล์เมโทร " เพื่ออ้างถึงแอปมือถือที่เผยแพร่ผ่านWindows Store [ 41 ]

ดูเพิ่มเติม

  • เว็บไซต์ Microsoft by the Numbers
  • การออกแบบสมัยใหม่ที่ Microsoft (เอกสารเก่า)
  • แนวทาง UX สำหรับแอป Windows StoreบนMSDN
  • แนวทางการออกแบบสำหรับ Windows PhoneบนMSDN
ดึงข้อมูลมาจาก " https://en.wikipedia.org/w/index.php?title=Metro_(design_language)&oldid=1361288677 "

สรุปเนื้อหา

ข้อมูลสำคัญจากบทความ

ข้อมูลสำคัญเกี่ยวกับ เมโทร (ภาษาการออกแบบ)

ภาษาการออกแบบของ Microsoft (หรือ MDL ) [ 1 ] หรือที่รู้จักกันในชื่อ Metro เป็น ภาษาการออกแบบ ที่สร้างโดย Microsoft และอิงตาม สไตล์ การออกแบบแบบเรียบง่าย ภาษาการออกแบบนี้เน้นที่...

ประวัติศาสตร์

ภาษาการออกแบบนั้นอิงตามหลักการออกแบบของกราฟิกดีไซน์แบบคลาสสิก ของ สวิส สามารถมองเห็นรูปแบบนี้ได้ใน Windows Media Center สำหรับ Windows XP Media Center Edition [ 10 ] ซึ่งเน้นการใช้ข้อความเป็นรูปแบบหลักในการนำทาง รวมถึงแนวคิดเริ่มต้นของ Neptune [ 11 ]...

หลักการ

ทีมออกแบบของ Microsoft อ้างถึงป้ายภาษาการออกแบบที่พบได้ทั่วไปในระบบขนส่งสาธารณะเป็นแรงบันดาลใจ [ 15 ] ภาษาการออกแบบนี้เน้นที่การจัดวางตัวอักษรที่ดีและมีตัวอักษรขนาดใหญ่ที่ดึงดูดสายตา Microsoft มองว่าภาษาการออกแบบนี้ "เรียบหรู รวดเร็ว ทันสมัย" และเป็นการ...

บนมือถือ

การตอบรับเบื้องต้นต่อภาษาโดยทั่วไปเป็นไปในเชิงบวก ในการรีวิว Zune HD Engadget กล่าวว่า "Microsoft ยังคงผลักดันการใช้ตัวอักษรขนาดใหญ่ต่อไป โดยนำเสนอเค้าโครงที่ซับซ้อนและออกแบบอย่างเรียบร้อย ซึ่งใช้งานได้จริงและน่าดึงดูดใจ" [ 21 ] CNET ชื่นชมภาษาการออกแบบ...