Skitsevejledninger

10 skitsetricks der ville få Owen Wilson til at sige "Wooow!" (Tonsvis af GIF'er!)

Hvis du ikke fik referencen i titlen, beder jeg dig om at se denne video. Selv tak :)

En af mine foretrukne ting at gøre i en app er poke omkring alle indstillinger og menuer. Nogle gange vil jeg endda slå tilfældige taster på mit tastatur for at se, om det udløser en skjult funktion, der på magisk vis betaler mine studielån.

Intet held på den endnu.

Det er ikke det, at jeg prøver at bryde appen ved at pirke rundt. Jeg kan godt lide at skubbe til grænser for at se, hvad der sker.

Her er en hurtig liste over nogle tricks, som jeg har afsløret, mens jeg fandt rundt:

1. Scribble-metoden

Lad os starte tingene med et smell, skal vi?

Jeg opdagede denne metode for omkring en måned siden, og det har været mit gå til skjulte talent på første datoer. Kyllinger grave det, siger jeg dig. Side note, du kender måske allerede dette trick fra min artikel om kort.

Start med at skrive som en børnehave med blyantværktøjet (tryk på P på tastaturet). For tættere områder skal du skrive en flok på samme sted. Glem ikke at svinge ud fra din skriblige masse for at skabe nogle outliers.

Indstil din grænse til at have et bredt strejf mellemrum og buede ender. Presto! Du har lige oprettet nogle tilfældige spredningsdata. Sæt det her, partner

2. Borderadius på individuelle vertikaler

Så vi ved nu, at du kan indstille forskellige grænseradier i boksens radiusradius ved hjælp af skråstreger:

BIG DEAL. Jk, ret cool!

Men! Du kan også bare målrette individuelle vertices ad gangen, hvilket er en realtidsbesparende for mere komplicerede polygoner.

3. Flad roterede former for at nulstille afgrænsningsboksen

Forestil dig dette: Du har lige oprettet en radform, og du roterer tingene omkring 45º. Nu er alt sammen skævt, størrelsen på størrelsen er vandret, og det er som om du blev suget under en bølge, fordi du ikke ved, hvilken vej der går op.

Flad det bare for at nulstille afgrænsningsboksen til et godt rektangel:

4. Valg-træk, derefter Kommando-D for at kopiere former og handlinger

Opretter du en liste over varer? Stop med at kopiere, indsætte og flytte figurer / grupper som en doofus.

Hold funktionen nede, mens du trækker formen / gruppen til den tilsigtede position, og tryk derefter på Kommando + D for at kopiere den. Det vil ikke kun kopiere formen, men også kopiere afstanden, du flyttede:

Pssst ... dette fungerer også med kunstbræt!

5. Skift stifinderindstillinger på kombinerede former

Hvor mange gange har dette sket dig, når du prøver at kombinere en række former til en:

Temmelig irriterende, især når LobsterFest er lige rundt om hjørnet, og du stadig ikke har afsluttet logoen, JON.

Okay, ånde. Vælg bare de kombinerede objektformer og indstil dem til Union:

Du skulle måske tro, at det ville fungere, men da der er former, der udgør hullerne i bogstaverne, er de også forenelige. Vidunderlig.

Heldigvis er Sketch smart og giver dig mulighed for at indstille forskellige stienes fletningsoperationer for hver underform i den kombinerede form, så vi let kan trække disse huller ud:

EDIT: Selvom det stadig er godt at vide, at du kan justere individuelle lagfusionsoperationer, er Steffen Karspeck fantastisk og påpegede, at jeg kunne have undgået hullerne i det første trin ved at indstille min Fill Preferences. Jeg har set dette hundrede gange, men jeg har faktisk aldrig taget sig tid til at læse, hvad de to muligheder betyder. Kunne have reddet mig noget hovedpine :)

Tak, Steffen!

6. Symbolstabling for objektstater

Jeg kan ikke i hele mig huske, hvor jeg først så denne teknik, så jeg tager ikke æren for det. Men det er smart som helvede, så her går vi alligevel.

Det er fantastisk at bruge et symbol til din appnavigation, fordi du kan dele det mellem sider. Ulempen er, at du altid skal have en form for et valgt Nav Element-lag for at vise den aktive side i nav.

Lad os forlade det ekstra lag ved hjælp af en teknik, jeg kalder "Symbol Stacking":

Når du designer din navigation, stak alle dine sidetilstande oven på hinanden. Stab så mange, som du vil, for hvor mange stater du end ønsker eller har brug for at repræsentere.

Når du er færdig, gør det hele til et stort symbol!

Da Sketch tillader brugerdefineret tekst i forskellige symbolforekomster, kan du tilpasse teksten i hvert af dine tilstandslag. For at slå en tilstand fra, skal du blot skrive et mellemrum for at "rydde" den tekstlagstilstand. I GIF nedenfor ønsker jeg, at indstillinger skal vælges, og de andre skal være hvide (min standardtilstand):

I GIF ovenfor ser du på fire af nøjagtigt de samme symboler, der hver repræsenterer forskellige tilstande ved hjælp af symbolstablingsteknikken. Dette er fantastisk, fordi det nu er meget nemmere at tilpasse ting som skrifttype og skrifttypestørrelse, fordi du ikke behøver at bekymre dig om at opdatere det valgte Nav-elementlag over det.

7. Find et lag

Hvis et lag ikke er i visningen af ​​laglisten, når du kommandoer-klikker på et objekt på tegnebrættet, vil du ikke se det fremhævet. Dette er ret irriterende.

Heldigvis er der en semi-skjult funktion til at afsløre et lag på laglisten, der bringer det ind i den rullbare visning. Brug Kommando-Skift-J:

Dette gør det SUPER praktisk at hurtigt hoppe direkte til det valgte lag og derefter Tab omkring søskelagene inde i denne gruppe.

Kommando-Klik på et lag, og tryk derefter på Kommando-Skift-J for at afsløre laget i laglisten.

Bonus tip

Hvis du ikke allerede har et plugin, der hjælper dig med at kollapse lag, vælg Valg-klik på en mappe for hurtigt at kollapse alt dets indhold:

Når du åbner en liste, du går sammen, ser du, at børnene også er blevet kollapset.

8. Hurtige PNG'er - 4 måder!

Nogle gange skal du bare rippe en PNG, men ønsker ikke at gå gennem besværet med at konfigurere dine eksportindstillinger og derefter grave gennem dine filer for at finde, hvor den forbandede ting blev gemt.

Her er 4 måder at ryste en PNG ud i Brilliant Technicolor GIF ™:

Metode 1: Træk tegnebrættelagetMetode 2: Træk eksport / udsnit af tegnebrætMetode 3: Træk en individuel gruppe eller lagMetode 4: Træk ud af skitsen til andre apps
Hurtigt tip: Hvis du arbejder på et modalt design, skal du bruge en PNG til “underlaget”. Det vil spare dig for at skulle duplikere hele appdesignet under modalen og gemme dig fra ved et uheld at klikke på lagene nedenfor.

Bonus! Tyler Howarth mindede mig om, at du også kan eksportere PNG'er ved blot at kopiere selve laget eller artboardet. Vi har helt fordelt på at lægge dette i artiklen, så Tyler får æren for denne. Her er hans tilføjelse:

Du kan også kopiere / indsætte ethvert tegnebræt / gruppe / lag ind og ud af Sketch. Kopier et artboard, skift til Medium / Slack, indsæt og gå!
- Tyler

Hotdog, fyr. Denne regler!

9. Hurtige mønsterudfyldninger

Dette er slags et to-for-en-køb tip.

Tip 1: Hvis du vil oprette et sømløst mønster, skal du oprette et firkantet tegnebrættesymbol og omslutte det med forekomster af sig selv. Dette vil hjælpe med at give dig en idé om, hvordan dit færdige mønster vil se ud.

Tip 2: For hurtigt at gøre dette til et mønsterudfyldning til en anden form, bruger vi en teknik, vi lærte i trin 8.

Vælg den form, der skal udfyldes med dit mønster, åbn menuen "Fyld med billede", og træk dit grundmønsterartboard ind i billedeksempelboksen:

10. Objektiv Bokeh

Det er klart, at du altid skal spare det bedste til sidst.

Jeg er en bedre end amatør-fotograf-men-ikke-helt-professionel fotograf, og en af ​​de bedste fotografiske effekter er bokeh. Du har sandsynligvis aldrig hørt ordet, men du har set det titusinder af gange.

bokeh (n): den visuelle kvalitet af områderne uden for fokus i et fotografisk billede, især som gengivet af en bestemt linse.
(billedkilde)

Det er en virkelig smuk effekt, og den overdrevne dybdeskarphed trækker øjeblikket øjeblikket til fotografiets fokusfokus.

Jeg kiggede rundt med min Scribble-metode, prøvede den i forskellige størrelser, lagde forskellige skriblede linjer og tilføjede effekter til hver enkelt.

Billedet herunder er 100% skitse uden fotografering. Blot en subtil gradientbaggrund med tre linjer med "scribble-metode" i forskellige farver, opacitet og gaussisk sløring. Tilføj et støjlag, der er indstillet til Overlay, og klap noget glaseret tekst ovenpå (gradientfyldning med en øverste og nederste indre kant). Du har en ret overbevisende udseende bokeh-effekt:

Følg mig på Medium / Twitter, tilmeld dig UX Power Tools-publikationen, og følg os på Twitter for opdateringer, nyt indhold og andre groovy ting. Synes godt om, elsk og del, hvis du holder op med det!

Elsker jer mennesker.