Početak s dizajnom UX / UI aplikacija

Prvi koraci za neiskusne ili ne-dizajnere u svijet mobilnih aplikacija

Dizajn korisničkog iskustva (UX) i korisničkog sučelja (UI) danas su trendovi pojmova. Na isti način, stvaranje aplikacija trenutno je jedno od najatraktivnijih tržišta za programere, dizajnere i digitalne stvaratelje u cijelom svijetu. Razlog je jasan: pametni telefoni su sveprisutni i potencijalna upotreba aplikacija je beskonačna.

Samo će dobro dizajnirane aplikacije zadržati pažnju kupca i tako stvoriti vrijednost za korisnika. To je osnova za većinu poslovnih modela, od onoga što ćemo očekivati.

Ikone aplikacija iz mrežnih izvora Material Design

Kad se suočite s prvim dizajnom aplikacija, morat ćete razumjeti neke osnovne pojmove i odgovoriti na preliminarna pitanja. Kad to učinite, možete staviti ruke na posao i započeti postupak.

Ovaj članak sažima neke vrijedne informacije i resurse koji će vam uštedjeti puno vremena prilikom pokretanja prvih projekata. Uz to, obuhvatit ćemo neke smjernice i dobre prakse koje će vam pomoći tijekom dizajniranja.

Sviđa li vam se dizajn videoigara? Pogledajte ovaj članak o UX-u koji se temelji na nostalgiji:

ŠTO MORAM ZNATI PRIJE POČETKA?

To je osnova vašeg dizajnerskog rada. Obavezno shvatite svaku točku ovog poglavlja i slobodno nam postavite bilo koje pitanje ako su vam potrebne dodatne informacije.

1. DIZAJN ALATA

Trebat će vam alati za dizajn i testiranje vaše aplikacije. Definitivno preporučujem Adobe XD za početnike, što je vrlo intuitivno i nudi vam brojne mogućnosti. Nadalje, besplatno je! Međutim, možete pronaći mnoga druga rješenja poput Sketch, Framer, Figma i InVision. Ovisno o slučaju, možda bi bilo dobro da ih pogledate.

U sljedećem ćemo članku obrađivati ​​osnove Adobe XD-a:
Adobe XD zaslon, s https://helpx.adobe.com/ca/xd/help/artboards-grids.html

Za shemu boja vašeg korisničkog sučelja, svakako biste trebali isprobati alat za boju materijala dizajn. To je vrlo jednostavan i učinkovit alat koji vam pomaže odabrati pravu paletu boja za vašu aplikaciju, pregledavajući uzorke izgleda. Što je još važnije, možete provjeriti čitljivost teksta različitim kombinacijama boja fonta i pozadine.

Dizajn materijala - mrežni zaslon s alatom u boji

Alat u boji omogućuje vam da izvozite paletu boja za Android i iOS kako bi ih programeri mogli izravno primijeniti u kod.

Opcije izvoza alata u boji

Pored općeg UX / UI alata, bit će dobro ako možete koristiti Adobe Photoshop ili bilo koji drugi uređivač slika i fotografija kao što je GIMP ili Photo Pos Pro. Ako ne koristite takve alate, ne brinite! Na Internetu ima puno besplatnih resursa.

Evo potpunog popisa alata koje sam spomenuo:

  • Adobe XD (besplatno!)
  • Skica (samo za macOS)
  • Framer (samo macOS)
  • InVision (besplatno!)
  • Figma (online, besplatan test!)
  • Alat u boji (online, besplatno!)
  • Adobe Photoshop
  • GIMP (besplatno!)
  • Photo Pos Pro (besplatno!)

2. CILJNI UREĐAJI

Usredotočit ću se na Android i iOS. Većina mobilnih i nosivih uređaja danas koristi te operativne sustave, tako da je projektiranje za njih najčešći slučaj.

iOS i Android logotipi, s https://buildfire.com/ios-android-users/

Međutim, projektiranje UX-a za Android i iOS platforme može se u nekim aspektima razlikovati. Ovdje možete pročitati nekoliko zanimljivih podataka o različitom ponašanju korisnika Android i iOS.

Morat ćete pripremiti svaku sliku ili videozapis svoje aplikacije za različite veličine i gustoću zaslona, ​​na temelju različitih ciljnih uređaja. Postoje tisuće različitih Android uređaja, ali Google preporučuje dizajnirati za neke standardne specifikacije zaslona. Najčešći je pristup dizajniranju za rezoluciju srednje gustoće (MDPI) ili visoke gustoće (HDPI), a zatim pretvorite svoje slike proporcionalnim skaliranjem.

Srećom, Adobe XD i drugi alati već su spremni za izvoz vaših slika u standardne formate, kao što ćemo vidjeti u drugom članku ove serije.

Android tablica gustoće zaslona s https://blog.prototypr.io/designing-for-multiple-screen-densities-on-android-5fba8afe7ead.

Za dizajn iOS-a, Apple uspostavlja 3 različite rezolucije na temelju svojih standardnih uređaja. Postupak je znatno jednostavniji.

Faktori razmjera za iOS uređaje Appleove smjernice ljudskog sučelja.

Također možete provjeriti mjerne podatke za najčešće mobilne i nosive uređaje u mrežnoj dokumentaciji Material Design.

Dizajn materijala - zaslon Metrika uređaja

3. ONLINE (BESPLATNI) RESURSI

Pri stvaranju aplikacije ne morate redizajnirati čitavu paradigmu sučelja aplikacije. Naravno, iskusni dizajneri mogu razviti nove koncepte i otvoriti put novim trendovima. No za početnike preporučuje se pridržavati se smjernica i što više iskoristiti mrežne resurse.

Naravno, vodite računa o zakonima o autorskim pravima. Za svoju aplikaciju možete koristiti samo resurse bez upotrebe! Međutim, postoji mnoštvo besplatnih slika, ikona i predložaka koje možete preuzeti bez ikakvog rizika.

Kao polazište, toplo vas molim da posjetite web stranicu Material Design i pregledate je kako biste saznali dobre prakse dizajna.

A evo zlata za UX / UI početnike: sljedeći popis sadrži neke od najkorisnijih web stranica s kojih možete preuzeti besplatne resurse za korisničko sučelje.

  • Dizajn materijala - besplatne ikone
  • Adobe XD - besplatni resursi
  • UpLabs - besplatni predlozi i resursi za dizajn
  • XD Guru - besplatni UI setovi za Abode XD
  • FlatIcon - besplatne ikone
  • Freebiesui - besplatni resursi za dizajn korisničkog sučelja
  • Google fontovi - besplatni tipografski resursi
  • Pexels - Besplatne fotografije visoke kvalitete

Količina besplatnih resursa je zaista velika. Ako vam treba nešto konkretno za vašu aplikaciju, razmislite o nekoliko minuta da istražite Internet prije nego što krenete ispočetka.

4. NEKI DODATNI OPĆI SAVJETI

  • Cilj UX-a je stvoriti pozitivna iskustva za korisnika. To znači da ćete morati razmišljati o tome tko će biti korisnici vaše aplikacije i kako će je koristiti.
  • Da biste stvorili ta pozitivna iskustva, možete slijediti najnovije trendove i samo oponašati ono što rade druge aplikacije. Istražite tržište! Na primjer, pokušajte minimizirati put korisnika i navigaciju održavati što jednostavnijom.
  • Korisničko sučelje (UI) jedan je od ključnih dijelova vaše aplikacije. Ponovno slijedite uobičajene trendove i pojednostavite shemu boja kako bi stvari postale jasne i vidljive ili upotrijebite slike ili videozapise preko cijelog zaslona ako odgovaraju slučaju upotrebe vaše aplikacije.

UX i UI dizajn zahtijevaju mnogo radnog vremena, kreativnosti, izrade prototipa, ponavljanja i ispravljanja vlastitih kvarova. Vjerojatno ćete ga pronaći kada radite vlastite projekte. Ipak, postoji puno smjernica, primjera, resursa, maketa i kompleta koje možete koristiti da biste olakšali postupak dizajniranja.

Ne pokušavajte biti najoriginalniji dizajner aplikacija na svijetu tijekom prvog tjedna: obično je bolje ne propasti nego učiniti nešto jedinstveno.

Inovacije se uvijek okreću naprijed. Baš poput bušilice.