Paleta farieb
Pokiaľ ide o farebnú paletu Material Design, Google uprednostňuje systém „dvoch farieb“ s variantmi:
Napríklad ako na tejto fotografii. Vaša primárna farba by bola fialová a vaša sekundárna farba by bola azúrová. A potom pre ďalšie prvky vášho používateľského rozhrania by ste použili tieňové varianty fialovej a azúrovej, takže sa všetko spojí.
Toto Editor materiálového dizajnu je veľmi užitočný nástroj, ktorý vám pomôže zostaviť farebné variácie. Môžete tiež hľadať inšpiráciu od profesionálnych dizajnérskych agentúr UI / UX, ako sú napríklad Hlina alebo tento zoznam najlepšie hodnotené spoločnosti zaoberajúce sa webovým dizajnom v roku 2019.
Responzívne rozloženie mriežky
Pochopenie responzívneho rozloženia mriežky znamená pochopiť ako hustota pixelov a automatické prispôsobenie obrazovky funguje. Priemerný DPI telefónu s Androidom sa zväčša pohybuje niekde medzi 300 až 480 DPI.
Z tohto dôvodu bude obrazovka s rozlíšením 300 DPI zvyčajne schopná zobraziť až 4 stĺpce:
Zatiaľ čo obrazovka s rozlíšením 600 dpi zobrazí až 8 stĺpcov.
Medzi každým stĺpcom sú „odkvapy“, v podstate oblasti, ktoré každý stĺp oddeľujú. Takže na mobile s 360dp by bol každý žľab okolo 16dp.
Pochopenie DPI na obrazovke
Pri navrhovaní používateľského rozhrania, či už ide o systémové rozhranie alebo používateľské rozhranie vašej aplikácie, musíte brať do úvahy rôzne hustoty pixelov rôznych veľkostí telefónov. Tu je tabuľka najbežnejších rozlíšení obrazovky a hustoty pixelov:
Ako všeobecné pravidlo teda platí, že pri navrhovaní „globálnej“ témy alebo aplikácie a pri nesústredení sa na vytváranie tém pre jedno zariadenie by ste mali začínať s najmenšou hustotou. Je to preto, že ak začnete s dizajnom na 1x, musíte jednoducho vykonať merania v pixeloch a hodnoty zostanú rovnaké pre všetky DP.
Ak však navrhujete pre 3,5x, musíte všetky hodnoty vydeliť číslom 3,5, aby ste sa prispôsobili iným hustotám, a potom z výpočtu viacerých hodnôt DP bude len bolieť hlava.
Ďalšie tipy pre dizajn Android 10 UI / UX
Ak potrebujete vlastnú farbu pre komponenty motívu, ako sú rádiá, tlačidlá, začiarkavacie políčka atď., Mali by ste nie použite výkresy na zobrazenie rôznych stavov ( začiarknuté, kliknuté atď.) . Pretože keď použijete výkresy, stratíte natívne efekty Material Design (ako zvlnenie) ktoré Google rozsiahlo aktualizoval v systémoch Android 9 a Android 10.
Pri práci s materiálovým dizajnom obsahuje Google veľa dobrôt, ktoré môžete využiť, a budú s vašim UI / UX plynúť prirodzenejšie.
Tu je napríklad niekoľko kľúčových slov pre tematické komponenty so vstavanými prvkami Material Design a vaša aplikácia alebo UI / UX sa budú aj naďalej tešiť z natívneho správania systému a stavov používateľského rozhrania.
Tlačidlo s vlastnou farbou android: backgroundTint = '@ color / red' ----- Prepínač s vlastnou farbou android: buttonTint = '@ color / red' ----- Obrázky a ikony android: drawableTint = '@ color / red '----- ProgressBar s vlastnou farbou android: progressTint =' @ color / red '
Ak chcete zobraziť jednoduchý tieň pod komponentmi, napríklad v režime cardview, stačí použiť vlastnosť nadmorskej výšky.
android: elevation = '1dp'
Zlúčenie značiek a nadradených vlastností je mimoriadne užitočné, aby vám poskytlo lepšiu kontrolu a správu súborov XML.
Animované zmeny rozloženia môžu skutočne vylepšiť vaše UX a takmer všetky ViewGroup to budú rešpektovať. Takže kedykoľvek dôjde k zmene v hierarchii zobrazení, príde s animáciou. S trochou know-how môžete aj navrhnúť vlastné prechodové efekty .
android: animateLayoutChanges = 'true'Značky Android Rozvoj 4 minúty prečítané
