A Google Material Design felhasználói felülete új színekkel, ikonográfiával és az érintésre összpontosítva megújul

Úgy tűnik, hogy a Chromium Gerrit új véglegesítései a "Material Design 2"-re hivatkoznak, amely a Google Material Design nyelvének új és továbbfejlesztett változata lehet.

A Material Design, az Android Lollipop mellett megjelent egységes tervezési nyelv lapos, pasztell színpalettákat, mélységet, lágy világítást és valósághű fizikát tartalmaz. Célja, hogy utánozza a való világ tárgyainak tapinthatóságát anélkül, hogy skeuomorfizmushoz folyamodna; A Google a "klasszikus elvek" szintéziseként írja le a technológia "[a] innovációjával és lehetőségeivel".

A Material Design 2014-es debütálása óta futótűzként terjedt el az Android ökoszisztémájában – nem is beszélve az olyan Google-alkalmazásokról, mint a YouTube, a Chrome, a Gmail, a Hangouts és a Google Naptár. Lebegő akciógombok, kellemes színek és emelési technikák tettek elérhetővé a részeként Material Components Library a GitHubon (az Android Design Support Library és a Google webközpontú Material Design Lite nyomon követése), amely a Material's jóság az Androidnak egyéni nézetek formájában, és az internetnek csomagok formájában, amelyek importálhatók és használhatók, mint a szabványos HTML címkéket.

Most, a Material Design negyedik évfordulójának előestéjén a Google a jelek szerint a következő generációját készíti elő. papír és tinta ihlette esztétika: Anyagtervezés 2. Értékes kevés információ érhető el nyilvánosan a Material Design 2-ről, amelynek létezését ezen a héten fedeztük fel a Chromium Gerrit új commitjai során. Nem állítjuk, hogy ez a megfelelő a legújabb Material Design keretrendszer utódja, de a kötelezettségvállalások észrevehető, bár finom változásokra utalnak a színpalettákban, az ikonográfiában és az érintőképernyő viselkedésében.


A Material Design 2 megjelenik a Chromium Gerritben

Február elején a Chromium Gerrit új commitjaival a "Material Design 2" UI-t implementálta a Chrome-ban. fülsáv – a húzható lapok, amelyek weboldalcímeket, kedvenc ikonokat és a „lap bezárása” gombot tartalmazzák a Chrome felett címsor.

A véglegesítések nem drasztikusak, de megváltoztatják a Chrome lapjainak megjelenését. Növelik a fülszalag magasságát; meghatározatlan módosítások végrehajtása a lapok tartalmi elrendezésén, különösen a címeken és a figyelmeztető jelzéseken; és csökkentse a fül érintési szélességét, miközben növeli a tabulátor normál szélességét. Ők kifejezetten ne módosíthatja a tabulátor figyelmeztetés jelző színeit, a tabulátor elválasztó színeit, az "új lap" gombot vagy bármely lap tipográfiáját.

Chrome-lapok gyűjteménye.

Nyilvánvaló, hogy a kötelezettségvállalások hivatkoznak a "Material Design 2" lap bezárása gomb ikonjára és "a Google Material Design 2-hez szükséges alapvető színállandókra".

Ha mélyebbre ásunk a véglegesítési kódban, új „Material Design 2” színpaletták jelennek meg a szürke, piros és vörös-sötét Chromium témákhoz, valamint új színek a normál Chrome eszköztárhoz és az inkognitóeszköztárhoz. Hexadecimális keresési táblázatot használtunk az RGB színminták létrehozásához:

A Material Design 2 piros színe kissé sötétebb mint a jelenlegi Material Designé Piros 800 (#C62828) és Piros 600 (#E53935), míg a szürke új árnyalatai (#3C4043, #5F6368, #BDC1C6, #F1F3F4) világosabb, kékes árnyalatúak. Az anyagkialakításban a hagyományos szürkék jelennek meg, ahol R=G=B, míg itt minden árnyalatnál B>G>R (de csak 1-4 a 255-ből).

Material Design 2-kompatibilis verziók A Chrome eszköztár sokkal világosabb lesz, mint a jelenlegi verziók – a jelenlegi szürkés színsémához képest majdnem fehér.

Íme egy gyors minta arról, hogyan fog kinézni az eszköztár az új színekkel:

Végül a véglegesítés hozzáad egy újat IsTouchOptimizedMaterial() zászlót a MaterialDesignController, amely érintésre optimalizált Material Design 2 elemekre utalhat. Január elején írtunk a Google azon törekvéséről, hogy javítsa a A Chrome webböngésző érintőképernyős támogatása a Chrome OS-eszközökön, és úgy tűnik, hogy ez a folytatása.

Például a véglegesítés azt mutatja, hogy az érintőképernyős eszközökön a Chrome SetStackedLayoutja „mindig engedélyezve. Alapértelmezés szerint, ha sok lapot nyit meg, a többi lap szélessége csökken, hogy megfeleljen a új lapok. A Chrome halmozott elrendezése megtartja az eredeti lapok szélességét, és új lapokat ad mögéjük.


A színek jelentősége az anyagtervezésben

Mit jelentenek tehát az új színek az anyagtervezés tágabb kontextusában?

Az anyagtervezés több, mint a rétegek, alkatrészek és elemek, valamint ezek egymáshoz viszonyított viselkedése. A Google tervezési motívumának központi eleme a nagy kontrasztú témák, az élénk színek és a merész kiemelések – ezek teszik ki a Material Design-kompatibilis alkalmazásokat a tömegből.

A Google nyújt mintát színpaletták úgy tervezték, hogy „jól működjenek együtt” a platformok között, és forrásszerzésre ösztönzi a fejlesztőket, akik kihasználják az előnyöket egy elsődleges alkalmazásszín – más néven „domináns” szín – az 500 különböző gyűjteményből színminták. (Gondoljon a „kékre”, „zöldre” vagy „lilára” és más alapszínekre.) Ha szükséges, másodlagos színt szereznek be a 700 színből álló kibővített kollekcióból. (kiegészítő színek a legfontosabb UI-elemekhez, analóg a kevésbé fontos UI-elemekhez, valamint harmadlagos szín a kezelőfelület egy részhalmazából 300).

A színek fontos szerepet játszanak az anyagtervezési hierarchiában. Az élénk színek fontosságukat sugallják – a kiemelkedő gombok és más interaktív elemek számára vannak fenntartva. A finomabb színek viszont vizuális érdeklődést kölcsönöznek a szövegmezők, folyamatjelző sávok, hivatkozások és a felhasználói felület egyéb részei kiemelésével.

Abból, amit a Material Design 2 színpalettájáról tudunk, a Google „elsődleges 500-as színmintái közül legalább néhány, például a Red 600 és 800 sötétebb, mint a Material Design elődei. De mások, mint a szürke, az ellenkező bánásmódban részesülnek... a Chrome lap makettjén látható szürke és fehér színminták hidegebb szürkeárnyalatos és magasabb kék értékek.


Jelenleg csak ennyit tudunk a Material Design 2-ről. De az elkövetések annak jelei lehetnek, hogy valami történik a színfalak mögött, és ha ez igaz, akkor előbb-utóbb többet megtudhatunk. A Google várhatóan márciusban leveszi az Android P-t, az Android következő nagyobb verzióját, és a Google I/O 2018 május 8-án kezdődik. Mindkettő kiváló lehetőség a Material Design 2-re.

Frissítés 2018.02.04.: Röviddel a cikk megjelenése után a kötelezettségvállalást priváttá tették, ami potenciálisan azt jelenti, hogy titokban kellett tartani. Folyamatosan ellenőrizni fogjuk a Chromium Gerrit változásait, és frissítjük ezt a cikket, ha találunk ilyeneket.