Programeri i programeri obično nisu dizajneri - to je široko prihvaćeno kao istina. Programeri imaju tendenciju da se fokusiraju na upotrebu aplikacije - dizajneri se fokusiraju na to da aplikaciju učine estetski privlačnom . Ali zašto programeri ne mogu učiniti isto?

Povratak dana, kad su animirani odredišne ​​stranice i fantastični izgledi bili stvar, onda sigurno, imalo je smisla zaposliti profesionalnog dizajnera. No, trend je danas minimalan - ili barem znatno pojednostavljen.

Dopustite mi da vam dam jedan anegdotski primjer - neko vrijeme unazad, neko me je zamolio da napravim zaslon za prskanje za njihov PC softver. Dakle, sve sam napustio - nacrtao sam ga na papiru za skicu, uveo u PhotoShop, stvorio puno fantastičnih neonskih linija i efekata. To bi mogla biti radna pozadina radije nego zaslon za prskanje. Poanta je u tome što sam za njih stvorio taj vrlo maštovit i istančan dizajn.

Kao što vjerojatno možete pretpostaviti, nije im se svidjelo. Dizajn s kojim su išli je doslovno mali logotip nekoliko preklopljenih obojenih krugova, a naziv softvera ispod njega. Kao, dvije minute u PhotoShopu. I znate što? Nekako sam se morao složiti da je to bolje nego moje.

Dakle, stvar koju radim je - mislim da programeri upadaju u ovu zamku čineći istu grešku kao i ja. Skloni smo razmišljanju korisničkih sučelja i zaslona za prskanje koji trebaju biti ove stvarno fantastične, privlačne stvari zbog kojih se aplikacija ističe . Ali ne moraju biti - iskreno, ne bi trebali biti. Trebali bismo uzeti u obzir programera i primijeniti ga na estetski dizajn - jednostavno, funkcionalno.

U ovom ćemo članku razmotriti nekoliko vrlo jednostavnih načina za stvaranje elegantnog Android APP UI / UX-a, čak i ako gotovo nemate iskustva u dizajniranju.

Osim ako stvarno ne želite nešto drugo, pridržavajte se dizajna materijala

Vaša aplikacija ne mora biti " jedinstvena" i " izdvojiti se od ostalih" kako bi bila popularna i izgledala dobro. To je cilj postigao Googleov materijalni dizajn - standard za korisničko sučelje aplikacija u cijeloj industriji i oni su napravili dobar posao. Postoji mnoštvo popularnih aplikacija koje se drže materijala Dizajn - neka od najvećih imena u Androidovim aplikacijama, poput SwiftKey, Nova Launcher, Textra SMS-a, YouTubea, samo nekoliko imena.

Glavni fokus materijala u dizajnu je na kartografskom izgledu, s solidnom paletom boja. Google je surađivao s vrhunskim dizajnerima iz industrije, crpio je puno elemenata iz minimalističkih dizajnerskih praksi, a zatim je čitavu stvar izdao besplatno - to je prilično dobra ponuda, budući da tečajevi dizajniranja web stranica i aplikacija mogu prikupiti stotine dolara za e-knjige, videozapise, itd

Početak s dizajnom materijala nevjerojatno je jednostavan, a postoji pregršt alata koji ga čine još jednostavnijim, a koji ćemo navesti u nastavku:

• Uređivač tema materijala (macOS + skica)
• Dodatak za paletu boja dizajna materijala (PhotoShop / Illustrator)
• Uređaj za prilagođavanje materijala PSD (PhotoShop)
• Android UI komplet za dizajn materijala ( skica)
• Generator tema sučelja materijala

A ako vam treba malo inspiracije za stvaranje jednostavnih, elegantnih tema dizajna materijala, pogledajte ove blogove s popisa:

• MaterialDesignBlog - 15 sjajnih primjera dizajna materijala izveden pravilno
• MockPlus - 12 primjera web stranica za najbolji dizajn materijala za crtanje nadahnuća
• AndroidAuthority - 10 najboljih aplikacija Material Design za Android

Gradienti u boji su lakši nego što mislite

Kao alternativa Materijalnom dizajnu, gradijenti dolor-a su jednostavni, trendi i privlačni. A možda ćete pomisliti da dizajneri provode puno vremena slikajući se u svim bojama ili dizajnirajući konačni gradijent. Bili ste u krivu - to se može učiniti za 10 sekundi u PhotoShopu.

10 sekundi u korisničkom sučelju gradijenta PhotoShop.

Čak ću vas provesti kroz ovo da vam pokažem koliko je lako.

Izradite novi PS projekt za mobilne uređaje ( 1080 x 1920 px @ 72 ppi radi dobro)

UIGradients.com - Velika kolekcija gotovih gradijenata.

Otiđite na UIGradients.com i pronađite nešto što vam se sviđa.

Kopirajte heksade vrijednosti boje s UIGradients

Kopirajte gradijentne boje odozgo na pregled.

Birač gradijenta PhotoShop.

Desnom tipkom miša kliknite prazan sloj u PS-u i idite na Opcije miješanja> Prekrivanje gradijenata.

Kliknite direktno na pregled gradijenta u padajućem izborniku - ne kliknite padajući gumb. Klikom izravno na gradijent otvara se uređivač boja.

Unesite šesterokutne vrijednosti iz UIGradienta u alat za gradijent PS.

Sada samo zalijepite ljepljive vrijednosti boje s UIGradient-a u uređivač gradijenta PS.

Prilagodite prema potrebi. Sada imate profesionalnu pozadinu gradijenta za svoju aplikaciju za Android.

Ostali alati za gradijent vrijedi provjeriti:

• WebGradients.com
• Android Oblik oblika ( za generiranje oblika putem XML-a, s mogućnošću gradijenta)

Koristite SVG umjesto JPG / PNG

Umjesto da za svoje grafičke elemente (gumbe, logotipe itd.) Upotrebljavate PNG ili JPG, stvarno biste umjesto toga trebali koristiti SVG ( Scalable Vector Graphics) . To je zato što se SVG-ovima može promijeniti veličina bez gubitka kvalitete - na primjer, ako JPG povećate na veću vrijednost, on gubi na kvaliteti i postaje zamagljen / pikseliziran. SVG ne. Ljudi pokušavaju koristiti ogromne PNG datoteke koje će se smanjiti kako bi se uklapale u Android ekrane - kad umjesto toga možete koristiti manje SVG datoteke koje su povećane bez ikakvog gubitka u kvaliteti.

Nadalje, SVG datoteke mogu biti i do 60% do 80% manje datoteke od PNG . To znači da će se vaša aplikacija ili web lokacija za korisnike brže učitati, a izgledat će dobro bez obzira na rezoluciju zaslona.

Uključite tamni način upotrebe Theme.AppCompat.DayNight

Ne morate dizajnirati dvije odvojene teme kako biste u svoju aplikaciju uključili temu mračnog / noćnog načina. Njegova je prilično ugrađena u biblioteku AppCompat, samo je morate omogućiti i urediti vrijednosti.

Pogledajte Appualov vodič "Kako implementirati tamni način u svoju Android aplikaciju".

Koristite predložak ili mobilni UI komplet

Ako vaša aplikacija ne zahtijeva domišljati, prilagođeni GUI, nema apsolutno ništa loše s korištenjem predloška ili kompleta. Predlošci i kompleti mogu se koristiti kao nadahnjujuća smjernica ili možete doslovno samo koristiti predložak / kit kakav je, dodajući vlastite gumbe i stvari.

Neke sjajne resurse za predloške i komplete za Android UI:

• SpeckyBoy - 50 besplatnih mobilnih korisničkih sučelja za iOS i Android
• SketchAppSources - Resursi za Android UI aplikacije ( Sketch)
• Freebiesbug - PSD UI setovi ( PhotoShop)