Symbolien täyden potentiaalin vapauttaminen luonnos

Suunnitteletko koko suunnittelujärjestelmää vai vain pari näyttöä, Sketchissä olevat symbolit auttavat sinua pitämään tiedoston järjestäytyneenä ja säästävät paljon aikaa pitkällä aikavälillä. Tässä artikkelissa kerron teille muutamia parhaita käytäntöjä ja temppuja, joiden avulla voit vapauttaa symbolien täydet mahdollisuudet.

(Versión en español aquí.)

Mutta ensin, vähän selkää. Aloin käyttää Sketchiä muutama vuosi sitten korvikkeena tuolloin suosikkisuunnitteluohjelmistolleni ilotulitteelle, jonka Adobe oli lopettanut - jättäen koko suunnittelijoiden sukupolven sydämeen. Ensimmäisistä Sketch-käyttöpäivästäni lähtien olin yllättynyt siitä, kuinka helppoa ja selkeää sitä on käyttää. Olin jälleen löytänyt sovelluksen, joka keskittyi käyttöliittymän (ja kuvakkeen) suunnitteluun - eikä mitään muuta.

Sketchin ilmeinen ominaisuuksien puute verrattuna vaihtoehtoihin, joissa oli täynnä valikoita ja pinottuja paneeleja, joihin olin tottunut, oli itse asiassa yksi sen suurimmista eduista ja auttoi minua suunnittelemaan nopeammin. Niiden harvojen ominaisuuksien joukossa, symbolit olivat asia, jota käytin hyvin usein ja käytän edelleen melkein joka päivä (kyllä, jopa sunnuntaisin ... tiedätte, freelancerin elämä).

Mitä symbolit ovat? Lyhyesti sanottuna symbolien avulla voit käyttää ja käyttää uutta elementtiä koko projektin ajan, pitäen pääsymbolin, joka päivittää automaattisesti muut symbolin esiintymät, kun siihen tehdään muutoksia.

Symbolit ovat välttämättömiä suunnittelujärjestelmän rakentamiseksi, joka muodostuu kaikista projektiisi käytettävistä elementeistä ja komponenteista. (Lähde:

Tämä käsite ei ole aivan uusi (eikä se ole yksinomaan Sketchille, ollakseni rehellinen). Jos kuitenkin suunnittelet rajapintoja, löydät siitä erittäin hyödyllisen, etenkin kun komponentteja käytetään osana suunnittelujärjestelmää.

Tässä artikkelissa hahmottellaan kuinka hyödyntää Sketchissä olevia symboleja niiden kaikkien potentiaalin vapauttamiseksi, siirtyen alkeellisimmista tilanteista joihinkin edistyneempiin käyttötapoihin. Mukana on myös joitain vinkkejä ja temppuja, jotka olen oppinut matkan varrella.

Lyhyt johdanto symboleihin

Ennen kuin kaivaat syvemmälle, ja jos olet uusi Sketch, anna minun antaa lyhyt johdanto symbolien toiminnasta.

Symbolit voidaan valmistaa melkein kaikista luonnoksen elementeistä: tekstiobjekteista, muodoista, bittikarttakuvista tai jopa muista symboleista (puhumme tästä myöhemmin). Jokaisen symbolin sisällä (kaksoisnapsauttamalla symbolia siirtyäksesi muokkaustilaan) löydät yhden päätaulun, joka sisältää symbolin tasot. Tämä kuvataulu määrittelee myös symbolin rajat.

Yleensä symbolit luodaan niille elementteille käyttöliittymässä, joita odotetaan käytettävän myöhemmin uudelleen (kuten painikkeet, luettelotarvikkeet, välilehdet jne.) Ja jotka jakautuvat malleidesi eri näytöille, sivuille ja tauluille.

Huomaa: Muista myöhempää käyttöä varten, että yhden symbolin "kopioita" kutsutaan esiintymiksi.

Parasta symbolien käyttämisessä (ryhmiteltyjen, riippumattomien ja irrotettujen esineiden sijaan) on se, että jos päätät jossain vaiheessa muuttaa jotakin ominaisuutta tietyssä symbolissa (esimerkiksi väri, muoto, tekstin koko, mitat tai mikä tahansa muu) ), sinun on vain muokattava symbolin isäntää kerran, ja tämä muutos kopioidaan automaattisesti kaikkiin isäntien ilmentymiin, missä ne ovatkin. En tiedä sinusta, mutta minusta se on erittäin kätevä!

Vinkki 1: Ole järjestäytynyt

Aivan kuten elämässäkin, on olennaista pitää kaikki kunnossa. Suunnittele aina niin kuin jonkun muun täytyy myöhemmin avata suunnittelutiedosto ja työskennellä sen kanssa ja ymmärtää se ilman apua! Tämä pätee myös tapaan, jolla tunnet symbolit - nimeämisen on täytettävä tietyt kriteerit.

Yksi suositus on käyttää viivaa (/) symbolin nimessä. Luonnoksella luodaan automaattisesti luokka osan kanssa ennen viivaa, ja nimetään ja asetetaan symboli sen sisään käyttämällä viiran jälkeen olevaa nimen osaa. Esimerkiksi, jos sinulla on kaksi symbolia nimeltä “Button / Primary” ja “Button / Secondary”, tässä on miten ne näyttävät, kun yrität lisätä ne työkaluriviltä:

Symbolien asianmukainen nimeäminen voi auttaa sinua luomaan siisti hierarkiajärjestelmä, joka auttaa sinua löytämään symbolit nopeammin.

Voit toistaa tämän useita kertoja, jotta saman juurin alla on useita symboleja, jotka on ryhmitelty samanlaisen logiikan avulla, jolloin niiden löytäminen on helpompaa. Ja jos "puusi" kasvaa liian suureksi, harkitse hetki uudelleen nimeämisjärjestelmääsi ja katso, onko olemassa mahdollista tapaa optimoida se ja tehdä siitä helpommin hallittavissa.

Vinkki 2: Nimeämiskäytännöt

Symbolien nimeämiselle on monia erilaisia ​​tapoja, ehkä yksi käytäntö jokaiselle suunnittelijalle. Henkilökohtaisesti en halua käyttää nimityksiä, jotka viittaavat elementtien visuaalisiin ominaisuuksiin - esimerkiksi ”Punainen painike” olisi mielestäni huono valinta, koska jos painikkeen väri muuttuu myöhemmin jostain syystä, symbolista tulee väärä. Sen sijaan yritän erottaa symbolin toiminnon ja tilan (kuten ”Ensisijainen / Ei käytössä”).

Joka tapauksessa ole vain johdonmukainen ja löydä jotain, joka sopii sekä sinulle että joukkueellesi, niin kiinni siitä; älä vaihda nimeämisjärjestelmää tapauksen mukaan! Tämä pätee myös symbolien sisällä oleviin kerroksiin: Jotkut suunnittelijat käyttävät emojoita jopa merkitsemään, mitkä niistä on tarkoitettu muokattaviksi (esimerkiksi lisäämällä nimeen lyijykynä-emoji). Voit tehdä tämän painamalla valinta + Komento + Välilyönti avataksesi valintaikkunan hymiöiden valitsemiseksi.

Hymiön lisääminen tason nimeen on vaihtoehto, kun haluat korostaa sen tarkoitusta.
Huomaa: Mitä tulee symbolien nimiin, muista, että esiintymät ottavat heidän nimensä isäntäsymbolista, mutta voit muuttaa ne myöhemmin mihin tahansa haluat. Tällä tavoin saman symbolin esiintymillä voi olla eri nimet toisistaan.

Vinkki 3: Vaihtoehto symbolisivulle

Kun luot symbolia, Sketch kysyy, haluatko lähettää sen symbolisivulle. Neuvoni on valita tämä valintaruutu, vaikka jonkin ajan kuluttua (ja muutama symboli myöhemmin) tämä omistettu sivu muuttuu sotkuksi. (Luonnos asettaa yhden symbolin viereen niiden luonnissa. Kun poistat symbolin, huomaat tyhjän tilan sen paikalla.)

Sen sijaan mitä teen tämän selvittämiseksi, on luoda omat symbolisivuni (joka on vain tavallinen sivu, jota yleensä kutsun nimellä ”Symbolit”), jolla voin järjestää symbolitapahtumat haluamassani järjestyksessä ja siten sivuuttaa virallinen symbolisivu.

Symbolisivu (vasen) voi helposti häiriintyä, minkä vuoksi pidän parempana omaa erillistä sivua (oikea), jolla voin järjestää symbolien esiintymät mielestäni parhaiten.

Tällä tavoin voin luoda piirroksia, jotka seuraavat luokkia (kuten luetteloita, painikkeita, sisääntuloja ja niin edelleen) ja sijoittaa symbolit mielestäni sopivalle ja mielestäni järkevälle tavalla. Sinun on silti investoitava vähän aikaa päivittää tämä sivu ajoittain, mutta kun se on luotu, se tekee kaiken paljon helpommaksi ja voit rakentaa uuden näytön nopeasti.

Huomaa: Jos haluat mieluummin käyttää symbolisivua, on Symbol Organizer -laajennus, joka voi auttaa sinua pitämään kaiken järjestetyssä muodossa.

Vihje 4: Symbolien korvaaminen

Olemassa olevan symbolin korvaaminen toisella on helppoa. Valitse vain symboli ja valitse ”Korvaa” asiayhteysvalikosta, joka tulee näkyviin, kun napsautat hiiren kakkospainikkeella symboliesityksen päällä. Valitse sitten uusi symboli, jota haluat käyttää. Muista, että uusi symboli säilyttää saman koon ja sijainnin kuin edeltäjänsä; voit korjata tämän valitsemalla ”Aseta alkuperäiseen kokoon” samasta kontekstivalikosta.

Symbolien korvaaminen

Vinkki 5: Irrottaminen

Kun olet tehnyt symbolin, voit irrottaa sen palauttaaksesi elementit, jotka muodostavat sen ryhmänä. Voit tehdä tämän valitsemalla vain “Irrota symbolista” samasta asiayhteysvalikosta, jonka mainitsin aiemmin.

Vinkki 6: Symbolien vienti varoina

Symbolit, kuten muutkin elementit, voidaan viedä myös bittikarttakuvina. Jotta voit tehdä tämän, sinun on merkittävä elementit vietäviksi. (Valitse symboliesimerkki ja valitse sitten Tarkastajan alaosasta ”Tee vientiä varten”.)

Ongelmana, jonka löysin tämän prosessin aikana, on se, että jos symbolissa on jonkin verran pehmusteita (esimerkiksi jos muodot sisällä ovat pienempiä kuin symbolin koko), Sketch jättää vientiä tekemättä tyhjän tilan ja luo vain kuvan vain näkyvän sisällön kanssa.

Symbolin vieminen suoraan luo kuvan, joka sisältää vain muodot (vasen). Käytä viipaleita (oikealla) sovittaaksesi symbolikoko ennen vientiä.

Yksi tapa hoitaa tämä on käyttää viipaletta. Kun luot viipaletta, aseta se ilmentymän päälle ja varmista, että se vastaa ilmentymän rajojen kokoa (leveys ja korkeus); valitse sitten siivu ja käytä vientivaihtoehtoja tarpeen mukaan.

Sivuhuomautus: Sama temppu koskee myös muita työkaluja, kuten Zeplin.

Lisälukema

  • "Luonnoksensymbolien parhaat käytännöt (nyt, että sisäkkäiset ohitukset ovat asia)", Lloyd Humphreys
    Hahmotellaan useita muita tekniikoita ja käytäntöjä symbolien hyväksi hyödyntämiseksi.

Eri kokojen käsittely

Tässä maailmassa, jossa on useita kokoja ja kuvasuhteita näyttöjä, on tärkeää varmistaa, että suunnittelusi mukautuu moniin eri tilanteisiin. Tämä on helpompaa saavuttaa, jos sinun ei tarvitse suunnitella kaikkea tyhjästä joka kerta, käyttämällä uudelleen elementtejä (tai symboleja, kuten olen varma, että olet jo arvasi).

Sketchissä on saatavana erilaisia ​​koonmuutosvaihtoehtoja. Ne ovat erittäin hyödyllisiä, kun haluat mukauttaa symboliasi eri ulottuvuuksiin.

Symbolien koon muuttamisvaihtoehdot ovat tässä hyödyllisiä, ja ne auttavat sinua käyttämään samaa elementtiä erilaisilla leveyksillä ja korkeuksilla ilman vaivaa: Jos koonsi vain yhden esiintymän kokoa valitsemalla se, tämä ei vaikuta muihin esiintuloihin. (Muista kuitenkin, että koonmuutosvaihtoehtoja käytetään yksittäisissä tasoissa isäntämerkin sisällä, ei itse ilmentymään. Joten vaikka voit säätää kokoja erikseen esiintymästä esiintymään, sisäiset elementit pitävät aina saman käytöksen.)

Huomaa: Alla kuvatut vaihtoehdot eivät koske pelkästään symboleja, vaan myös ryhmiä. Käyttäytyminen ei ole aina ennustettavissa, joten on todennäköistä, että joudut leikkimään ja tutkimaan vähän ennen kuin löydät tarvitsemasi, yhdistämällä useimmissa tapauksissa yhden tai kaksi eri asetusta.

Venyttää

Tässä esimerkissä voit nähdä kuinka keltainen muoto pysyy kolmanneksen symbolin kokonaisleveydestä riippumatta siitä, mikä on symbolin kokonaisleveys.

Kun venytysvaihtoehtoa käytetään, muoto, joka on määritellyt, sanotaan esimerkiksi, 50% symbolin kokonaisleveydestä, säilyttää saman suhteen, kun esiintymää jatketaan pystysuoraan tai vaakasuoraan. Tämä on oletuskäyttäytyminen.

Kiinnitä nurkkaan

Keltaisessa muodossa on ”Pin to Corner” -vaihtoehto, joten se tarttuu lähimpään nurkkaan.

”Kiinnitä nurkkaan” (kuten nimestä voi päätellä) kiinnittää elementin lähimpään nurkkaan, eikä elementin koko muutu, pitäen saman etäisyyden tähän nurkkaan. Muista, että jos esine on keskitetty (tasavälein molemmilta puolilta), se ei tiedä kumpi on lähin kulma, joten se pysyy keskellä.

Kohteen koon muuttaminen

Keltaisessa muodossa on ”Objektin koon muuttaminen” -vaihtoehto. Voit ymmärtää paremmin tapahtuvaa tarkastelemalla myös vaaleanpunaisia ​​neliöitä, jotka ovat vain viitteellisiä.

Kun käytetään objektin koon muuttamista, elementit kasvavat pitäen tasainen (tai kiinteä) etäisyys sivuista.

Kellu paikallaan

Tämän vaihtoehdon avulla elementin kokoa ei muuteta pitämällä suhteellinen sijainti symbolin rajoissa.

”Kellua paikallaan” saa esineen pysymään samankokoisena ja pitämään suhteellisen sijaintinsa symbolin rajoissa.

Vinkki 1: Palaa alkuperäiseen kokoon

Jos olet muuttanut symbolisi kokoa, mutta et ole tyytyväinen tulokseen, voit palata takaisin alkuun valitsemalla kontekstivalikosta ”Aseta alkuperäiseen kokoon”.

Vinkki 2: Rajat

Muista, että symboleilla on omat taulut ja nämä määrittelevät symbolien rajat (jopa silloin, kun niiden sisällä olevat muodot ylittyvät). Voit tehdä symbolin kuvataulun samankokoiseksi kuin sen sisältö valitsemalla sen ja valitsemalla Tarkastajasta ”Muuta koko sopivaksi”.

Vinkki 3: Merkkien ja operaattoreiden käyttäminen

Inspectorin leveyden ja korkeuden syöttökentissä voit käyttää operaattoreita arvojen muuttamiseen. Esimerkiksi, voit käyttää arvoa 100 * 2 asettaaksesi elementin mitat 200 pikseliin. Muut operaattorit ovat + (lisää), - (vähennä) ja / (jaa).

Matemaattisten operaattoreiden lisäksi samoissa syöttökentissä voit käyttää L: tä myös objektin skaalaamiseen vasemmalta (tämä on oletus), R skaalata sen oikealta, T skaalata sen ylhäältä (tämä on oletus), B skaalaa sen alhaalta ja C ja M skaalata sen keskeltä tai keskeltä.

Kun muutat suorakulmion kokoa käyttämällä sen oikeaa yläkulmaa ankkurina, muoto kasvaa sen vasemmasta ja alaosasta.

Jos sinulla on esimerkiksi muoto, jonka leveys on 200 pikseliä, ja haluat muuttaa sen kokoa niin, että se skaalautuu oikealta vasemmalle, voit käyttää jotain 300r: n laajuuden syöttökentässä.

Lisälukema

”Luonnoksen 39 koon muuttaminen: Huijauslehti” Peter Nowell

Tämä artikkeli on hyvä viite ymmärtää eroja koon muuttamisessa. Se sisältää myös joitain muita vinkkejä ja temppuja, joten anna se mennä!

Sisäkkäiset symbolit

Mikä voisi olla parempi kuin yksi symboli? Ehkä symboli, jonka sisällä on toinen!

Tämä ominaisuus on eräänlainen uusi Sketchissä, ja se antaa sinulle paljon mahdollisuuksia yhdistämällä symboleja yhdessä. Voit sijoittaa yhden symbolin toisen päälle, valita molemmat ja luoda sitten uuden symbolin, joka sisältää nämä kaksi esiintymää. Voit toistaa tämän niin paljon kuin haluat. Ole kuitenkin maltillinen, tai muuten löydät itsesi kaivaavan sisäkkäisten symbolien tasoja ja tasoja, sisäkkäin. Tämä voi tehdä ylläpidosta paljon vaikeampaa ja voi olla myös oire suuremmista organisatorisista ongelmista.

Pesämerkkejä voi olla erityisen hyödyllistä, kun joudut luomaan muunnelmia yhdestä symbolista. Voit esimerkiksi seurata seuraavaa prosessia:

  1. Poimi yksi symboli, joka toimii pohjana. (tämä symboli pysyy samana kaikissa tapauksissa.)
  2. Päällekkäin se muiden symbolien kanssa (kuten kuvakkeet tai merkit), joita voi olla siellä tai ei, tapauksesta riippuen.
  3. Lopuksi luo uusi symboli tuloksena olevalla kuviolla.

Alla olevassa kuvassa voit nähdä, että kaikilla riveillä on samat ominaisuudet (niillä on sama koko, tekstiominaisuudet ja pehmityksen määrä vasemmalla), joten loin perussymbolin, joka sisältää vain nämä elementit (eli elementit, jotka tulevat olemaan jaettu muiden symbolien kanssa). Käyttäen tätä symbolia lähtökohtana, olen sitten luonut päällekkäisiä elementtejä, jotka ovat erilaisia, tallentaen tuloksen kussakin tapauksessa erillisenä symbolina; Joten kaikki variaatiot -kohdan symbolit ovat oikeasti erilaisia ​​symboleja.

Esimerkki yhteisestä pohjasta luotuista eri symboleista, joissa on variaatiot kussakin tapauksessa.

Mutta sinun ei tarvitse - välttämättä - luoda uusi symboli jokaiselle rivin tilalle. Siellä voi olla yksinkertaisempi tapa: ohitusten käyttö.

Sisäkkäiset ohitukset

Jos joudut luomaan paljon erilaisia ​​symboleja vain siksi, että yksi osa niiden sisällöstä muuttuu, menisit todennäköisesti pähkinöihin. Yksi symbolien päätarkoituksista on nimittäin se, että joudutaan suunnittelemaan mahdollisimman vähän ja pitämään vähemmän elementtejä - ja siten hallitsemaan niitä paremmin. Syötä sisäkkäiset ohitukset!

Yksi käytännöllinen esimerkki tästä työnkulusta voisi olla välilehtipalkin suunnittelu eri tiloilla. Tässä tapauksessa pääsymboli, jossa ei-aktiiviset välilehdet toimisivat perustana, ja jokaiselle korostetulle välilehdelle olisi oma symboli. Valitse vain haluamasi Inspectorin ohitusvaihtoehdoista.

Huomaa: Jotta tämä tekniikka toimisi, muista, että pääsymbolin (navigointipalkin) sisällä olevien passiivisten välilehteiden on oltava myös symboleja. Varmista myös, että kaikilla symboleilla (sekä passiivisilla että aktiivisilla) on täsmälleen samat mitat (leveys, korkeus). Muutoin niitä ei näytetä käytettävissä olevina vaihtoehdoina avattavassa Ohitukset-valikossa.

Katsotaanpa toista käyttötapaa. Jos suunnittelussa on useita painikkeita, mutta niissä on erilaisia ​​tekstimerkkejä, Ohita-vaihtoehdon avulla voit muuttaa tekstin arvoa (ei kirjasinperhettä tai kirjasinkokoa - joudut muuttamaan itse symbolin sisäisiä painikkeita muokattaessa symbolimestari), joutumatta luomaan uutta symbolia joka kerta. Tämä on yhtä helppoa kuin ilmentymän valitseminen ja tekstin sisällön muuttaminen Tarkastajassa.

Ohitukset eivät koske vain tekstiä; voit käyttää niitä myös bittikarttakuviin ja jopa muihin symboleihin, kuten edellä mainittiin. Tällä tavoin sinulla voi olla useita symboleja, joissa kussakin on erilainen kuva - ja kaikki tämä ilman, että sinun tarvitsee muuttaa symbolin isäntää.

Joissain tapauksissa en halua saada mitään tiettyä kuvaa osana symbolin päällikköä. Joten teen yleensä tyhjän PNG-tiedoston, jolla ei ole näkyvää sisältöä, luodaan muoto ja käytetään tätä kuvaa kuvionäytteenä (tämä vaihtoehto löytyy ”Täytä asetukset -kohdasta muotoa valittaessa”). Sitten, kun teemme symbolin korvaamisen, korvan vain tämän läpinäkyvän kuvan haluamallani kuvalla!

Saadaksesi parhaan hyödyn tästä käytännöstä, käytän myös kerrosjärjestelmää, jossa on kuvake tai elementti, joka toimii paikanvaraisena kuvan alla ja on näkyvissä vain, jos säilytän alkuperäisen läpinäkyvän bittikartan. Yksi tämän tekemisen eduista on, että voin simuloida tätä tyhjää tilaa, joka tulee näkyviin, kun kuvia ladataan lopputuotteeseen. Se on mielestäni välttämätöntä suunnitella joka tapauksessa.

Vinkki 1: nimet ja kerrosjärjestys

Yksi syy siihen, miksi organisaatio on hyvä idea, on se, että nimeämis- ja tilaustason tasot vaikuttavat tapaan, jolla ne näytetään “Ohitukset” -paneelissa. Inspektorin syöttökenttien vasemmalla puolella olevat etiketit kunnioittavat nimeä ja järjestystä, jonka olet aiemmin määrittänyt itse symbolin sisällä, joten kiinnitä huomiota tähän järjestykseen, jos haluat tehokkaamman työnkulun.

Vinkki 2: huomioi koko

Voit korvata sisäkkäisen symbolin toisella symbolilla vain, jos uudella symbolilla on täsmälleen sama leveys ja korkeus kuin nykyisellä elementillä.

Vinkki 3: Elementtien siirtäminen tekstin pituudesta riippuen

Kun muutat tekstin arvoa Ohitukset-vaihtoehdoissa, voit siirtää elementtiä tarpeen mukaan, kun vasemmalla oleva on pidempi (katso seuraava kuva).

Ylä (ensimmäinen kenttä): Tämä näyttää alkuperäisen symbolin. Pohja (toinen kenttä): Tämä kuvaa kuinka

Toissijaisen tekstin tai muodon on välttämättä oltava tekstin oikealla puolella, jotta se toimisi. Lisäksi molemmilla elementeillä ei saa olla enempää kuin 20 pikseliä etäisyyttä toistensa välillä (katso jäljempänä "Lisälukema").

Vinkki 4: Ohitusten välttäminen

Symboli voi näyttää hieman sotkelmalta Ohitukset-osion vaihtoehtojen takia. Jos et halua, että sen sisällä oleva elementti voitaisiin ohittaa, lukitse tai piilota tämä kerros, niin sitä ei tule luetteloon.

Vihje 5: Sisäkkäisten symbolien piilottaminen

Piilota sisäkkäinen symboli vain valitsemalla Ohitus-osiosta Ei mitään. Tietysti se on näkymätön vain siinä tapauksessa.

Vihje 6: Tekstin piilottaminen

Yksi tapa saada tekstielementti nopeasti katoamaan esimerkissä käyttämällä ohituksia. Aseta tämä vain asettamalla tekstin arvo tyhjälle tilalle painamalla välilyöntiä ja paluunäppäintä Ohita-vaihtoehdoissa.

Vinkki 7: Alkuperäisen kuvan palauttaminen

Jos symbolin sisällä on bittikarttakuvia, muut voivat muuttaa niitä käyttämällä Ohitukset-osion vaihtoehtoja. Alkuperäinen kuva (se, joka muodostaa osan muokattavasta symbolista) on myös mahdollista palauttaa valitsemalla Poista kuvan ohitus. Napsauta hiiren kakkospainikkeella Inspektorin "Valitse kuva" -kohdan vieressä olevan kuvan ruutua.

Lisää lukemista (ja video)

  • "Painikkeen hakkerointi luonnos", Aleksandr Pasevin
    Esittelee yksinkertaisen hakkeroinnin, jolla kuvake pidetään tekstin vasemmalla puolella (oikean sijasta, mikä on normaalia käyttäytymistä), vain muutamalla yksinkertaisella vaiheella.
  • ”Mukautuvat tekstielementit”, Yaron Tamuz
    Selittää kuinka käyttää piilotettuja elementtejä tekstierottimina niiden päällekkäisyyksien välttämiseksi arvojen muuttuessa.
  • ”Luonnos: sävykuvakkeet sisäkkäisillä symboleilla”, Francesco Bertocci
    Yksinkertainen tekniikka kuvakkeen värien muuttamiseksi symbolin sisällä maskeilla.
  • "Tämä on epäilemättä tyylikkäin luonnostekniikka, jota näet koko päivän", Jon Moore
    Selittää kuinka säästää aikaa sisäkkäisillä symboleilla ja mukauttaa niitä tarpeisiisi. Artikkeli sisältää myös mielenkiintoisia tekniikoita muilta suunnittelijoilta.
  • “Nappisysteemien luominen Sketch App -symboleilla” (video), Pablo Stanley
    Opastaa sinut läpi vaiheet, jotka sinun on suoritettava painikejärjestelmän luomiseksi käyttämällä monia asioita, jotka olemme tähän mennessä oppineet.

Plugins, jotka pelaavat hyvin symboleilla

Yksi hyvä asia Sketchissä on, että kun se ei ole ominaisuus, siellä on yleensä plugin, joka korvaa sen. Ja jotkut niistä toimivat erityisen hyvin symbolien kanssa, mikä tekee niistä vieläkin tehokkaampia! Jotkut näistä laajennuksista on mainittu, mutta jos et unohtanut mitään niistä, tässä on luettelo joitain lisäyksistä.

Sketch Runner antaa sinun lisätä symboleja nopeasti navigoimalla luettelossa. Se näyttää myös esikatselun oikeassa paneelissa.

Sketch Runner

Monien muiden ominaisuuksien joukossa Sketch Runner -laajennus auttaa sinua helposti lisäämään symboleja asiakirjaan vain näppäinyhdistelmällä. Siirry -vaihtoehto on erittäin hyödyllinen siirtyessäsi oikealle tietylle symbolille - erittäin hyödyllinen, jos projektissasi on paljon niitä ja jos symbolien löytäminen muilla keinoilla on vaikeaa.

InVision-käsityökirjasto

Jos työskentelet ryhmän kanssa, InVision Craft Library -palvelun avulla on helppo luoda jaettu kirjasto, jonka sisältöä kaikki voivat käyttää, jolloin synkronoit muutokset, kun sinun on päivitettävä symboli, jotta olet aina varma, että käytät symbolien uusin versio.

Automatisoida

Automatisointi on erittäin tehokasta ja tekee todennäköisesti työsi tehokkaammaksi. Symbolien hallintavaihtoehtoihin sisältyy käyttämättömien symbolien poistaminen, kaikkien symbolien esiintymien valitseminen ja paljon muuta.

Symbolinimen nimeäjä

Symbol instanssin uudelleennimeäjä nimeää kaikki esiintymät vastaamaan niiden isäntäsymbolien nimeä.

Symbolijärjestelmä

Järjestä Symbol Organizer -sovelluksella symbolisivu aakkosjärjestykseen (mukaan lukien kerrosluettelo) ja erillisiin ryhmiin, jotka määritetään symbolien nimien perusteella.

Automaattinen asettelu

Automaattinen asettelu integroituu saumattomasti Sketchiin ja mahdollistaa erilaisten iPhone- ja iPad-kokojen määrittämisen ja katselemisen, mukaan lukien muotokuva ja maisema. Se tukee myös edistyneempiä ominaisuuksia, kuten pinot (erityyppinen ryhmä, joka määrittelee alatasojen asettelut) ja esiasetukset sekä Androidille että iOS: lle. Katso lisätietoja heidän esimerkkeistään.

Huomaa: Nämä ovat vain joitain plugineista, joista mielestäni saatit olla eniten hyötyä sinulle, mutta on myös monia muita. Saadaksesi lisätietoja käy vain Sketchin virallisella laajennussivulla tai Sketch App Sources -sivustolla säännöllisesti.

Lopulliset ajatukset

Luonnoksen symbolit kehittyvät jatkuvasti, joten voimme odottaa lisäparannuksia, jotka tekevät niistä vielä arvokkaampia ja osuvampia. Jos minun pitäisi kuitenkin mainita vain yksi asia, jonka haluaisin heidän olevan, se olisi mahdollisuus jakaa symbolien kirjastot, jota Figma tekee. Tämä voisi olla erittäin hyödyllinen, etenkin ryhmätyössä, kun useiden samassa projektissa työskentelevien suunnittelijoiden on poistettava elementit pilvestä tallennetusta ensisijaisesta, aina ajan tasalla olevasta asiakirjasta.

Huomaa: Tämän ominaisuuden suhteen tiedän, että Sketchin joukkue työskentelee sen parissa, joten toivottavasti näemme sen pian. Version 43 avoimempi muoto on luultavasti perusta tähän ominaisuuteen. Joka tapauksessa odotan sitä, koska tämä voi olla pelinvaihtaja monissa suunnittelijoiden työnkuluissa.

Totta puhuen, tällä hetkellä on joitain laajennuksia, jotka auttavat sinua suorittamaan enemmän tai vähemmän saman toiminnan kuin edellä mainittiin, mutta pidän sitä aina luotettavampana, kun ne tehdään osaksi Sketchin ydintoimintoja - mikä varmistaa, että ominaisuus toimii edelleen, kun ohjelmisto päivitetään seuraavaan versioon.

Tiedän, että tekniikoita ja temppuja on paljon enemmän. Tapa, jolla yksi toimii, on joskus tyypillistä henkilökohtaista, eikä ole olemassa yhtä oikeaa tapaa tehdä jotain. Täällä olen jakanut tekniikat, jotka ovat mielestäni luotettavia, mielenkiintoisia ja jotka eivät vaadi paljon hakkerointia. Siksi jotkut tekniikat jätettiin tämän artikkelin ulkopuolelle.

Toivon, että tämä oli hyödyllinen luku! Jos se oli, niin symboleista tulee todennäköisesti kuvioidesi selkäranka, ja käytät niitä melko usein. Voit vapaasti jakaa ajatuksesi ja muut vinkkisi ja temppusi alla oleviin kommentteihin. Voit myös tavoittaa minut aina Twitterissä, jos tarvitset apua!

Kiitos, että luit! Jos pidit tästä hyödyllistä tai mielenkiintoista, paina alla olevaa ❤-painiketta.

Postitan myös (mielestäni) mielenkiintoisia juttuja Twitteriin.
Tämä artikkeli on alun perin julkaistu Smashing Magazine -lehdessä.