Používateľské rozhranie Material Design spoločnosti Google sa vylepšuje novými farbami, ikonografiou a zameraním na dotyk

click fraud protection

Zdá sa, že nové záväzky v prehliadači Chromium Gerrit odkazujú na „Material Design 2“, čo môže byť nová a vylepšená verzia jazyka Material Design spoločnosti Google.

Material Design, jednotný dizajnový jazyk, ktorý bol uvedený na trh spolu so systémom Android Lollipop, ponúka ploché pastelové farebné palety, hĺbku, jemné osvetlenie a realistickú fyziku. Má napodobňovať hmatateľnosť objektov reálneho sveta bez uchyľovania sa k skeuomorfizmu; Google to popisuje ako syntézu „klasických princípov“ s „inováciou a možnosťou“ technológie.

Od debutu Material Design v roku 2014 sa v ekosystéme Androidu šíri ako požiar – nehovoriac o aplikáciách Google, ako sú YouTube, Chrome, Gmail, Hangouts a Kalendár Google. Plávajúce akčné tlačidlá, príjemné farby a techniky elevácie boli sprístupnené ako súčasť Knižnica materiálových komponentov na GitHub (v nadväznosti na knižnicu podpory dizajnu pre Android a webovú stránku Material Design Lite od Googlu), ktorá prináša dobré pre Android vo forme vlastných zobrazení a pre web vo forme balíkov, ktoré možno importovať a používať ako štandardné HTML značky.

Teraz, v predvečer štvrtého výročia Material Designu, sa zdá, že Google pripravuje jeho ďalšiu generáciu inšpirované papierom a atramentom estetický: Materiálové prevedenie 2. O Material Design 2, ktorého existenciu sme odhalili tento týždeň v nových záväzkoch v Chromium Gerrit, je verejne dostupných len veľmi málo informácií. Netvrdíme, že ide o a riadne nástupca najnovšieho rámca Material Design, ale záväzky poukazujú na viditeľné, aj keď jemné zmeny vo farebných paletách, ikonografii a správaní dotykovej obrazovky.


Material Design 2 sa zobrazí v prehliadači Chromium Gerrit

Začiatkom februára boli v prehliadači Chrome implementované nové záväzky v používateľskom rozhraní prehliadača Chromium Gerrit „Material Design 2“. pás kariet – presúvateľné karty obsahujúce názvy webových stránok, ikony favicon a tlačidlo „zatvoriť kartu“ nad adresný riadok.

Potvrdenia nie sú drastické, ale urobia zmeny vo vzhľade kariet prehliadača Chrome. Zvyšujú výšku pásika; vykonávať nešpecifikované vylepšenia rozloženia obsahu kariet, konkrétne názvov a indikátorov upozornení; a zmenšiť šírku dotyku karty a zároveň zväčšiť štandardnú šírku karty. Oni výslovne nie upraviť farby indikátora výstrahy karty, farby oddeľovača kariet, tlačidlo „nová karta“ alebo akúkoľvek typografiu kariet.

Zbierka kariet prehliadača Chrome.

Je zjavné, že záväzky odkazujú na ikonu tlačidla zatvorenia karty „Material Design 2“ a „základné farebné konštanty požadované pre Google Material Design 2“.

Ak sa hlbšie ponoríte do kódu odovzdania, zobrazia sa nové farebné palety „Material Design 2“ pre sivé, červené a červeno-tmavé motívy Chromium a nové farby pre štandardný panel nástrojov Chrome a panel nástrojov inkognito. Na generovanie vzorkovníkov RGB sme použili hexadecimálnu vyhľadávaciu tabuľku:

Material Design 2 je červená trochu tmavšie než súčasný Material Design Červená 800 (#C62828) a Červená 600 (#E53935), zatiaľ čo nové odtiene sivej (#3C4043, #5F6368, #BDC1C6, #F1F3F4) majú svetlejší, modrastý odtieň. Materiálové prevedenie obsahuje tradičné šedé, kde R=G=B, zatiaľ čo tu B>G>R pri každom odtieni (ale len o 1-4 z 255).

Verzie Chrome kompatibilné s Material Design 2 budú tiež obsahovať oveľa jasnejší panel s nástrojmi ako súčasné zostavy – v porovnaní so súčasnou sivastou farebnou schémou je takmer biely.

Tu je rýchly model toho, ako bude panel s nástrojmi vyzerať s novými farbami:

Nakoniec odovzdanie pridá nový IsTouchOptimizedMaterial() vlajka do MaterialDesignController, čo môže odkazovať na prvky Material Design 2 optimalizované na dotyk. Začiatkom januára sme písali o snahe Google vylepšiť Podpora dotykovej obrazovky webového prehliadača Chrome na zariadeniach so systémom Chrome OS a zdá sa, že je jej pokračovaním.

Potvrdenie napríklad ukazuje, že na zariadeniach s dotykovou obrazovkou bude SetStackedLayout prehliadača Chrome „vždy povolené.“ V predvolenom nastavení, keď otvoríte veľa kariet, šírky ostatných kariet sa zmenší, aby sa prispôsobili nové karty. Skladané rozloženie prehliadača Chrome zachováva pôvodné šírky kariet a pridáva nové karty za ne.


Význam farieb v materiálovom dizajne

Čo teda znamenajú nové farby v širšom kontexte Material Designu?

Material Design je viac než len o vrstvách, komponentoch a prvkoch a o tom, ako sa správajú vo vzťahu k sebe navzájom. Ústredným motívom dizajnu Google sú vysoko kontrastné motívy, jasné farby a výrazné zvýraznenia – vďaka nim aplikácie vyhovujúce Material Design vyčnievajú z davu.

Google poskytuje vzorku farebné palety navrhnuté tak, aby „dobre spolupracovali“ naprieč platformami, a povzbudzuje vývojárov, ktorí využívajú výhody pri získavaní zdrojov primárna farba aplikácie – inak známa ako „dominantná“ farba – zo zbierky 500 rôznych farieb vzorkovníkov. (Myslite na „modrú“, „zelenú“ alebo „fialovú“ a ďalšie základné farby.) V prípade potreby získajú sekundárnu farbu z rozšírenej kolekcie 700 farieb (doplnkové farby pre najdôležitejšie prvky používateľského rozhrania a analogické pre menej dôležité prvky používateľského rozhrania a terciárna farba z podmnožiny 300).

Farba hrá dôležitú úlohu v hierarchii Material Design. Jasné farby naznačujú dôležitosť - sú vyhradené pre výrazné tlačidlá a iné interaktívne prvky. Jemnejšie farby na druhej strane pridávajú vizuálny záujem zvýraznením textových polí, indikátorov priebehu, odkazov a iných častí používateľského rozhrania.

Z toho, čo vieme o farebnej palete Material Design 2, je prinajmenšom niekoľko vzorkovníkov v „primárnej 500-ke“ Google, ako je červená 600 a 800, tmavších ako ich predchodcovia Material Design. Ale iní, ako napríklad sivá, majú opačné zaobchádzanie -- Vzorky šedej aj bielej farby zobrazené v modeli karty Chrome majú chladnejšie odtiene sivej a vyššie hodnoty modrej.


Práve to je všetko, čo o Material Design 2 skutočne vieme. Záväzky však môžu byť znakom toho, že sa v zákulisí niečo deje, a ak je to pravda, možno sa skôr alebo neskôr dozvieme viac. Očakáva sa, že Google stiahne Android P, ďalšiu hlavnú verziu Androidu, už v marci a Google I/O 2018 sa začne 8. mája. Obidve sú hlavnými príležitosťami na to, aby ste si zabalili do Material Design 2.

Aktualizácia 4. 2. 2018: Krátko po zverejnení tohto článku bol záväzok súkromný, čo potenciálne znamená, že mal byť utajený. Naďalej budeme kontrolovať zmeny v prehliadači Chromium Gerrit a ak nejaké nájdeme, aktualizujeme tento článok.