Kom godt i gang med UX Design i Sketch

En primer til nye UX-designere og designstuderende

Vi har skrevet en masse om skissetips hos UX Power Tools de sidste to år, og jeg ønskede at organisere dem på en måde, der kunne hjælpe designere, der lige er begyndt at komme i UX.

Jeg skal også nævne, at jeg ikke vil diskutere, hvilket værktøj der er bedst - jeg antager bare, at du allerede har indset, at Sketch er den bedste (for nu) og vil vide, hvordan du bruger det som en UX Designer

Jeg har opdelt vores artikler i 5 sektioner, der kortlægger, hvordan jeg tror, ​​at nye designere skrider fra novice til mestring:

  • At få ideer ud
  • Kom godt i gang
  • Bliv hurtigere
  • Bliv smartere
  • At få visuel

At få ideer ud

UX-design starter, før du kommer til værktøjerne - det starter ved at få ideer ud af dit hoved (... det begynder faktisk før det med forskning, men lad os holde denne artikel under 20 minutter lang).

Riktigtvis hopper jeg lige ind i digitale værktøjer temmelig tidligt. Men det skyldes stort set, at jeg gør mere i hovedet og tegner samarbejde på en tavle med mit designteam. UX-designere, der lige er startet, skal virkelig forblive i lav tro, mens de udforsker problemrummet og begår fejl.

Når du først er klar til at få noget på skærmen, er der to værktøjer, som jeg synes letter det virkelig godt. Det første er et InVision-værktøj kaldet Freehand, som vi gennemgik:

Det andet værktøj, der letter denne fase af design, er et sæt premiumbiblioteker til sketch kaldet Flowkit af Matt D. Smith. Det er værd at $ 29 prismærket.

Det er ikke kun fantastisk til lo-fidelity wireframing, men kan bruges på senere stadier i dit design, når du har brug for at kortlægge centrale arbejdsgange i høj tro til at kommunikere dit design.

Kom godt i gang

Langt og væk den største styrke ved Sketch til UX Design er dens vægt på at gøre ting gentagne og hurtige.

Det er stadig temmelig alarmerende at se, hvor mange Sketch-designere ikke bruger tingene så enkle og kraftfulde som Delte stilarter eller nyere fremskridt som Nested Symboler. Jeg gætter det, fordi designere bliver utålmodige og bare vil få tingene ud. Jeg får det helt.

Men fantastisk design er kun så godt, som en designer er organiseret. Vi kan godt lide metaforen med at lave mad:

Og vi kan også godt lide at udvide konceptet med stilark fra kode til design (da vi skrev dette, har designsystemer virkelig eksploderet på scenen, men de fleste af disse teknikker er stadig relevante i dag):

Og til sidst for den hellige gral af artikler om, hvordan man starter et projekt i Sketch, der dækker det hele (helt ned til mappestrukturen):

Med en bonusartikel om, hvordan man opsætter layout i Sketch responsivt:

Kom hurtigere

Okay, nu hvor du har forståelse for, hvordan du starter et Sketch-projekt effektivt, er det tid til at begynde at komme hurtigere med værktøjet. Personligt synes jeg det er stødende at se en designer ikke bruge nogen genveje under design - jeg mener, det gør virkelig ondt i min sjæl. Vær ikke den fyr / gal:

Cirka en halvanden million nye værktøjer og plugins er kommet ud, siden vi skrev denne artikel, men sandheden er, at de bedste ledsagere til Sketch ikke efter min mening virkelig har ændret sig (Nudg.it understøttes nu indfødt i Sketch, Anima er stadig nyttigt, selvom noget af det er bagt i Sketchs layoutfunktionalitet):

Tips og tricks

Jon Moore har formidlet sin magt-bruger visdom i et par artikler, der vil sprænge dit sind i deres enkelhed og magt:

Bliv smartere

Du ved, hvordan man opsætter et projekt, du har lært, hvordan du kommer hurtigere med Sketch, og nu er det tid til at anvende alt dette på UX-design.

Som jeg sagde tidligere, er Sketch perfekt til UX-design, fordi det gør gentagelse, konsistens og modularitet let. Her er et par eksempler på, hvordan man bruger Sketch til at gøre UI-elementer intelligent (og de leveres alle med freebies ):

Håndtering af ikoner og grafik effektivt

Vi dækker den visuelle designside af UX i det næste afsnit, men det at arbejde med grafik er ofte uden for styrehuset til en UX-designer. I stedet for at bekymre dig om at oprette ikoner, skal du være smartere på, hvordan du bruger dem:

Indlejrede symboler kan faktisk automatisere en hel del:

Endelig ville jeg være forladt, hvis jeg ikke påpegede Sketches største fremskridt i de sidste 12 måneder - Biblioteker:

At få visuel

Som om alt det, der ikke var nok, har UX-designere i dag en meget højere standard, de skal opfylde, når det kommer til visuelt design.

Da jeg kom i gang med UX-design, fandt jeg det udfordrende at blive bekendt med de ”materialer”, jeg havde brug for at designe med: størrelsesforhold, skriftstørrelser, vægt, farvekontrast osv.

For at blive bedre startede jeg med at kopiere eksisterende produkter, så jeg kunne få en fornemmelse af, hvordan UI var sammensat.

Vi dækkede dette sidste år og leverer links til et par almindelige produkter, der er genoprettet i Sketch (selvom nogle af dem siden er blevet redesignet):

Derfra kan du virkelig begynde at bruge nogle små teknikker til at tilføje bare en smule flair til dine designs:

Men glem ikke, at nøjagtige eksempeldata er lige så kritiske for det visuelle design som det visuelle selv:

* vi skrev aldrig del 2

Sidst, men ikke mindst, på et tidspunkt i din karriere bliver du nødt til at designe et instrumentbræt, og det er ofte en af ​​de største mareridt for en UX-designer. Personligt synes jeg, at dashboards bringer en marginal værdi til tabellen, så jeg vil hellere ikke bruge dage på at få diagrammerne til at se godt ud:

Det har været fantastiske 18 måneder at hjælpe designsamfundet gennem UX Power Tools. Og selvom Sketch bestemt ikke er det eneste værktøj, en designer skal have i deres arsenal, er det bestemt det mest magtfulde. Jeg håber, at dette tillæg vil hjælpe dem af jer, der lige er kommet i gang i en UX-karriere, eller som skifter til Sketch til din designarbejdsgang.

Hvis du er interesseret i et vaniljesignsystem, der er perfekt til at starte nye projekter, ville vi elske, hvis du tjekker dem, vi har bygget. De sparer dig tusinder af timers designtid:

Når jeg ikke samler sketch-artikler på Medium, arbejder jeg på Sketch-designværktøjer hos UX Power Tools for at gøre dig til en bedre og mere effektiv designer.

Følg UX Power Tools på Twitter
Følg mig på Twitter