Բովանդակություն
- 01. Պատճեն և տեղադրիր ուղեցույցները
- 02. Էսքիզների մաքրում
- 03. Անիմա
- 04. React Sketch.app
- 05. Git Sketch Plugin
- 06. ImageOptim
- 07. Կախարդական հայելի
- 08. Արտահանել ավելին
- 11. Մարքեթչ
- 12. Հատված շրջանակներ
- 13. Sketch Runner
- 14. Սրբապատկերների տառատեսակ
- 15. Գտեք և փոխարինեք
Էսքիզների ներդիրները օգնում են Sketch- ն էլ ավելի լավ դարձնել: Sketch- ը շատերի համար նախընտրելի UI վեբ ձևավորման գործիք է, և այն, ինչն այնքան լավն է, այն մարդկանց համայնքն է, ովքեր աշխատում են ընդլայնել դրա ֆունկցիոնալությունն ու առանձնահատկությունները `կառուցելով հատուկ պլագիններ:
Ձեր Sketch հավելումների կառավարումն այժմ ավելի հեշտ է, քան երբևէ: Պլագիններն ավտոմատ կերպով թարմացվում են, իսկ հնացածներն անջատված են: Փլագինների էկոհամակարգն էլ ավելի օգտակար դարձնելը Sketch Cloud- ն է `ֆայլերի բաժանման ծառայություն, որտեղ յուրաքանչյուրը կարող է գրանցվել, որտեղ կարող եք դիտել, ներբեռնել և մեկնաբանել Sketch փաստաթղթերը, որոնք տարածվել են հրապարակավ կամ մասնավոր կերպով անմիջապես Sketch- ից:
Այսպիսով, եկեք դիտենք Sketch- ի լավագույն ներդիրները `դրանք, որոնք կարող են կտրուկ փոխել օգտվողի միջերեսների ձևավորման եղանակը: Հենց որ նկատեք այն մեկը, որը կցանկանաք, կարդացեք, թե ինչպես տեղադրել Sketch պլագինները: Եթե սիրում եք ձեր վեբ գործիքները, մի կարոտեք վեբ ձևավորման մեր նախընտրած գործիքները, վեբ կայքեր ստեղծողն ու ամպային պահուստների հավաքածուները: Եվ հիշեք, որ վեբ հոստինգ մատակարարի ընտրությունը կարևոր է ձեր կայքի հաջողության համար (մեր ուղեցույցը կօգնի):
01. Պատճեն և տեղադրիր ուղեցույցները
- Ներբեռնեք այստեղ
- Գինը Անվճար
- Ամփոփում Պատճենեք, տեղադրեք կամ հեռացրեք ուղեցույցները ձեր արվեստի տախտակներից
Յուրաքանչյուր դիզայներ սեր և ատելություն ունի ուղեցույցների հետ: Երբեմն դրանք բացարձակապես կարևոր են, իսկ մնացած ժամանակ նրանք պարզապես խանգարում են ձեզ: Եթե Sketch- ի դասավորության տարբերակի փոխարեն ուղեցույցներ եք օգտագործում, դրանք բազմաթիվ արվեստի տախտակների համար փոխելը կարող է մղձավանջ լինել, բայց այս հավելվածով հեշտ է պատճենել, կպցնել և հեռացնել ուղեցույցները ձեր բոլոր արվեստի տախտակներից:
02. Էսքիզների մաքրում
- Ներբեռնեք այստեղ
- Գինը $2
- Ամփոփում Ձեռք բերեք ձեր դիզայնի ֆայլերը սուլիչի պես մաքուր
Skանկացած ուրվագծի ձևավորում, որն անցել է մի քանի կրկնություն, ճանապարհին մի քիչ անպիտան է հավաքելու, ինչպիսիք են թաքնված շերտերը, սահմանի անհամապատասխան դիրքերը և չօգտագործված շերտի ոճերը:
Չնայած Sketch- ի խառնաշփոթ ֆայլ ունենալը աշխարհի վերջը չէ, այն կարող է ազդել ձեռքի օգտագործման վրա, և կյանքը կդյուրացնի յուրաքանչյուրի համար, ով ստիպված է դա հասկանալ: Փոխանակ ամեն ինչ ձեռքով անցնելու, օգտագործեք Sketch Cleaner- ը `բոլոր ընդհանուր խնդիրներն ավտոմատ կերպով լուծելու համար:
03. Անիմա
- Ներբեռնեք այստեղ
- Գինը Ազատ դեպի վեր
- Ամփոփում Ստեղծեք պատասխանատու, բարձր հավատարմության նախատիպեր
Նախկինում մատչելի որպես առանձին անվճար հավելումներ ՝ Auto Layout և Launchpad - Anima- ն այժմ բոլորի մեջ մեկ plugin է, որը նախատեսված է օգնելու ձեզ ստեղծել պատասխանատու դասավորություններ կապումներով, կույտերով և լցոնմամբ և բարձր հավատարմության նախատիպերով, որոնք տեղավորվում են բոլոր էկրաններին: Դեռ կա անվճար տարբերակ, որն աջակցում է մեկ նախագիծ. անսահմանափակ նախագծերի համար գինը սկսվում է ամսական $ 25-ից:
04. React Sketch.app
- Ներբեռնեք այստեղ
- Գինը Անվճար
- Ամփոփում Պատկերեք React բաղադրիչները Sketch- ին
Դիզայնի ակտիվների կառավարումը Sketch- ում կարող է դժվար լինել: Այս հարմար ուրվագիծը ավելացնում է ձեր միջոցները կառավարելու ավելի հեշտ, հուսալի միջոց: Իրականացրեք ձեր նմուշները կոդով որպես React բաղադրիչներ, ապա օգտագործեք այս plugin- ը ՝ դրանք էսքիզ դարձնելու համար: Այն նաև հեշտացնում է իրական ուրվագիծը ձեր ուրվագծերի ֆայլերում բերելը և իրականացնելը:
React Sketch.app- ը մշակվել է Airbnb- ի կողմից `իր նախագծային համակարգով օգտագործման համար` նպատակ ունենալով օգնելու հաղթահարել դիզայներների և մշակողների միջև եղած անջրպետը:
05. Git Sketch Plugin
- Ներբեռնեք այստեղ
- Գինը Անվճար
- Ամփոփում Sketch- ում ներկառուցված Git հաճախորդ
Այս plugin- ը նպատակ ունի տարբերակի կառավարումը բերել Sketch: Այն գործում է ՝ դիզայնի յուրաքանչյուր մասի համար պատկեր արտահանելով, այնուհետև ստեղծելով բավականին տարբերություններ, այնպես որ պարզ է, թե ինչ փոփոխություններ են կատարվել: Ձևավորման գործընթացի յուրաքանչյուր քայլը փաստաթղթավորելով ՝ թիմի յուրաքանչյուր անդամ կարող է տեսնել, թե ինչպես է զարգացել դիզայնը:
Git Sketch Plugin- ը ստեղծվել է Մաթյո Դուտուրի կողմից, ով այդ ժամանակից անցել է Kactus կոչվող ավելի համապարփակ, վճարովի տարբերակների կառավարման համակարգի ստեղծմանը:
06. ImageOptim
- Ներբեռնեք այստեղ
- Գինը Անվճար
- Ամփոփում Էսքիզում պատկերի օպտիմալացում
Չնայած Sketch- ն առաջարկում է իր սեփական լուծումը SVG ֆայլերը օպտիմալացնելու համար, JPG և PNG պատկերները սեղմելու տարբերակների շարք չկա: Քանի որ ImageOptim- ն արդեն մի քանի տարի է, ինչ առաջարկում է հիմնավոր ծառայություն, իմաստ ունի, որ այն այս ֆունկցիոնալությունը կբերի Sketch- ին:
Designerանկացած դիզայներ, ով հոգ է տանում բեռնման ժամանակի և պատկերի օպտիմալացման մասին (որը պետք է լինի բոլոր դիզայներները), պետք է ImageOptim- ն ավելացնի իր գործիքագոտում: Նկատի ունեցեք, որ ինչպես նաև պլագինը, ձեզ հարկավոր է ձեր MacOS համակարգում տեղադրված ImageOptim հիմնական ծրագիրը (անվճար), և դեռ պետք է նշեք Sketch- ում արտահանվող շերտերը (անցեք «Սկսելու և օպտիմալացնելու բոլոր ակտիվները»):
07. Կախարդական հայելի
- Ներբեռնեք այստեղ
- Գինը Ամսական $ 4-ից
- Ամփոփում Պատկերի հեռանկարի վերափոխման գործիք
Եթե փորձում եք տպավորիչ արտադրանքի ծաղրեր անել, բայց ստիպված եք անընդհատ նետվել Photoshop- ում `բարդ խնդիրները լուծելու համար, Magic Mirror- ը կարող է ձեզ համար փրկել կյանքը: Դա պատկերի հեռանկարի վերափոխման գործիք է, որը ձեզ հնարավորություն է տալիս ստեղծել հեռանկարային ծաղրեր և այլ աղավաղված էֆեկտներ ՝ առանց ուրվագիծը երբեք թողնելու:
08. Արտահանել ավելին
- Ներբեռնեք այստեղ
- Գինը Անվճար
- Ամփոփում Ավտոմատ կերպով առաջացնում է տեղապահի պատկերներ
Դիզայնի վրա տեղապահի պատկերներ ավելացնելը նախատիպավորման անհրաժեշտ մասն է, բայց իրական պատկերները գտնելը կարող է ցավ պատճառել: Այնպես որ, քան դրա վրա ցանկացած ժամանակ վատնելը, այդ ամենը թողեք Day Player- ին: Սա թույլ է տալիս Ձեզ ավելացնել ուրվագծերի պահման պատկերներ ուրվագծերի ցանկացած փաստաթղթում, մի շարք տարբեր տեղապահների պատկերների ծառայություններից, այնպես որ ամենամեծ որոշումը, որը դուք պետք է կայացնեք ՝ կլինի՞ արդյոք դուք ցանկանում եք օգտագործել Բիլ Մյուրեյը, Նիկոլաս Քեյջը կամ ձագերը:
11. Մարքեթչ
- Ներբեռնեք այստեղ
- Գինը Անվճար
- Ամփոփում Ստեղծեք html էջ, որը կարող է չափել և ստանալ CSS ոճեր
Եթե ցանկանում եք որոնման ուրվագծերից վերցնել CSS ոճերը, ուրեմն Marketch- ի նման մի հավելանյութ բացարձակապես կարևոր է: Այն հնարավորություն է տալիս արտահանել ձեր Sketch գեղարվեստական տախտակները որպես HTML ֆայլերով լի zip ֆայլ, որոնք այնուհետև կարող եք արդյունահանել ՝ պատրաստելու համար պատրաստելու համար շատ քաղցր CSS:
12. Հատված շրջանակներ
- Ներբեռնեք այստեղ
- Գինը Անվճար
- Ամփոփում Ստեղծեք ճշգրիտ շրջանաձեւ գրաֆիկա
Ահա գծապատկերների և գծապատկերների հատվածավորված օղակներ կազմելու արագ միջոց: Այս plugin- ը կարող է ստեղծել շրջանաձև գծապատկերի տարբեր ոճեր, ներառյալ գծված և նշանշված շրջանակները, և հաստությունները վերահսկվում են ստորակետերով առանձնացված արժեքների պարզ ցուցակի միջոցով:
13. Sketch Runner
- Ներբեռնեք այստեղ
- Գինը Անվճար
- Ամփոփում Ուշադրության կենտրոնում որոնման համար
Sketch- ը լավ սիրված է ստեղնաշարի իր մինիմալիստական աշխատանքային հոսքի համար: Ասել է թե, միշտ կա ստեղնաշարի երկու կամ երեք դյուրանցում, որոնք դու միշտ կարծես մոռանում ես կամ շփոթում ես մեկ այլ դիզայնի ծրագրի հետ, ինչպիսին է Photoshop- ը, և եկեք չմոռանանք այդ պակաս տարածված գործիքներն ու հատկությունները, որոնք չունեն ստեղնաշարի դյուրանցում և թաքնված են խորքում: Էսքիզների ընտրացանկ:
Sketch Runner- ը լուծում է այս խնդիրները և դա անում է այնպես, որ macOS օգտվողները ծանոթ լինեն - Sketch Runner- ը macOS- ի ուշադրության կենտրոնում է, բայց Sketch- ի համար:
14. Սրբապատկերների տառատեսակ
- Ներբեռնեք այստեղ
- Գինը Անվճար
- Ամփոփում Կառավարեք պատկերակների տառատեսակները
Սրբապատկերների տառատեսակները ձեր վեբ ձևավորման մեջ սրբապատկերներ օգտագործելու շատ արդյունավետ միջոց են `առանց մեկ տոննա պատկերային ակտիվների արտահանման և օպտիմալացման: Սովորաբար մենք հղում ենք կատարում պատկերակների տառատեսակներին ղեկավար>> HTML վեբ էջերի բաժին, ինչպես անում ենք CSS- ի և JavaScript- ի հետ: Այնուամենայնիվ, Sketch- ում դրանց օգտագործումը մի փոքր ավելի բարդ է: Բարեբախտաբար, Icon տառատեսակը հեշտացնում է այն:
Sketch IconFont- ը ներբեռնելուց և տեղադրելուց հետո ներբեռնեք SVG տառատեսակի ֆայլեր կամ ներբեռնեք այս տառատեսակի փաթեթը, որը ներառում է FontAwesome, Material Design պատկերակները, Ion Icons և Simple Line Icons տառատեսակների ֆայլերը: Ավարտելուց հետո անցեք Plugins> Icon Font> Install a Font-Bundle, ընտրեք ներբեռնված տառատեսակները Open File երկխոսությունից, ապա անցեք Plugins> Icon Font> Grid Insert> [ձեր ցանկալի պատկերակի տառատեսակ] ՝ տեղադրելու համար պատկերակ:
Նույնիսկ եթե դուք մտադիր եք պատրաստել ձեր դիզայնի համար հարմարեցված պատկերակների հավաքածու, ձեր տրամադրության տակ պատրաստի պատկերակներ ունենալը կօգնի ձեզ նախատիպավորել արագ ձևավորման սկզբնական փուլում ՝ մի փոքր ավելի հստակություն և հավատարմություն ավելացնելով ձեր ցածր հավատարմության ծաղրանկարներին: ,
15. Գտեք և փոխարինեք
- Ներբեռնեք այստեղ
- Գինը Անվճար
- Ամփոփում Գտեք և փոխարինեք տեքստը ընտրված շերտերում
Տեքստի խմբագրիչները միակ տեղը չեն, որը դուք պետք է գտնեք և փոխարինեք. Այն նաև օգտակար է Sketch- ում: Այս plugin- ն ունի շատ առաջադեմ ընտրանքներ, և այն հնարավորություն է տալիս որոնման մեջ ընտրել որոշակի բառերի կամ արտահայտությունների օրինակներ ընտրված շերտերում (և այն ամենը, ինչ պարունակվում է դրա մեջ), այնուհետև հեշտությամբ փոխարինել այն:
Հաջորդ էջը. Sketch հավելումների ավելի շատ ժամանակ խնայողություններ
