Metro (interfész)

Az oldal jelenlegi verzióját még nem ellenőrizték tapasztalt közreműködők, és jelentősen eltérhet a 2019. december 14-én felülvizsgált verziótól ; az ellenőrzések 9 szerkesztést igényelnek .

A Metro a Microsoft termékek grafikus felhasználói felületének művészi stílusának  belső kódneve . Jellemző jellemzői a tipográfia és a szöveg hangsúlyozása, a grafikai minimalizmus, a sima animáció, a stílus egyik megkülönböztető eleme a lapos téglalap alakú „csempék”.

Eredetileg Windows Phone - hoz tervezték , de az Encarta Encyclopedia és az MSN 2.0, valamint a Zune és a Windows Media Center felhasználói felületének létrehozásához is használták . A Metro később a Windows Phone , a Microsoft webhely , az Xbox 360 , a Windows 8 [1] , az Xbox One , a Windows 10 (részben) felületére épült .

Történelem

A Microsoft saját tervezésű változata szerint a műalkotás a tömegközlekedési rendszerekben általánosan megtalálható táblákon alapul, például a King County Metro [2] közlekedési rendszerén , amely a Microsoft székhelyének nagyobb Seattle -i területét szolgálja ki.

A korai Metro stíluselemek a Windows XP Media Center Edition rendszerhez készült Windows Media Centerben találhatók, amely a szöveget használja a navigáció elsődleges formájaként. Ez a felület a Media Center későbbi verzióira is át lett portolva. 2006-ban a Zune felületét ezekkel az elvekkel frissítették. A Microsoft tervezői úgy döntöttek, hogy újratervezik a felületet, nagyobb hangsúlyt fektetve a tiszta tipográfiára . Ezeket az alapelveket és az új Zune felhasználói felületet a Windows Phone rendszerben használták , amelyek közül sokat a Windows 8-ban is. Az egyszínű "élő csempéket" a Metro a Windows Phone fejlesztésének korai szakaszában vezette be. A Microsoft elkezdte integrálni ezeket az elemeket más termékeibe, amelyek közvetlen befolyása a Windows Live Messenger , a Live Mesh és a Windows 8 újabb verzióiban [1] volt látható .

Alapelvek

A Metro stílus a svájci stílusú tervezési elveken alapul . A Metro fő alapelvei a jó tipográfia és a nagyméretű szöveg hangsúlyozása, amely azonnal felkelti a figyelmet. A Microsoft a Metro-t "egyszerűnek, letisztultnak, modernnek", valamint "frissítésnek" nevezi a Windows , Android és iOS ikonalapú felületeiről [3] .

A Microsoft a Metrot kifejezetten a gyakori feladatok egy csoportjának megerősítésére tervezte a gyorsabb használat érdekében. Ezt úgy érik el, hogy kiiktatják a felesleges grafikákat, és ehelyett a tényleges tartalomra hagyatkoznak a fő felhasználói felületként.

Az animáció nagy szerepet játszik. A Microsoft a zökkenőmentes átmeneteket és a valódi mozgásokon (például koppintáson vagy húzáson) alapuló felhasználói interakciót javasol. Ez egy "élénk" és érzékeny interfész benyomását kelti a felhasználóban, "további mélységérzettel" [4] [5] .

A Microsoft összeállított egy belső listát a Metro alapjául szolgáló elvekről [6] .

Körülbelül a Windows 8 hivatalos megjelenésével (2012. október 26.) egy időben, amikor több fejlesztő és Microsoft-partner kezdett el dolgozni új Metro-stílusú alkalmazások létrehozásán, számos webhelyet hoztak létre a témában, beleértve a konkrét grafikai tervezési irányelveket. interfészek a Windows Store számára [7] .

Betűtípus

Mindezek a betűtípusok többnyire csak apró részletekben különböznek egymástól. A Segoe UI és a Segoe WP közötti legszembetűnőbb különbségek a digitális karakterekben láthatók. A Segoe UI Windows 8-ban használt verziója hasonló a Segoe WP-hez. Ebben a változatban a figyelemre méltó tipográfiai változásokkal rendelkező karakterek közé tartozik az 1 , 2 , 4 , 5 , 7 , 8 , valamint az I és Q .

Értékelések

A Metro korai reakciója általában pozitív volt. A Zune HD áttekintésében az Engadget azt mondta: "A Microsoft továbbra is törekszik a nagy, nagy tipográfiára, kifinomult, szépen megtervezett elrendezést biztosítva, amely majdnem annyira funkcionális, mint vonzó" [9] . A CNET dicsérte a Metro-t, mondván: "Ez egy kicsit merészebb és informálisabb, mint az iPhone és iPod touch merev, steril "rácsai" és az iratszekrényszerű menük az iPhone és iPod touch készülékeken " [10] .

Az Amerikai Industrial Designers Society (  IDEA ) Gold People's Choice Design Award és Best in Show díjjal jutalmazta a Metrot használó Windows Phone-t [11] :

Az innováció itt a gördülékeny interakció és az adatokra való összpontosítás a hagyományos felhasználói felület – ablakok és keretek – konvencióinak használata nélkül. Az adatok látványelemekké és vezérlőelemekké válnak. Az egyszerű gesztusok és átmenetek lehetővé teszik a tartalom mélyebb megismerését. Igazán elegáns és egyedi élmény.

Eredeti szöveg  (angol)[ showelrejt] Az újítás itt az élmény gördülékenysége és az adatokra való összpontosítás, az ablakok és keretek hagyományos felhasználói felületi konvencióinak használata nélkül. Az adatok vizuális elemekké és vezérlőelemekké válnak. Az egyszerű gesztusok és átmenetek mélyebbre vezetik a felhasználót a tartalomba. Igazán elegáns és egyedi élmény. – Isabelle Ancona, az IDEA felhasználói élményekkel foglalkozó tanácsadója [12]

2012. augusztus 25-én Peter Bright , az Ars Technicától  elkészítette a Windows 8 előzetesét, és az áttekintés első részét annak szentelte, hogy a Windows 8 Start képernyőjét (Metróval építette) összehasonlítsa a Windows 7 és korábbi verzióival. Az előnyeiket és hátrányaikat áttekintve Peter Bright arra a következtetésre jutott, hogy a Start képernyő, bár nem minden probléma nélkül, egyértelműen győztes [13] .

A metró nevének visszavonása

2012 augusztusában pletykák kezdtek el terjedni arról, hogy a Microsoft egyik kiskereskedelmi partnere, a német Metro AG cég  jogi lépésekkel fenyegetőzik a Microsoft ellen a "Metro" védjegy megsértése miatt. Feljegyzést küldtek a Microsoft fejlesztőinek és alkalmazottainak, amelyben felszólították őket, hogy hagyják abba a "Metro" kifejezés használatát a "fontos európai partnerrel" folytatott tárgyalások eredményeivel kapcsolatban [14] [15] . A Microsoft átmenetileg „Modern UI”-nak nevezi a tervezési nyelvet.

2012. augusztus 9-én kiderült, hogy a Microsoft a "Metro" helyett a "Windows 8" kifejezést tervezi használni a fogyasztói anyagokban, a "Modern UI" kifejezés pedig azoknak a fejlesztőknek szól, akik új tervezési elvek alapján terveznek szoftvert készíteni. [16] . 2012 szeptembere óta az MSDN dokumentációja a " Microsoft tervezési nyelv "  kifejezést használja a tervezési nyelvre [17] [18] [19] [20] . Emellett a Microsoft Build 2012 fejlesztői konferencián a cég a "Microsoft Design Language" nevet is használja [21] [22] .

A Metro stílusban Windows 8-hoz készített alkalmazásokra utalva a „Windows 8 stílusú alkalmazás” ( angol nyelvű  Windows 8-stílusú alkalmazás ) és a „ Windows Store alkalmazása ” ( Windows Store alkalmazás ) kifejezések a következők: használt.  

Lásd még

Jegyzetek

  1. 1 2 Windows Phone 7 Series UI tervezési és interakciós útmutató  ( 2010. március 18.). Letöltve: 2010. október 9. Az eredetiből archiválva : 2013. május 15.
  2. ↑ A Windows Phone 7 Metro tervezési nyelve  . microsoft.com. Letöltve: 2012. október 5. Az eredetiből archiválva : 2013. május 24..
  3. Tallózás a Blackboard kezdőlapján. Metro - Tábla  . Businessinsider.com (2011. április 25.). Letöltve: 2011. november 3. Az eredetiből archiválva : 2013. május 24..
  4. Windows Phone felhasználói felület és tervezési  nyelv . Letöltve: 2010. október 9. Az eredetiből archiválva : 2013. május 24..
  5. From Transportation to Pixels , Windows Team blog, 2011-02-16 , < http://windowsteamblog.com/windows_phone/b/wpdev/archive/2011/02/16/from-transportation-to-pixels.aspx > Archivált 2011. február 18-án kelt példány a Wayback Machine -nél 
  6. A Windows Phone 7 Metro tervezési nyelve |  Microsoft Design .toolbox . Microsoft.com. Letöltve: 2011. szeptember 8. Archiválva az eredetiből: 2013. május 15.
  7. UX irányelvek a Windows Store-alkalmazásokhoz . Letöltve: 2013. május 15. Az eredetiből archiválva : 2012. november 30.
  8. Hosszú Zheng. „Zegoe”, az új Zune betűtípus.  (angol) . istartedsomething.com (2007. november 14.). Letöltve: 2012. október 15. Az eredetiből archiválva : 2013. május 25..
  9. ↑ Topolsky , Joshua Zune HD áttekintés  . Aol (2009. szeptember 17.). Letöltve: 2013. február 19. archiválva az eredetiből: 2013. május 25.
  10. Zune HD 64GB  áttekintés . CNET . CBS Interactive (2009. szeptember 17.). Letöltve: 2013. február 19. archiválva az eredetiből: 2013. május 25.
  11. Warren, Tom Windows Phone nyeri az IDEA 2011 - People's Choice dizájn  díjat . WinRumors (2011. szeptember 18.). Letöltve: 2013. február 19. Az eredetiből archiválva : 2013. május 28..
  12. Windows Phone  7 . Industrial Designers Society of America (2011. június 8.). Letöltve: 2011. november 3. Az eredetiből archiválva : 2013. május 28..
  13. Bright, Peter Windows 8 az asztalon – egy kínos  hibrid . Ars Technica . Condé Nast Digital (2012. április 25.). Letöltve: 2013. február 19. archiválva az eredetiből: 2013. május 25.
  14. A Microsoft kénytelen megváltoztatni az interfész nevét  (eng.) . BBC (2012. augusztus 3.). Letöltve: 2013. február 19. Az eredetiből archiválva : 2013. március 9..
  15. A Microsoft elveti a "Metro" nevet a Windows  8 rendszerben . BBC hírek. Letöltve: 2013. május 26. Az eredetiből archiválva : 2013. május 26..
  16. A Microsoft hivatalosan átnevezte a Metro UI-t Modern  UI -ra . A nyilvántartás (2012. augusztus 1.). Letöltve: 2013. május 26. Az eredetiből archiválva : 2013. május 26..
  17. Készítsen nagyszerű Windows Store-alkalmazásokat . MSDN. Letöltve: 2012. szeptember 17. Az eredetiből archiválva : 2013. május 26..
  18. Tervezési esettanulmány: iPad a Windows Store  alkalmazásba . MSDN. Letöltve: 2012. november 1. Az eredetiből archiválva : 2013. május 26..
  19. Útmutató a  tipográfiához . MSDN. Letöltve: 2012. november 1. Az eredetiből archiválva : 2013. május 26..
  20. Útiterv a Windows Store alkalmazásokhoz DirectX és C  ++ használatával . MSDN. Letöltve: 2012. november 1. Az eredetiből archiválva : 2013. május 26..
  21. A Microsoft tervezési nyelve  . Channel 9 (Microsoft). Letöltve: 2012. november 1. Az eredetiből archiválva : 2013. május 26..
  22. Mary Jo Foley. Microsoft Design Language: A „Metro ” kifejezés legújabb hivatalos módja  . Letöltve: 2012. november 1. Az eredetiből archiválva : 2013. május 26..

Linkek