12 Essential Free Sketch Plugins
Kun Sketch 44 poistuu beta-ohjelmasta, katsomme jotain Sketchin parhaista ominaisuuksista: valtava valikoima avoimen lähdekoodin lisäosia.
Sketch-yhteisö on voimakkaasti tukeva ja löydät paljon hämmästyttäviä laajennuksia, jotka parantavat radikaalisti työnkulkuasi. Tässä viestissä käsitellään 12 parasta Sketch-lisäosaa, joita jokaisella suunnittelijalla pitäisi olla.
1. Sketch Measure
Sketch Measure auttaa suunnittelijoita järjestämään ja kuvaamaan työnsä kehittäjille, projektipäälliköille ja muille tiimin jäsenille.
Mutta tämä on myös uskomattoman hyödyllinen yksinäisille susille, jotka suunnittelevat ja koodaavat kaikki hankkeet. Mittausliitännän avulla voit hahmotella elementtejä, joissa näkyvät leveys- / korkeusmitat, jotta oikeat mittaukset saadaan yhdellä silmäyksellä.
Tämä sisältää kaikki sivun elementit, kuten painikkeet, tekstin, kuvakkeet ja jopa taulun taulun tärkeimmät osat.
Sketch Measure -toiminnon avulla voit viedä sivut HTML / CSS-sivuilla tyylikkäästi. Hyväksytty on Adobe-työkalut jotka voivat tehdä tämän myös. Mutta kun kaikki tämä toiminto on oikeassa Sketchissä, työsi on paljon helpompaa.
2. InVision Craft
Jälleen kerran InVision-tiimi ilmoitti uuden laajennuksen Alus . Mutta tämä on enemmän kuin sarja plugins, jossa saat tonnia lisäominaisuuksia ja pikakuvakkeita.
Yksi esimerkki on Data plugin jonka avulla suunnittelijat vetävät tekstiä / dataa suoraan julkisista API-sovelluksista verkossa. Tällä tavoin voit automaattisesti ladata sovelluksesi todellisilla sisällöillä ja kuvilla lennossa.
InVision-kehittäjät päivittävät jatkuvasti Craftin uusia plugin-ominaisuuksia, jotka tekevät siitä entistä arvokkaamman suunnittelijoille. Ja mainitsin, että tämä on täysin ilmainen?
Toistaiseksi Craftilla on 6 suurta plugin-ominaisuutta, jotka kaikki on syytä lisätä suunnittelutyösi.
- Vapaalla kädellä - reaaliaikaista yhteistyötä Sketchissä
- Prototyyppi - dynaaminen korkealaatuinen prototyyppaus
- Synkronointi - välitön synkronointi InVision-prototyyppien ja Sketchin välillä
- data - Vedä reaaliaikaisia tietoja webistä Sketch mockup -muotoon
- Kirjasto - suunnitella koko joukkoosi jakamasi pilvenpiirteet
- monistaa - salamannopea UI-kloonaus
Katsokaa Craft kotisivu ja katso, mitä mieltä olet. Kun yrität sitä, et koskaan halua palata.
3. Sketch Toolbox
Jokaisen Sketch-käyttäjän tulisi tietää Sketch Toolbox . Se on hieno plugin-hallintaohjelma, joka tekee plug-inien asentamisesta ja mukauttamisesta helpompaa.
Tämän työkalupalkin avulla voit selata satoja Sketch-laajennuksia ja valita, mitkä haluat asentaa. Voit vain napsauttaa mitä haluat ja se ladataan automaattisesti tietokoneellesi, käyttövalmiiksi.
Sketch Toolbox päivittää automaattisesti laajennukset, jotta ne toimivat sujuvasti.
Teknisesti tämä on edelleen beta-ohjelmassa, ja se saa aina uusia päivityksiä GitHubissa . Mutta mielestäni se on riittävän hyvä käyttää tuotannon työnkulussa. Itse asiassa, haluaisin sanoa, että hyvä Sketch-työnkulku ei olisi täydellinen ilman tätä uskomatonta plugin manageria.
4. Vientitavarat
Yksi suunnittelijan yksityiskohtaisimmista tehtävistä on jakaa resursseja ja jakaa ne kehittäjien kanssa. Kaikki pienet kuvakkeet, grafiikat ja taustakuviot, nämä kaikki on vietävä (yleensä käsin).
Export Assets plugin Export Assets plugin tekee tämän prosessin tuulta. Huomaa vain, että tämä pistoke on tehty nimenomaan mobiilisovelluksille, joissa suunnittelijoiden on vietävä Android / iOS-liitäntäresursseja. Tämä sisältää verkkokalvon resursseja @ 2x ja @ 3x -näytön kokoille.
En ole nähnyt verkkokalvon suunnittelua koskevia ominaisuuksia, mutta voit tarkistaa Sketsi viejä plugin myös. Se on parhaillaan beta-versiossa ja sen on tarkoitus olla alkuperäisen paranneltu versio.
5. Sisällöntuottaja
Edellä mainitsemani Craft-plugin tarjoaa sisällöntuotantoa. Mutta saatat haluta jotain hieman yksinkertaisempaa kuin tämä Sisältögeneraattori esittäjä (t): Timur Carpeev.
Tämän asennuksen avulla voit automaattisesti lisätä useita Sketch-elementtejä samanaikaisesti, kuten seuraavat tiedot:
- Käyttäjät avatarit
- Etunimet ja sukunimet
- Dummy-kappaleen teksti
- Omat merkkijonot (geos, hinnat, CC-kortin numerot jne.)
Kaikki sisältö on vedetty avoimen lähdekoodin tietokannoista, kuten Unsplash ja Uinames joten voit käyttää tätä useilla projekteilla, kaupallisilla tai muilla tavoin.
6. Looper
Photoshopilla on oma toimintopaneeli, jossa voit automatisoida toistuvat toimet. Luonnoksella ei ole tällaista paneelia, mutta sillä ei ole Looper-plugin joka on täysin ilmainen ja erittäin helppo oppia.
Tämä on kaikkein hyödyllinen sellaisten toistuvien kuvioiden luomiseksi, jotka ottavat koko sivun. Graafiset suunnittelijat saattavat käyttää tätä laajennusta enemmän kuin web-suunnittelijat, mutta se voi säästää paljon aikaa toistuvien skaalaus- / kopiointitehtävien avulla.
Ota kurkistus Looper-kotisivut nähdä, mitä se voi tehdä. Se ei ole hyödyllinen kaikille, mutta niille, jotka voivat käyttää sitä, löydät itsesi säästäen paljon aikaa.
7. Sketch Iconfont
Web-suunnittelijat rakastavat kuvakkeen fontteja . Suuri kuvakkeet tekevät käyttöliittymän suunnittelusta paljon helpommaksi ja fontit ovat yleensä pienempiä kuin kuvat.
Sketch Iconfont plugin Sketch Iconfont-plugin on täydellinen hallintaohjelmisto kuvakkeiden fonttien tallentamiseen, lajitteluun ja vetämiseen suoraan Sketchiin. Oletusarvoisesti plugin on tyhjä, joten sinun on ladattava kuvakkeiden kirjasimet paikallisesti niiden käyttämiseksi.
Mutta tämä antaa sinulle mahdollisuuden työskennellä kaikkien verkossa olevien kuvakkeiden fonttien kanssa. On todella a kirjasinpaketti jotka on tehty nimenomaan tähän laajennukseen, jos haluat täyttää kuvakkeen kansion nopeasti. Ja voit aina häivyttää verkkoa enemmän ajan myötä.
Suosittelen ehdottomasti ottamaan kopion tästä pluginista. Ikonin kirjasimet ovat täällä pysyäkseen ja ne ovat korvaamattomia nykyaikaisille verkkosivustoille.
8. Tyylikirja
Aina kun aloitat uuden Sketch-tiedoston, sinun on joko tehtävä uudelleen tyylit tyhjästä tai sinun täytyy kopioida / liittää tyylit aiemmista mallistoista.
Kanssa Style Inventory plugin voit ohittaa kaikki tämän ylimääräisen työn. Vain muutamalla napsautuksella tuodaan kaikki aiemmat tyylisi suoraan uuteen Sketch-dokumenttiin.
Nämä tyylit sisältävät värejä, tekstityylejä ja symboleja sekä tiettyjen elementtien kerrostuotteita.
Tätä laajennusta päivitetään vain harvoin, mutta suosittelen sitä samankaltaisten mallien yhdistämiseen. Voit kokeilla myös Sketch Palettes plugin värimallien tallentamiseen ja tuomiseen.
9. Pixel Perfecter
Jokainen digitaalinen suunnittelija ylpeilee pikseli-täydellisistä mokkaduista. Tämä tehtävä ei ole vaikea, mutta se vaatii, että jokainen muotoiluelementti on täysin linjassa verkon kanssa, jolle ei jää päällekkäisyydet tai puutteet.
Jos haluat tarkistaa työn ennen vientiä, voit suorittaa Pixel Perfecter . Tämä erittäin pieni plugin tarkistaa kaikki tiedostosi varat nähdäksesi, näkyykö jokin pikseli ylittää perinteiset X / Y-koordinaatit, jotka muodostavat epätäydellisiä pikseleitä.
Huomaa tämä ei korjaa näitä offset-pikseliarvoja automaattisesti. Se löytää vain kerrokset, jotka aiheuttavat ongelmia ja korostavat niitä, jotta voit mennä sisään ja korjata ne itse. Silti se säästää paljon aikaa tarkistamalla kunkin kerroksen käsin.
10. Dynaaminen painike
Alkuperäinen dynaaminen nappula plugin poistettiin jonkin verran vuonna 2015, mutta uudempi Dynaaminen painike plugin on vielä parempi ja yhteensopiva Sketch 3.5+: n kanssa.
Se lisää automaattisesti pehmuste- ja painotyypit mihin tahansa luomasi tekstikerrokseen, ja pehmuste on dynaaminen, joten se päivittyy tekstin koosta riippumatta. Tämä on erittäin hyödyllistä UI-suunnittelijoille, jotka tekevät jatkuvasti muutoksia heidän mallistoihinsä.
Tätä voidaan käyttää myös mobiilisovelluksiin, joissa painikkeet yleensä noudattavat kiinteää kokoa / suhdetta. Se ei ole kaikkein lumoava Sketch-plugiini, mutta se toimii hyvin.
11. Compo
Jos haluat painikkeen generaattorin lisäksi joitakin lisäominaisuuksia, niin Compo plugin kannattaa kokeilla.
Compon luoja sai idean käytettyäään Dynamic Button -protokollaa jonkin aikaa ja halusi lopulta hieman nopeammin. Compo luo automaattisesti oikean painikkeen koon ja tekstin koon vastaamaan täsmällisiä ominaisuuksia. Yksi napsautus ja sinulla on käytössään Sketch-komponentti, joka on automaattisesti koottu ja sijoitettu oikein.
Normaalisti kun luot painikkeen ja muutat tekstiä, se vaikuttaa vain tekstikerrokseen. Joten taustalla oleva painike olisi liian pieni. Compo muuttaa automaattisesti painikkeen ja tekstin ikään kuin ne ovat yksi elementti.
Löydät tonnia demoja GitHub repo yhdessä joidenkin käyttöoppaiden kanssa.
12. CSSketch
Viimeisenä mutta varmasti vähäisimpänä on CSSketch kytkeä. Tämä on hyödyllisintä suunnittelija-kehittäjille, jotka haluavat suoran pääsyn CSS-koodiin kaikissa luomissaan tyyleissä.
Kaikki suunnitellut sivut voidaan ohjata tämän laajennuksen kautta viemään täysi tyylitaulukko kaikkiin varattuihin omaisuuseriin. Mutta koska tämä on automatisoitu, et voi odottaa A ++ -laatuskoodia.
Haluan edelleen koodata CSS: n käsin, mutta tämä lisäosuus on ainakin lähtökohta muille kuin teknisille suunnittelijoille tai kehittäjille, jotka haluavat säästää vähän aikaa.
