Paleta boja
Za paletu boja Material Design, Google preferira sustav u dvije boje s varijantama:
Tako na primjer, kao na ovoj fotografiji. Vaša bi primarna boja bila ljubičasta, a sekundarna bi bila cijan. A onda biste za ostale elemente korisničkog sučelja koristili varijante sjene ljubičaste i cijan boje, tako da se sve kombinira.
Ovaj Urednik dizajna materijala je vrlo koristan alat koji vam pomaže da sastavite varijacije boja. Inspiraciju možete potražiti i u profesionalnim agencijama za dizajn UI / UX-a Glina , ili ovaj popis najbolje ocijenjene tvrtke za web dizajn u 2019.
Prilagodljiv raspored mreže
Razumijevanje responzivnog rasporeda mreže znači razumijevanje kako gustoća piksela i radi automatska prilagodba zaslona. Uglavnom je prosječni DPI za Android telefon negdje između 300 i 480 DPI.
Imajući to na umu, zaslon od 300 DPI obično će moći prikazati do 4 stupca:
Dok će zaslon s 600 dpi prikazati do 8 stupaca.
Između svakog stupca nalaze se 'žljebovi', u osnovi područja koja odvajaju svaki stupac. Tako bi na mobitelu s 360dp svaki oluk bio oko 16dp.
Razumijevanje DPI zaslona
Prilikom dizajniranja korisničkog sučelja, bilo da se radi o korisničkom sučelju sustava ili korisničkom sučelju vaše aplikacije, morate uzeti u obzir različite gustoće piksela različitih veličina telefona. Evo tablice najčešćih razlučivosti zaslona i gustoće piksela:
Dakle, kao pravilo, prilikom dizajniranja „globalne“ teme ili aplikacije i ne fokusiranja na stvaranje tema za jedan uređaj, trebali biste započeti s najmanjom gustoćom. To je zato što ako svoj dizajn započnete s 1x, jednostavno morate mjeriti u pikselima, a vrijednosti će ostati iste za DP-ove.
Međutim, ako dizajnirate za 3,5x, trebate podijeliti sve vrijednosti s 3,5 za prilagodbu drugim gustoćama, a to onda postaje glavobolja izračunavanja višestrukih DP vrijednosti.
Dodatni savjeti za dizajn Android 10 UI / UX
Ako vam je potrebna prilagođena boja za komponente teme kao što su radio, gumbi, potvrdni okviri itd., Trebali biste ne koristiti crtaće za prikaz različitih stanja ( provjereno, kliknuto itd.) . Jer kada koristite crtaće, gubite izvorne efekte Materijalnog dizajna (poput mreškanja) koje je Google opsežno ažurirao u sustavima Android 9 i Android 10.
Kada radite s Materijalnim dizajnom, Google uključuje puno dodataka koje možete iskoristiti, a prirodnije će teći uz vaš UI / UX.
Tako, na primjer, evo nekoliko ključnih riječi za tematske komponente s ugrađenim elementima Materijalnog dizajna, a vaša aplikacija ili UI / UX i dalje će uživati u ponašanju izvornog sustava i UI stanjima.
Gumb s prilagođenom bojom android: backgroundTint = '@ color / red' ----- Radio tipka s prilagođenom bojom android: buttonTint = '@ color / red' ----- Slike i ikone android: drawableTint = '@ color / crvena '----- ProgressBar s prilagođenom android bojom u boji: progressTint =' @ color / red '
Da biste prikazali jednostavnu sjenu ispod komponenata, kao u načinu prikaza karte, samo trebate koristiti svojstvo elevacije.
android: elevacija = '1dp'
Spajanje oznaka i roditeljskih svojstava izuzetno je korisno kako bi vam pružili bolju kontrolu i upravljanje XML datotekama.
Animirane promjene izgleda stvarno mogu poboljšati vaš UX, a gotovo svi ViewGroup to će poštivati. Dakle, kad god dođe do promjene u hijerarhiji prikaza, ona će doći s animacijom. Uz malo znanja, možete i dizajnirati prilagođeni efekti prijelaza .
android: animateLayoutChanges = 'true'Oznake android Razvoj 4 minute čitanja
