Indhold
- 01. Kopier & indsæt guider
- 02. Skitsereenser
- 03. Anima
- 04. React Sketch.app
- 05. Git Sketch Plugin
- 06. ImageOptim
- 07. Magisk spejl
- 08. Eksporter mere
- 11. Marketch
- 12. Segmenterede cirkler
- 13. Sketch Runner
- 14. Ikon skrifttype
- 15. Find og erstat
Sketch-plugins hjælper med at gøre Sketch endnu bedre. Sketch er det valgfri webdesignværktøj til mange brugergrænseflader, og en del af det, der gør, er så godt, er samfundet af mennesker, der arbejder på at udvide dets funktionalitet og funktioner ved at oprette brugerdefinerede plugins.
Administration af dine Sketch-plugins er nu nemmere end nogensinde. Plugins opdateres automatisk, og forældede er deaktiveret. At gøre plugin-økosystemet endnu mere nyttigt er Sketch Cloud, en fildelingsservice, som alle kan tilmelde sig, hvor du kan se, downloade og kommentere Sketch-dokumenter, der er delt offentligt eller privat direkte fra Sketch.
Så lad os se på de bedste Sketch-plugins - dem, der drastisk kan ændre den måde, du designer brugergrænseflader på. Når du har set en, du gerne vil, kan du læse om, hvordan du installerer Sketch-plugins. Hvis du elsker dine webværktøjer, skal du ikke gå glip af vores foretrukne webdesignværktøjer, website builder og cloud storage-opsamlinger. Og husk, dit valg af webhostingudbyder er afgørende for dit websteds succes (vores guide hjælper).
01. Kopier & indsæt guider
- Download her
- Pris: Ledig
- Resumé: Kopier, indsæt eller fjern hjælpelinjer fra dine tegnebrætter
Hver designer har et kærligheds- / hadforhold til guider. Nogle gange er de absolut nødvendige, og resten af tiden kommer de bare i vejen for dig. Hvis du bruger guider i stedet for Sketch's layoutmulighed, kan det være et mareridt at ændre dem til flere tegnebrætter, men med dette plugin er det let at kopiere, indsætte og fjerne guider fra alle dine tegnebrætter.
02. Skitsereenser
- Download her
- Pris: $2
- Resumé: Få dine designfiler så rene som en fløjte
Ethvert skitsedesign, der har været igennem et par gentagelser, vil sandsynligvis samle lidt skrammel undervejs, såsom skjulte lag, inkonsekvente kantpositioner og ubrugte lagstile.
Selvom det ikke er verdens ende at have en rodet Sketch-fil, kan det påvirke aflevering, og det vil gøre livet lettere for enhver, der er nødt til at give mening om det langs linjen. I stedet for at gennemgå alt i hånden, skal du bruge Sketch Cleaner til automatisk at håndtere alle de almindelige problemer.
03. Anima
- Download her
- Pris: Gratis opad
- Resumé: Opret lydhøre, high-fidelity prototyper
Tidligere tilgængelig som separate gratis plugins - Auto Layout og Launchpad - Anima er nu et alt-i-et-plugin designet til at hjælpe dig med at skabe responsive layouts med stifter, stakke og polstring og high-fidelity-prototyper, der passer til alle skærme. Der er stadig en gratis version, der understøtter et projekt; for ubegrænsede projekter starter prissætningen ved $ 25 pr. måned.
04. React Sketch.app
- Download her
- Pris: Ledig
- Resumé: Render React komponenter til skitse
Det kan være svært at administrere designaktiver i Sketch. Dette praktiske Sketch-plugin giver en nemmere og mere pålidelig måde at administrere dine aktiver på. Implementér dine designs i kode som React-komponenter, og brug derefter dette plugin til at gengive dem på skitse. Det gør det også lettere at hente og implementere ægte data i dine Sketch-filer.
React Sketch.app blev udviklet af Airbnb til brug sammen med sit designsystem med det formål at hjælpe med at bygge bro over kløften mellem designere og udviklere.
05. Git Sketch Plugin
- Download her
- Pris: Ledig
- Resumé: En Git-klient indbygget i Sketch
Dette plugin sigter mod at bringe versionskontrol i Sketch. Det fungerer ved at eksportere et billede til alle dele af designet og derefter generere smukke forskelle, så det er klart, hvilke ændringer der er foretaget. Ved at dokumentere hvert trin i designprocessen kan alle i teamet se, hvordan designet har udviklet sig.
Git Sketch Plugin blev oprettet af Mathieu Dutour, som siden er gået videre til at skabe et mere omfattende, betalt versionskontrolsystem kaldet Kactus.
06. ImageOptim
- Download her
- Pris: Ledig
- Resumé: Billedoptimering i Sketch
Mens Sketch tilbyder sin egen løsning til optimering af SVG-filer, er der ingen række muligheder for komprimering af JPG- og PNG-billeder. Da ImageOptim har tilbudt en solid service i en årrække, er det fornuftigt, at det vil bringe denne funktionalitet til Sketch.
Enhver designer, der er interesseret i indlæsningstider og billedoptimering (som alle designere skal have), skal tilføje ImageOptim til deres værktøjskasse. Bemærk, at såvel som pluginet skal du bruge den centrale ImageOptim-app (gratis) installeret på dit macOS-system, og du skal stadig markere lag som eksporterbare i Sketch (gå til 'Eksporter og optimer alle aktiver' for at begynde).
07. Magisk spejl
- Download her
- Pris: Fra $ 4 / mo
- Resumé: Billedperspektiv transformation værktøj
Hvis du prøver at lave imponerende produktmodeller, men bliver ved med at hoppe ind i Photoshop for at håndtere de vanskelige ting, kan Magic Mirror være en livredder for dig. Det er et billedperspektivtransformationsværktøj, der giver dig mulighed for at oprette perspektivmodeller og andre forvrængede effekter uden nogensinde at forlade Sketch.
08. Eksporter mere
- Download her
- Pris: Ledig
- Resumé: Genererer automatisk pladsholderbilleder
Tilføjelse af pladsholderbilleder til et design er en nødvendig del af prototyping, men det kan være en smerte at finde de faktiske billeder. Så i stedet for at spilde noget tid på det, skal du overlade det hele til Day Player. Dette giver dig mulighed for at tilføje tilpassede pladsholderbilleder til ethvert Sketch-dokument fra en række forskellige pladsholderbillede-tjenester, så den største beslutning, du bliver nødt til at tage, er, om du vil bruge Bill Murray, Nicolas Cage eller killinger.
11. Marketch
- Download her
- Pris: Ledig
- Resumé: Generer html-side, der kan måle og få CSS-stilarter
Hvis du vil hente CSS-stilarter fra dine Sketch-designs, er et plugin som Marketch absolut nødvendigt. Det giver dig mulighed for at eksportere dine Sketch-tegnebrætter som en zip-fil fuld af HTML-dokumenter, som du derefter kan udpakke for at trække masser af søde CSS ud, klar til brug.
12. Segmenterede cirkler
- Download her
- Pris: Ledig
- Resumé: Opret præcis cirkulær grafik
Her er en hurtig måde at oprette segmenterede cirkler til diagrammer og diagrammer på. Dette plugin kan producere forskellige stilarter af cirkeldiagram inklusive stiplede og afkrydset cirkler, og tykkelserne styres via en simpel liste med komma-adskilte værdier.
13. Sketch Runner
- Download her
- Pris: Ledig
- Resumé: Spotlight til søgning
Sketch er meget elsket for sin minimalistiske arbejdsgang i tastaturet. Når det er sagt, er der altid to eller tre tastaturgenveje, som du altid synes at glemme eller forveksle med en anden designapp som Photoshop - og lad os ikke glemme de mindre almindelige værktøjer og funktioner, der ikke har en tastaturgenvej og er skjult dybt inde i Skitse-menu.
Sketch Runner løser disse problemer og gør det på en måde, som macOS-brugere er fortrolige med - Sketch Runner er macOS Spotlight, men til Sketch.
14. Ikon skrifttype
- Download her
- Pris: Ledig
- Resumé: Administrer ikonskrifttyper
Ikonskrifttyper er en yderst effektiv måde at bruge ikoner på i dit webdesign uden at skulle eksportere og optimere et ton billedaktiver. Vi refererer typisk til ikonfonter i hoved> sektion af HTML-websider, som vi gør med CSS og JavaScript. Brug af dem i Sketch er dog lidt mere kompliceret. Heldigvis gør Icon Font det nemt.
Efter download og installation af Sketch IconFont, skal du downloade SVG-fontfiler eller downloade denne skrifttypebund, som inkluderer fontfilerne til FontAwesome, Material Design Icons, Ion Icons og Simple Line Icons. Når du er færdig, skal du navigere til Plugins> Ikon skrifttype> Installer en font-pakke, vælge de downloadede skrifttyper i dialogboksen Åbn fil og derefter navigere til Plugins> Ikon skrifttype> Indsæt gitter> [din ønskede ikon skrifttype] for at indsætte et ikon.
Selv hvis du har til hensigt at designe et brugerdefineret ikonsæt til dit design, kan du have færdige ikoner til din rådighed med hurtig prototyping i de tidlige stadier af designet og tilføje lidt mere klarhed / troskab til dine low-fidelity-modeller. .
15. Find og erstat
- Download her
- Pris: Ledig
- Resumé: Find og erstat tekst i valgte lag
Teksteditorer er ikke det eneste sted, du har brug for at finde og udskifte - det er også nyttigt i Sketch. Dette plugin har mange avancerede muligheder, og det giver dig mulighed for at søge efter forekomster af bestemte ord eller sætninger i teksten i udvalgte lag (og alt indeholdt i) og derefter nemt udskifte det.
Næste side: Flere tidsbesparende Sketch-plugins
