Content
- 01. Copia i enganxa guies
- 02. Sketch Cleaner
- 03. Ànima
- 04. React Sketch.app
- 05. Git Sketch Plugin
- 06. ImageOptim
- 07. Mirall màgic
- 08. Exporteu-ne més
- 11. Marketch
- 12. Cercles segmentats
- 13. Sketch Runner
- 14. Tipus de lletra icona
- 15. Cerca i substitueix
Els connectors Sketch ajuden a millorar encara més Sketch. Sketch és l'eina de disseny web d'interfície d'usuari preferida per a molts i una part del que fa és tan bona és la comunitat de persones que treballen per ampliar la seva funcionalitat i funcions mitjançant la creació de complements personalitzats.
La gestió dels connectors de Sketch ara és més fàcil que mai. Els connectors s’actualitzen automàticament i els desactualitzats estan inhabilitats. Fer que l’ecosistema dels connectors sigui encara més útil és Sketch Cloud, un servei d’intercanvi de fitxers al qual tothom es pot inscriure, on podeu veure, descarregar i comentar documents de Sketch que s’han compartit públicament o de manera privada directament des de Sketch.
Vegem, doncs, els millors connectors de Sketch: els que podrien canviar dràsticament la manera de dissenyar les interfícies d’usuari. Un cop n’heu detectat un, voldreu saber com instal·lar els connectors de Sketch. Si us encanten les vostres eines web, no us perdeu les nostres eines de disseny web preferides, el creador de llocs web i les recopilacions d’emmagatzematge al núvol. I recordeu, la vostra elecció de proveïdor d'allotjament web és crucial per a l'èxit del vostre lloc (la nostra guia us ajudarà).
01. Copia i enganxa guies
- Descarregueu aquí
- Preu: Gratuït
- Resum: Copieu, enganxeu o elimineu guies de les taules de treball
Tots els dissenyadors tenen una relació d’amor / odi amb els guies. De vegades són absolutament imprescindibles i la resta del temps només se’ls obstaculitzen. Si feu servir guies en lloc de l’opció de disseny de Sketch, canviar-les per diverses taules d’art pot ser un malson, però amb aquest connector és fàcil copiar, enganxar i eliminar guies de totes les taules de treball.
02. Sketch Cleaner
- Descarregueu aquí
- Preu: $2
- Resum: Obteniu els fitxers de disseny tan nets com un xiulet
Qualsevol disseny d’esbós que hagi passat per algunes iteracions probablement recollirà una mica de brossa al llarg del camí, com ara capes amagades, posicions de vora incoherents i estils de capa no utilitzats.
Tot i que no és el final del món tenir un fitxer Sketch desordenat, pot afectar la transferència i facilitarà la vida a tothom que hagi de donar-hi sentit. En lloc de passar-ho tot a mà, utilitzeu Sketch Cleaner per fer front automàticament a tots els problemes habituals.
03. Ànima
- Descarregueu aquí
- Preu: Lliure cap amunt
- Resum: Creeu prototips sensibles i d'alta fidelitat
Anteriorment disponible com a connectors gratuïts independents: disseny automàtic i llançador, Anima és ara un complement tot en un dissenyat per ajudar-vos a crear dissenys sensibles amb pins, piles i farcits i prototips d'alta fidelitat que s'adaptin a totes les pantalles. Encara hi ha una versió gratuïta que admet un projecte; per a projectes il·limitats, els preus comencen a 25 USD al mes.
04. React Sketch.app
- Descarregueu aquí
- Preu: Gratuït
- Resum: Representa els components React a Sketch
La gestió d’actius de disseny a Sketch pot ser difícil. Aquest útil complement Sketch proporciona una manera més fàcil i fiable de gestionar els vostres recursos. Implementeu els vostres dissenys en codi com a components React i, a continuació, utilitzeu aquest complement per convertir-los en esbossos. També facilita obtenir i implementar dades reals als fitxers Sketch.
React Sketch.app va ser desenvolupat per Airbnb per utilitzar-lo amb el seu sistema de disseny, amb l'objectiu d'ajudar a salvar la bretxa entre dissenyadors i desenvolupadors.
05. Git Sketch Plugin
- Descarregueu aquí
- Preu: Gratuït
- Resum: Un client Git integrat a Sketch
Aquest connector té com a objectiu incorporar el control de versions a Sketch. Funciona exportant una imatge per a cada part del disseny i, a continuació, genera diferents diferències de manera que quedi clar quins canvis s’han fet. En documentar cada pas del procés de disseny, tothom de l’equip pot veure com ha avançat el disseny.
Git Sketch Plugin va ser creat per Mathieu Dutour, que des de llavors va passar a crear un sistema de control de versions més complet i de pagament anomenat Kactus.
06. ImageOptim
- Descarregueu aquí
- Preu: Gratuït
- Resum: Optimització d’imatges a Sketch
Tot i que Sketch ofereix la seva pròpia solució per optimitzar fitxers SVG, no hi ha cap gamma d’opcions per comprimir imatges JPG i PNG. Com que ImageOptim ofereix diversos anys un servei sòlid, és lògic que aportés aquesta funcionalitat a Sketch.
Qualsevol dissenyador que es preocupi pels temps de càrrega i l'optimització d'imatges (que haurien de ser tots els dissenyadors) hauria d'afegir ImageOptim a la seva caixa d'eines. Tingueu en compte que, a més del connector, necessitareu l’aplicació bàsica ImageOptim (gratuïta) instal·lada al vostre sistema macOS i, tot i això, heu de marcar les capes com a exportables a Sketch (aneu a ‘Exporta i optimitza tots els recursos’ per començar).
07. Mirall màgic
- Descarregueu aquí
- Preu: Des de $ 4 / mes
- Resum: Eina de transformació de la perspectiva de la imatge
Si intenteu fer maquetes de productes impressionants, però heu de continuar saltant a Photoshop per fer front a les coses complicades, Magic Mirror us pot salvar la vida. És una eina de transformació de la perspectiva de la imatge que us permet crear maquetes de perspectiva i altres efectes distorsionats sense deixar mai Sketch.
08. Exporteu-ne més
- Descarregueu aquí
- Preu: Gratuït
- Resum: Genera automàticament imatges de marcador de posició
Afegir imatges de marcador de posició a un disseny és una part necessària del prototipatge, però trobar les imatges reals pot ser un dolor. Així que, en lloc de perdre el temps, deixeu-ho tot a Day Player. Això us permet afegir imatges de marcador de posició personalitzades a qualsevol document de Sketch, des de diversos serveis d’imatges de marcador de posició diferents, de manera que la decisió més important que haureu de prendre serà si voleu utilitzar Bill Murray, Nicolas Cage o gatets.
11. Marketch
- Descarregueu aquí
- Preu: Gratuït
- Resum: Genereu una pàgina HTML que pugui mesurar i obtenir estils CSS
Si voleu recuperar estils CSS dels vostres dissenys de Sketch, és absolutament imprescindible un connector com Marketch. Us permet exportar les taules d’art de Sketch com un fitxer zip ple de documents HTML que podeu extreure per treure un munt de CSS dolços, a punt.
12. Cercles segmentats
- Descarregueu aquí
- Preu: Gratuït
- Resum: Creeu gràfics circulars precisos
Aquí teniu una manera ràpida de fer cercles segmentats per a gràfics i diagrames. Aquest connector pot produir diversos estils de diagrama circular, inclosos cercles discontinus i marcats, i els gruixos es controlen mitjançant una simple llista de valors separats per comes.
13. Sketch Runner
- Descarregueu aquí
- Preu: Gratuït
- Resum: Destacat per a la cerca
Sketch és molt estimat pel seu flux de treball de teclat minimalista. Dit això, sempre hi ha dues o tres tecles de drecera que sempre sembla oblidar o confondre amb una altra aplicació de disseny com Photoshop, i no oblidem aquelles eines i funcions menys habituals que no tenen una drecera de teclat i que estan amagades en el fons Menú d'esbossos.
Sketch Runner resol aquests problemes i ho fa de manera que els usuaris de macOS estiguin familiaritzats: Sketch Runner és el punt de mira de macOS, però per a Sketch.
14. Tipus de lletra icona
- Descarregueu aquí
- Preu: Gratuït
- Resum: Gestioneu els tipus de lletra d’icones
Els tipus de lletra d’icones són una forma altament eficient d’utilitzar icones als dissenys web sense haver d’exportar i optimitzar un munt d’actius d’imatge. Normalment, fem referència a tipus de lletra d’icones al fitxer cap> secció de pàgines web HTML, tal com fem amb CSS i JavaScript. No obstant això, utilitzar-los a Sketch és una mica més complicat. Afortunadament, Icon Font ho facilita.
Després de descarregar i instal·lar Sketch IconFont, descarregueu fitxers de tipus de lletra SVG o descarregueu aquest paquet de tipus de lletra, que inclou els fitxers de tipus de lletra de FontAwesome, Icones de disseny de materials, Icones d’Ion i Icones de línies simples. Quan hàgiu acabat, aneu a Connectors> Tipus de lletra d'icones> Instal·leu un paquet de tipus de lletra, seleccioneu els tipus de lletra descarregats al quadre de diàleg Obre fitxer i, a continuació, aneu a Connectors> Tipus de lletra de icona> Insereix quadrícula> [el tipus de lletra de la icona desitjat] per inserir una icona.
Fins i tot si teniu intenció de dissenyar un conjunt d’icones personalitzat per al vostre disseny, tenir icones ja fetes a la vostra disposició us pot ajudar a fer prototips ràpids en les primeres etapes del disseny, afegint una mica més de claredat / fidelitat a les vostres maquetes de baixa fidelitat. .
15. Cerca i substitueix
- Descarregueu aquí
- Preu: Gratuït
- Resum: Cerqueu i substituïu text a les capes seleccionades
Els editors de text no són l'únic lloc que necessiteu trobar i substituir; també és útil a Sketch. Aquest connector té moltes opcions avançades i us permet buscar instàncies de paraules o frases concretes al text en capes seleccionades (i tot el que hi hagi) i substituir-les fàcilment.
Pàgina següent: més connectors de Sketch que estalvien temps
