„Google“ materialaus dizaino vartotojo sąsaja atnaujinama – naujos spalvos, ikonografija ir dėmesys prisilietimui

click fraud protection

Atrodo, kad nauji „Chromium Gerrit“ įsipareigojimai yra susiję su „Material Design 2“, kuri gali būti nauja ir patobulinta „Google“ medžiagų dizaino kalbos versija.

Material Design – vieninga dizaino kalba, paleista kartu su „Android Lollipop“, pasižymi plokščiomis, pastelinėmis spalvų paletėmis, gyliu, švelniu apšvietimu ir tikroviška fizika. Jis skirtas imituoti realaus pasaulio objektų taktiliškumą, nesiimant skeuomorfizmo; „Google“ tai apibūdina kaip „klasikinių principų“ ir technologijos „[naujovių ir galimybių“] sintezę.

Nuo „Material Design“ debiuto 2014 m. jis išplito visoje „Android“ ekosistemoje kaip gaisras, jau nekalbant apie „Google“ programas, tokias kaip „YouTube“, „Chrome“, „Gmail“, „Hangout“ ir „Google“ kalendorius. Slankiojantys veiksmo mygtukai, malonios spalvos ir pakilimo būdai buvo prieinami kaip dalis Medžiagų komponentų biblioteka „GitHub“ („Android“ dizaino palaikymo bibliotekos ir „Google“ žiniatinkliui skirtos „Material Design Lite“) tęsinys, kuriame pateikiama „Material“ gerumas „Android“ tinkintų rodinių forma ir žiniatinkliui kaip paketai, kuriuos galima importuoti ir naudoti kaip standartinį HTML žymės.

Atrodo, kad dabar, ketvirtojo „Material Design“ metinių išvakarėse, „Google“ ruošia naujos kartos įkvėptas popieriaus ir rašalo estetinė: Medžiagos dizainas 2. Viešai prieinama mažai vertingos informacijos apie Material Design 2, apie kurios egzistavimą šią savaitę atskleidėme naujuose Chromium Gerrit įsipareigojimuose. Mes neteigiame, kad tai a tinkamas yra naujausios „Material Design“ sistemos įpėdinis, tačiau įpareigoja pastebimus, nors ir subtilius, spalvų palečių, ikonografijos ir jutiklinio ekrano elgsenos pokyčius.


Material Design 2 rodomas Chromium Gerrit

Vasario pradžioje nauji įsipareigojimai „Chromium Gerrit“ įdiegė „Material Design 2“ vartotojo sąsają „Chrome“ skirtukų juosta – velkamieji skirtukai su tinklalapių pavadinimais, mėgstamiausiais piktogramomis ir mygtuku „uždaryti skirtuką“ virš „Chrome“ adreso juosta.

Įsipareigojimai nėra drastiški, tačiau keičia „Chrome“ skirtukų išvaizdą. Jie padidina skirtuko juostelės aukštį; atlikti neapibrėžtus koregavimus skirtukų turinio išdėstyme, ypač pavadinimuose ir įspėjimų indikatoriuose; ir sumažinkite skirtuko prisilietimo plotį, padidindami standartinį skirtuko plotį. Jie aiškiai nedaryk keisti skirtukų įspėjimo indikatoriaus spalvas, skirtukų skyriklio spalvas, mygtuką „naujas skirtukas“ arba bet kokią skirtukų tipografiją.

„Chrome“ skirtukų rinkinys.

Akivaizdu, kad įsipareigojimuose daroma nuoroda į skirtuko „Material Design 2“ uždarymo mygtuko piktogramą ir „pagrindines spalvų konstantas, reikalingas Google Material Design 2“.

Gilinantis į įpareigojimo kodą, rodomos naujos „Material Design 2“ spalvų paletės, skirtos pilkai, raudonai ir raudonai tamsiai „Chromium“ temoms, ir naujos spalvos standartinei „Chrome“ įrankių juostai ir inkognito įrankių juostai. RGB pavyzdžiams generuoti naudojome šešioliktainę paieškos lentelę:

Material Design 2 raudona yra šiek tiek tamsesnis nei dabartinis medžiagų dizainas Raudona 800 (#C62828) ir Raudona 600 (#E53935), o nauji pilki atspalviai (#3C4043, #5F6368, #BDC1C6, #F1F3F4) turi šviesesnį, melsvą atspalvį. Medžiagos dizainas pasižymi tradicine pilka spalva, kur R=G=B, o čia B>G>R kiekviename atspalvyje (bet tik 1-4 iš 255).

Su Material Design 2 suderinamos versijos „Chrome“ taip pat turės daug ryškesnę įrankių juostą nei dabartinės versijos – ji beveik balta, palyginti su dabartine pilkšvų spalvų schema.

Štai trumpas maketas, kaip įrankių juosta atrodys naudojant naujas spalvas:

Galiausiai įsipareigojimas prideda naują IsTouchOptimizedMaterial() vėliava prie MaterialDesignController, kuris gali reikšti jutikliniu būdu optimizuotus „Material Design 2“ elementus. Sausio pradžioje rašėme apie „Google“ pastangas tobulinti „Chrome“ žiniatinklio naršyklės jutiklinio ekrano palaikymas „Chrome“ OS įrenginiuose ir atrodo, kad tai yra jo tęsinys.

Pavyzdžiui, įsipareigojimas rodo, kad jutiklinio ekrano įrenginiuose „Chrome“ „SetStackedLayout“ bus „visada įjungtas.' Pagal numatytuosius nustatymus, kai atidarote daug skirtukų, kitų skirtukų pločiai susitraukia, kad atitiktų nauji skirtukai. „Chrome“ sudėtinis išdėstymas išlaiko pradinį skirtukų plotį, o už jų pridedami nauji skirtukai.


Spalvos svarba medžiagų dizaine

Taigi, ką naujos spalvos reiškia platesniame medžiagų dizaino kontekste?

Medžiagų dizainas yra daugiau nei tik sluoksniai, komponentai ir elementai bei tai, kaip jie elgiasi vienas kito atžvilgiu. Pagrindinis „Google“ dizaino motyvas yra didelio kontrasto temos, ryškios spalvos ir ryškūs akcentai – būtent dėl ​​jų su Material Design suderinamos programos išsiskiria iš kitų.

Google pateikia pavyzdį spalvų paletės sukurta taip, kad „gerai dirbtų kartu“ įvairiose platformose, ir skatina kūrėjus, kurie naudojasi šaltiniais pagrindinė programos spalva – kitaip dar vadinama „dominuojančia“ spalva – iš 500 skirtingų kolekcijos pavyzdžiai. (Pagalvokite apie „mėlyną“, „žalią“ arba „violetinę“ ir kitas pagrindines spalvas.) Jei reikia, jie gauna antrinę spalvą iš išplėstos 700 spalvų kolekcijos. (papildomos spalvos svarbiausiems UI elementams ir analogiškos mažiau svarbiems UI elementams ir tretinė spalva iš poaibio 300).

Spalva vaidina svarbų vaidmenį medžiagų dizaino hierarchijoje. Ryškios spalvos rodo svarbą – jos skirtos ryškiems mygtukams ir kitiems interaktyviems elementams. Kita vertus, subtilesnės spalvos suteikia vizualinio įdomumo, akcentuodamos teksto laukus, eigos juostas, nuorodas ir kitas vartotojo sąsajos dalis.

Iš to, ką žinome apie „Material Design 2“ spalvų paletę, bent keli „Google“ pirminio 500 pavyzdžiai, tokie kaip Red 600 ir 800, yra tamsesni nei jų pirmtakai Material Design. Tačiau su kitais, pavyzdžiui, pilkais, elgiamasi priešingai – tiek pilkos, tiek baltos spalvos pavyzdžiai, rodomi „Chrome“ skirtuko makete, turi šaltesnę pilkos spalvos toną ir didesnes mėlynos spalvos vertes.


Šiuo metu tai viskas, ką mes tikrai žinome apie Material Design 2. Tačiau įsipareigojimai gali būti ženklas, kad kažkas vyksta užkulisiuose, ir jei tai tiesa, galbūt anksčiau nei vėliau sužinosime daugiau. Tikimasi, kad „Google“ kovo mėnesį pradės veikti „Android P“, kitos pagrindinės „Android“ versijos, o „Google I/O 2018“ prasidės gegužės 8 d. Abi yra puikios galimybės atsikratyti Material Design 2.

Atnaujinimas 2018-02-04: Netrukus po šio straipsnio paskelbimo įsipareigojimas buvo paskelbtas privačiu, o tai gali reikšti, kad jis turėjo būti laikomas paslaptyje. Nuolat tikrinsime, ar „Chromium Gerrit“ nėra pakeitimų, ir atnaujinsime šį straipsnį, jei tokių rasime.