Početak rada s UX dizajnom na Sketch-u

Primer za nove UX dizajnere i studente dizajna

U posljednje dvije godine pisali smo puno o savjetima za Sketch na UX Power Tools i želio sam ih organizirati na način koji će pomoći dizajnerima koji tek počinju ući u UX.

Moram napomenuti i da neću raspravljati koji je alat najbolji - pretpostavit ću da ste već shvatili da je Sketch najbolji (za sada) i želite znati kako ga koristiti kao UX dizajner

Naše članke podijelio sam u 5 dijelova koji prikazuju kako mislim da novi dizajneri napreduju od novaka do majstorstva:

  • Izvlačenje ideja
  • Početak rada
  • Postaje brži
  • Postajem pametniji
  • Dobivanje vizualnog

Izvlačenje ideja

UX dizajn započinje prije nego što dođete do alata - započinje s trenutkom kad ideju izbacite iz glave (… zapravo počinje prije nego što istražujete, ali neka ovaj članak ostane ispod 20 minuta).

Doduše, vrlo rano uskočim u digitalne alate. Ali to je uglavnom zato što više radim u glavi i zajednički crtam na ploči sa svojim dizajnerskim timom. UX dizajneri koji tek počinju trebali bi ostati u maloj vjernosti dok istražuju problemski prostor i prave pogreške.

Jednom kada ste spremni nešto prikazati na ekranu, mislim da postoje dva alata koji to stvarno čine. Prvi je alat InVision pod nazivom Freehand koji smo pregledali:

Drugi alat koji olakšava ovu fazu dizajna je skup premium biblioteka za Sketch nazvanog Flowkit Matt D. Smith. To je dobro vrijedno 29 USD.

On nije samo sjajan za žičane okvire vjernosti, već se može koristiti u kasnijim fazama vašeg dizajna kada vam je potrebno da visoko-vjerno preslikate ključne tokove rada kako biste komunicirali o svom dizajnu.

Početak rada

Daleko i dalje najveća snaga Sketch-a za UX Design je njegov naglasak na tome da stvari učinimo ponovljivim i brzim.

Još je prilično alarmantno vidjeti koliko dizajnera Sketch-a ne koriste stvari tako jednostavne i snažne kao što su zajednički stilovi ili noviji napredak poput Umetanih simbola. Pretpostavljam da je to zbog toga što dizajneri postaju nestrpljivi i samo žele izvući stvar. Potpuno shvaćam.

Ali sjajni dizajn je dobar samo koliko je dizajner organiziran. Sviđa nam se metafora kuhanja:

Također volimo proširiti koncept Stylesheets-a s koda na dizajn (otkad smo to napisali, dizajnerski sustavi su stvarno eksplodirali na scenu, ali većina ovih tehnika i danas je relevantna):

I na kraju za sveti gral članaka o tome kako započeti projekt u Sketch-u, koji ga pokriva sve (sve do strukture mape):

Sa člankom o bonusu kako odgovorno postaviti postavke izgleda na Sketch-u:

Brži

Ok, sada kada imate razumijevanja kako učinkovito započeti Sketch projekt, vrijeme je da počnete brže s alatom. Osobno, smatram da je izravno uvredljivo vidjeti dizajnera koji ne koristi nikakve prečace dok dizajnira - mislim, to zaista boli moju dušu. Nemoj biti taj tip / gal:

Otprilike milijun i pol novih alata i dodataka izašlo je otkad smo napisali ovaj članak, ali istina, po meni se, možda, nisu najbolje promijenili najbolji pratitelji za Sketch (Nudg.it je sad već podržan u Sketch-u, Anima je i dalje koristan iako je neki dio ugrađen u Sketch funkcionalnost izgleda):

Savjeti i trikovi

Jon Moore preneo je svoju mudrost korisnika snage u nekoliko članaka koji će vam raznijeti pamet zbog njihove jednostavnosti i moći:

Postajem pametniji

Znate kako postaviti projekt, naučili ste brže uz Sketch, a sada je vrijeme da sve to primijenite na UX dizajn.

Kao što sam već rekao, Sketch je savršen za UX dizajn jer olakšava ponavljanje, konzistentnost i modularnost. Evo nekoliko primjera kako koristiti Sketch za inteligentno stvaranje UI elemenata (a svi dolaze s besplatnim bies):

Učinkovito rukovanje ikonama i grafikom

U sljedećem ćemo odjeljku prikazati stranu vizualnog dizajna UX-a, ali bavljenje grafikom često je izvan kormilarnice UX-ovog dizajnera. Umjesto da brinete o stvaranju ikona, budite pametniji u načinu na koji ih upotrebljavate:

Uneseni simboli zapravo se mogu prilično automatizirati:

I na kraju, bit ću otpušten ako nisam istaknuo najveći napredak Sketcha u posljednjih 12 mjeseci - Knjižnice:

Dobivanje vizualnog

Kao da sve to nije dovoljno, UX dizajneri danas imaju puno viši standard u pogledu vizualnog dizajna.

Kad sam započeo s UX dizajnom, našao sam se izazov upoznati se s „materijalima“ koji su mi potrebni za izradu: omjera stranica, veličine slova, težine, kontrasta boja itd.

Da bih bio bolji započeo sam s kopiranjem postojećih proizvoda da bih mogao osjetiti kako je korisničko sučelje sastavljeno.

Ostvarili smo ovo prošle godine i pružili smo veze do nekoliko uobičajenih proizvoda koji su ponovno stvoreni u Sketch-u (iako su neki od njih redizajnirani):

Odatle stvarno možete započeti koristiti neke male tehnike kako biste dodali samo nešto njuha svojim dizajnom:

Ali nemojte zaboraviti da su točni uzorci jednako važni vizualni dizajn kao i sami vizualni materijali:

* nikad nismo napisali drugi dio

I konačno, ali ne najmanje bitno, u jednom ćete trenutku karijere morati dizajnirati nadzornu ploču i to je često jedna od najvećih noćnih mora za UX dizajnere. Osobno smatram da nadzorne ploče donose rubnu vrijednost stola, pa radije ne provodim dane da grafikone izgledaju dobro:

Bilo je nevjerojatnih 18 mjeseci pomaganja dizajnerskoj zajednici kroz UX Power Tools. I dok Sketch zasigurno nije jedini alat koji bi dizajneri trebali imati u svom arsenalu, sigurno je najmoćniji. Nadam se da će ovaj dodatak pomoći onima od vas koji tek započinju u UX karijeri ili koji prelaze na Sketch zbog vašeg dizajnerskog tijeka rada.

Ako vas zanima sustav dizajna vanilije koji je savršen za pokretanje novih projekata, voljeli bismo provjeriti one koje smo izgradili. Uštedjet će vam tisuće sati dizajnerskog vremena:

Kad ne prikupljam članke o Sketch-u na Srednjem, radim na alatima za dizajn Sketch-a na UX Power Tools kako bih vas učinio boljim i učinkovitijim dizajnom.

Slijedite UX Power Tools na Twitteru
Slijedite me na Twitteru