Programerji in razvijalci na splošno niso oblikovalci - to je splošno sprejeto kot resnično. Razvijalci so ponavadi osredotočeni na to, da aplikacijo delajo - oblikovalci se osredotočajo na to, da aplikacijo naredijo estetsko privlačno . Toda zakaj razvijalci ne morejo storiti enako?

Nazaj na dan, ko sta bili animirani ciljni strani in domišljijske postavitve stvar, potem vsekakor, je bilo smiselno najeti profesionalnega oblikovalca. Toda trend je danes minimalen - ali vsaj močno poenostavljen.

Naj navedem kakšen anekdotičen primer - nekaj časa nazaj me je nekdo vprašal, naj ustvarim zaslonski zaslon za njihovo računalniško programsko opremo. Tako sem šel vse skupaj - narisal sem ga na skic papirju, ga uvozil v PhotoShop, ustvaril veliko čudovitih neonskih linij in učinkov. Lahko bi bila ozadje namizja, ne pa zaslonski zaslon. Bistvo je, da sem zanje ustvaril res izmišljen in izpopolnjen dizajn.

Kot verjetno ugibate, jim ni bilo všeč. Dizajn, ki so ga šli, je bil dobesedno majhen logotip nekaj prekrivajočih se barvnih krogov in ime programske opreme pod njim. Všeč mi je, da sta dve minuti opravila v programu PhotoShop. In veste kaj? Nekako sem se moral strinjati, da je boljše od mojega.

Bistvo tega sem - mislim, da programerji sodijo v to past, da sem naredil isto napako kot jaz. Običajno razmišljamo o uporabniških vmesnikih in zaslonskih brskalnikih, ki morajo biti te res čudovite, privlačne stvari, zaradi katerih aplikacija izstopa . Ampak ne bi smeli biti - iskreno, ne bi smeli biti. Morali bi vzeti miselnost programerja in ga uporabiti za estetsko oblikovanje - preprosto, funkcionalno, deluje.

V tem članku si bomo ogledali nekaj zelo preprostih načinov za ustvarjanje elegantnega Android APP UI / UX, tudi če skoraj nimate izkušenj z oblikovanjem.

Razen če si resnično želite nekaj drugega, se držite materiala

Aplikaciji ni treba biti " edinstvena" in " izstopati od ostalih", da bi bila priljubljena in izgledala dobro. To si je zastavil Googlov material Design - standard za uporabniški vmesnik aplikacij v celotni panogi in dobro so opravili svoje delo. Obstaja vrsta priljubljenih aplikacij, ki se držijo materiala Design - nekatera največja imena v aplikacijah za Android, kot so SwiftKey, Nova Launcher, Textra SMS, YouTube, če naštejemo le nekaj.

Osrednji poudarek materiala Design je na kartični postavitvi s trdno barvno paleto. Google je sodeloval z vrhunskimi oblikovalci industrije, črpal veliko elementov iz minimalističnih oblikovalskih praks, nato pa je celotno stvar brezplačno izdal - to je precej dober posel, saj lahko tečaji za oblikovanje spletnih strani in aplikacij porabijo več sto dolarjev za e-knjige, videoposnetke, itd.

Začetek z Material Design je neverjetno enostaven, poleg tega pa obstaja kar nekaj orodij, ki omogočajo še enostavnejšo uporabo, ki jih bomo našli spodaj:

• Urejevalnik tematskih materialov (macOS + skica)
• Vtičnik Barvna paleta materiala (PhotoShop / Illustrator)
• Material Design UI Kit PSD (PhotoShop)
• Uporabniški vmesnik Android Design Design ( skica)
• Ustvarjalnik uporabniških tem za material

In če potrebujete nekaj navdiha za ustvarjanje preprostih, elegantnih tematik Material Design, si oglejte te bloge s seznami:

• MaterialDesignBlog - 15 odličnih primerov oblikovanja materialov, narejenih pravilno
• MockPlus - 12 najboljših primerov oblikovanja spletnih strani za risanje navdiha
• AndroidAuthority - 10 najboljših aplikacij Material Design za Android

Barvni gradienti so način lažji, kot si mislite

Za alternativo Material Design so nakloni dolorjev preprosti, trendni in privlačni za oči. In morda bi pomislili, da oblikovalci porabijo veliko časa za slikanje v vseh barvah ali oblikovanje končnega gradienta. Motili bi se - v PhotoShopu je to mogoče storiti v 10 sekundah.

10 sekund v uporabniškem vmesniku gradientov PhotoShop.

Tudi jaz vas bom sprehodil skozi to, da vam bom pokazal, kako enostavno je.

Ustvarite nov projekt PS za mobilne naprave ( 1080 x 1920 px @ 72 ppi deluje dobro)

UIGradients.com - Velika zbirka že izdelanih gradientov.

Pojdite na UIGradients.com in poiščite nekaj, kar vam je všeč.

Kopirajte barvne šestnajstih vrednosti iz UIGradientov

Kopirajte gradientne barve od zgoraj predogleda.

Izbirnik gradientov PhotoShop.

Z desno miškino tipko kliknite prazen sloj v PS-ju in pojdite na Možnosti mešanja> Preliv z gradivom.

Kliknite neposredno na predogled gradientnega gradiva v spustnem meniju - ne kliknite na spustni gumb. S klikom neposredno na gradient odprete urejevalnik barv.

Vnesite šestkotne vrednosti iz UIGradienta v gradientno gradivo PS.

Zdaj samo prilepite vrednosti barvnih šestnajstih vrednosti iz UIGradienta v urejevalnik gradientov PS.

Po potrebi prilagodite. Zdaj imate profesionalno gradientno ozadje za aplikacijo za Android.

Druga orodja za gradient, ki jih je vredno preveriti:

• WebGradients.com
• Android Shapes Generator ( za ustvarjanje oblik prek XML, z možnostjo naklona)

Uporabite SVG namesto JPG / PNG

Namesto da za svoje grafične elemente (gumbe, logotipe itd.) Uporabljate PNG ali JPG, bi morali namesto tega uporabljati SVG ( Scalable Vector Graphics) . To je zato, ker je mogoče spremeniti velikost SVG-jev, ne da bi pri tem izgubili kakovost - če na primer JPG povečate na večjo vrednost, izgubi kakovost in postane zamegljen / slikovit. SVG ne. Ljudje poskušajo uporabiti ogromne datoteke PNG, ki jih je mogoče pomanjšati, da se prilegajo zaslonom Android - ko lahko namesto tega uporabite manjše SVG-je, ki so nadgrajeni brez večje izgube kakovosti.

Poleg tega so SVG-ji lahko do 60% do 80% manjši od datoteke PNG . To pomeni, da se bo vaša aplikacija ali mobilno spletno mesto za uporabnika naložilo hitreje in bo videti dobro, ne glede na ločljivost zaslona.

Vključite temen način z uporabo Theme.AppCompat.DayNight

Ni vam treba oblikovati dveh ločenih tem, da v svojo aplikacijo vključite temo temnega / nočnega načina. Kar precej je vgrajena v knjižnico AppCompat, le omogočiti jo morate in urediti vrednosti.

Glejte Vodič za Appual "Kako izvajati temen način v aplikaciji za Android".

Uporabite predlogo ali komplet za mobilni vmesnik

Če vaša aplikacija ne zahteva domišljijskega, prilagojenega GUI-ja, z uporabo predloge ali kompleta ni nič narobe. Predloge in kompleti se lahko uporabijo kot navdihujoče vodilo ali pa dobesedno samo uporabite predlogo / komplet, kakršen je, in dodate svoje gumbe in stvari.

Nekaj ​​odličnih virov za predloge in komplete za uporabniški vmesnik Android:

• SpeckyBoy - 50 brezplačnih mobilnih uporabniških vmesnikov za iOS in Android
• SketchAppSources - Viri aplikacij za Android UI ( Sketch)
• Freebiesbug - PSD UI kompleti ( PhotoShop)