Innhold
- 01. Kopier og lim inn guider
- 02. Sketch Cleaner
- 03. Anima
- 04. React Sketch.app
- 05. Git Sketch Plugin
- 06. ImageOptim
- 07. Magisk speil
- 08. Eksporter mer
- 11. Marketch
- 12. Segmenterte sirkler
- 13. Sketch Runner
- 14. Ikonefont
- 15. Finn og erstatt
Sketch-plugins hjelper til med å gjøre Sketch enda bedre. Sketch er det valgfrie UI-webdesignverktøyet for mange, og en del av det som er så bra er samfunnet av mennesker som jobber med å utvide funksjonaliteten og funksjonene ved å lage tilpassede plugins.
Administrasjonen av Sketch-plugins er nå enklere enn noensinne. Plugins oppdateres automatisk, og utdaterte er deaktivert. Å gjøre plugin-økosystemet enda mer nyttig er Sketch Cloud, en fildelingstjeneste som alle kan registrere seg for, der du kan se, laste ned og kommentere Sketch-dokumenter som er delt offentlig eller privat rett fra Sketch.
Så la oss ta en titt på de beste Sketch-pluginene rundt - de som kan endre måten du designer brukergrensesnitt drastisk på. Når du har oppdaget en du vil, kan du lese om hvordan du installerer Sketch-plugins. Hvis du er glad i nettverktøyene dine, ikke gå glipp av favorittverktøyene våre for nettdesign, nettstedsbygger og lagring av skyer. Og husk at ditt valg av webhotellleverandør er avgjørende for suksessen til nettstedet ditt (vår guide vil hjelpe).
01. Kopier og lim inn guider
- Last ned her
- Pris: Gratis
- Sammendrag: Kopier, lim inn eller fjern guider fra tegnebrettene dine
Hver designer har et kjærlighets- / hatforhold med guider. Noen ganger er de helt essensielle, og resten av tiden kommer de bare i veien for deg. Hvis du bruker guider i stedet for Sketchs layoutalternativ, kan det være et mareritt å endre dem for flere tegnebrett, men med dette pluginet er det enkelt å kopiere, lime inn og fjerne guider fra alle tegnebrettene dine.
02. Sketch Cleaner
- Last ned her
- Pris: $2
- Sammendrag: Få designfilene dine så rene som en fløyte
Enhver Sketch-design som har vært gjennom noen gjentakelser, vil sikkert hente litt søppel underveis, for eksempel skjulte lag, inkonsekvente kantposisjoner og ubrukte lagstiler.
Selv om det ikke er verdens ende å ha en rotete Sketch-fil, kan det påvirke overlevering, og det vil gjøre livet lettere for alle som må forstå det. I stedet for å gå gjennom alt for hånd, bruk Sketch Cleaner til å håndtere alle de vanlige problemene automatisk.
03. Anima
- Last ned her
- Pris: Gratis oppover
- Sammendrag: Lag responsive high-fidelity-prototyper
Tidligere tilgjengelig som separate gratis plugins - Auto Layout og Launchpad - Anima er nå et alt-i-ett-plugin designet for å hjelpe deg med å lage responsive layouter med pins, stabler og polstring, og high-fidelity-prototyper som passer til alle skjermer. Det er fortsatt en gratis versjon som støtter ett prosjekt; for ubegrensede prosjekter, starter priser på $ 25 per måned.
04. React Sketch.app
- Last ned her
- Pris: Gratis
- Sammendrag: Gjør React komponenter til Sketch
Det kan være vanskelig å administrere designmidler i Sketch. Dette praktiske Sketch-pluginet gir en enklere og mer pålitelig måte å administrere eiendelene dine på. Implementer designene dine i kode som React-komponenter, og bruk deretter dette pluginet til å gjengi dem i skisse. Det gjør det også lettere å hente og implementere ekte data i Sketch-filene dine.
React Sketch.app ble utviklet av Airbnb for bruk med designsystemet, med sikte på å bidra til å bygge bro over gapet mellom designere og utviklere.
05. Git Sketch Plugin
- Last ned her
- Pris: Gratis
- Sammendrag: En Git-klient innebygd i Sketch
Dette pluginet har som mål å bringe versjonskontroll til Sketch. Det fungerer ved å eksportere et bilde for alle deler av designet, og deretter generere ganske forskjellige, så det er klart hvilke endringer som er gjort. Ved å dokumentere hvert trinn i designprosessen kan alle i teamet se hvordan designet har utviklet seg.
Git Sketch Plugin ble opprettet av Mathieu Dutour, som siden har gått videre til å lage et mer omfattende, betalt versjonskontrollsystem kalt Kactus.
06. ImageOptim
- Last ned her
- Pris: Gratis
- Sammendrag: Bildeoptimalisering i Sketch
Mens Sketch tilbyr sin egen løsning for å optimalisere SVG-filer, er det ikke noe valg for komprimering av JPG- og PNG-bilder. Siden ImageOptim har tilbudt en solid tjeneste i en årrekke, er det fornuftig at det vil bringe denne funksjonaliteten til Sketch.
Enhver designer som bryr seg om lastetider og bildeoptimalisering (som alle designere skal ha), bør legge til ImageOptim i verktøykassen. Vær oppmerksom på at i tillegg til pluginet trenger du CoreOptim-appen (gratis) installert på macOS-systemet ditt, og du må fortsatt merke lag som eksporterbare i Sketch (naviger til 'Eksporter og optimaliser alle eiendeler' for å begynne).
07. Magisk speil
- Last ned her
- Pris: Fra $ 4 / mo
- Sammendrag: Bildeperspektiv transformasjonsverktøy
Hvis du prøver å lage imponerende produktmodeller, men må fortsette å hoppe inn i Photoshop for å håndtere de vanskelige tingene, kan Magic Mirror være en livredder for deg. Det er et transformasjonsverktøy for bildeperspektiv som lar deg lage perspektivmodeller og andre forvrengte effekter uten å forlate Sketch.
08. Eksporter mer
- Last ned her
- Pris: Gratis
- Sammendrag: Genererer automatisk plassholderbilder
Å legge til plassholderbilder til et design er en nødvendig del av prototyping, men å finne de faktiske bildene kan være vondt. Så i stedet for å kaste bort noe tid på det, overlater du alt til Day Player. Dette lar deg legge til tilpassede plassholderbilder til ethvert Sketch-dokument, fra en rekke forskjellige plassholderbildetjenester, så den største avgjørelsen du må ta vil være om du vil bruke Bill Murray, Nicolas Cage eller kattunger.
11. Marketch
- Last ned her
- Pris: Gratis
- Sammendrag: Generer html-side som kan måle og få CSS-stiler
Hvis du vil hente CSS-stiler fra Sketch-designene dine, er et plugin som Marketch helt essensielt. Det lar deg eksportere Sketch-tegnebrettene dine som en zip-fil full av HTML-dokumenter som du deretter kan trekke ut for å hente ut masse søt CSS, klar til bruk.
12. Segmenterte sirkler
- Last ned her
- Pris: Gratis
- Sammendrag: Lag presis sirkulær grafikk
Her er en rask måte å lage segmenterte sirkler for diagrammer og diagrammer. Dette pluginet kan produsere forskjellige stiler av sirkeldiagram, inkludert stiplete og kryssende sirkler, og tykkelsene styres via en enkel liste over kommaadskilte verdier.
13. Sketch Runner
- Last ned her
- Pris: Gratis
- Sammendrag: Spotlight for søk
Sketch er populært for sin minimalistiske arbeidsflyt på tastaturet. Når det er sagt, er det alltid to eller tre hurtigtaster du alltid ser ut til å glemme eller forveksle med en annen design-app som Photoshop - og la oss ikke glemme de mindre vanlige verktøyene og funksjonene som ikke har en hurtigtast og er skjult dypt i Skisse-meny.
Sketch Runner løser disse problemene og gjør det på en måte som macOS-brukere er kjent med - Sketch Runner er macOS Spotlight, men for Sketch.
14. Ikonefont
- Last ned her
- Pris: Gratis
- Sammendrag: Administrer ikonfonter
Ikonefonter er en svært effektiv måte å bruke ikoner i webdesignene dine uten å måtte eksportere og optimalisere massevis av bildeaktiver. Vanligvis refererer vi til ikonfonter i hodet> delen av HTML-websider, som vi gjør med CSS og JavaScript. Imidlertid er det litt mer komplisert å bruke dem i Sketch. Heldigvis gjør Icon Font det enkelt.
Etter å ha lastet ned og installert Sketch IconFont, kan du laste ned SVG fontfiler eller laste ned denne fontpakken, som inkluderer fontfilene for FontAwesome, Material Design Icons, Ion Icons og Simple Line Icons. Når du er ferdig, naviger til Plugins> Icon Font> Install a Font-Bundle, velg de nedlastede skriftene fra dialogboksen Åpne fil, og naviger deretter til Plugins> Icon Font> Grid Insert> [ønsket ikonfont] for å sette inn et ikon.
Selv om du har tenkt å designe et egendefinert ikonsett for designet ditt, kan det å ha ferdige ikoner til din disposisjon hjelpe deg med rask prototyping i de tidlige stadiene av designet, og legge til litt mer klarhet / troskap til dine lavtroende modeller. .
15. Finn og erstatt
- Last ned her
- Pris: Gratis
- Sammendrag: Finn og erstatt tekst i valgte lag
Tekstredigerere er ikke det eneste stedet du trenger å finne og erstatte - det er også nyttig i Sketch. Dette pluginet har mange avanserte alternativer, og det lar deg søke etter forekomster av bestemte ord eller uttrykk i teksten i utvalgte lag (og alt som finnes i), og deretter erstatte det enkelt.
Neste side: Flere tidsbesparende Sketch-plugins
