Illustrator-ի հետ աշխատելու խորհուրդներ. Վեբ դիզայներների համար, ովքեր նախընտրում են Photoshop-ը

Illustrator-ի հետ աշխատելու խորհուրդներ. Ահա մի խելահեղ գաղափար՝ նախագծեք ձեր հաջորդ վեբ նախագիծը Illustrator-ում: Եթե ​​դուք առաջնային վեբ դիզայներ եք, հավանական է, որ այս առաջարկին շատ լավ չպատասխանեք: Illustrator-ը պարզապես չի կարող անել այն ամենը, ինչ կարող է անել Photoshop-ը, այնպես չէ՞:

Ոչ ճիշտ:

Չնայած որ Photoshop-ը դարձել է դե ֆակտո գործիք վեբ դիզայն, Illustrator-ն ավելի քան ի վիճակի է բավարարել ձեր կարիքները: Իր դասավորության գործիքների շնորհիվ այն հաճախ ավելի լավ և հարմար ծրագիր է վեբ դիզայնի համար:

Քանի որ վեբ դիզայնի մասնագետներից շատերը չեն ցանկանում շրջել Illustrator-ում ապացույցներ փնտրելու համար, ես կազմել եմ վեբին առնչվող հնարավորությունների ցանկ, որոնք դուք պետք է իմանաք՝ Illustrator-ում վեբ դիզայնի փորձարկումներ սկսելու համար:

Փորձեք դրանցից մի քանիսը, և ես երաշխավորում եմ, որ դուք կսկսեք օգտագործել Illustrator-ը որպես ստանդարտ գործիք ձեր վեբ դիզայնի աշխատանքային հոսքում:

1. Նախ և առաջ դրեք բոլոր միավորները Pixels: Illustrator-ի հետ աշխատելու խորհուրդներ

Լռելյայնորեն, Illustrator-ն օգտագործում է չափորոշիչ միավորներ օբյեկտների և կետերի չափերի համար տեքստի համար։ Սրանք հիանալի կարգավորումներ են դիզայնի շատ իրավիճակների համար, բայց դրա համար Վեբ դիզայն դուք հավանաբար կցանկանաք ամենուրեք պիքսելներ տեսնել: Այսպիսով, նախքան որևէ այլ բանի վրա աշխատելը, համոզվեք, որ ձեր միավորները ճիշտ են տեղադրված:

Միավորները պիքսելներ դնելու համար՝

1. Բացեք Խմբագրել ցանկում
2. Ընտրեք չափման միավորները կարգավորումների ենթամենյուից:
3. Սահմանեք բոլոր տարբերակները «պիքսելների» վրա

2. Ստեղծեք փաստաթղթեր՝ օգտագործելով վեբ փաստաթղթի պրոֆիլը:

 

Երբ ցանկանում եք սկսել աշխատել նոր դիզայնի վրա, հեշտությամբ ոլորեք «Նոր փաստաթուղթ» պատուհանի միջով և բաց թողեք որոշ կարևոր մանրամասներ, օրինակ՝ ասեք Illustrator-ին, որ նախատեսում եք աշխատել վեբ դիզայնի վրա, որպեսզի չօգտագործեք CMYK գույները: և առարկայի մշուշոտ եզրերը: Պարզապես հիշեք, որ New Document պատուհանում ընտրեք ինտերնետ պրոֆիլի կարգավորումը, և դուք լավ կլինեք:

3. Միացնել պիքսելային ցանցի հավասարեցումը օբյեկտների համար: Illustrator-ի հետ աշխատելու խորհուրդներ

Այս հատկությունը փրկում է կյանքը, եթե երբևէ խնդիրներ եք ունեցել Photoshop-ում մշուշոտ եզրերի հետ:

Pixel Grid Alignment-ը կկարգավորի օբյեկտի ուղիղ հորիզոնական և ուղղահայաց հատվածները, որպեսզի կատարյալ տեղավորվեն պիքսելային ցանցին՝ միաժամանակ հարթ և հարթ պահելով կոր և թեք հատվածները: Արդյունքը պարզ է, պիքսելներով կատարյալ ձևեր՝ մի բան, որը դուք անպայման ցանկանում եք վեբ դիզայնում:

Վերևի կոճակի վրա միացված է պիքսելային ցանցի հավասարեցումը, ինչը միշտ հանգեցնում է հստակ եզրերի:

Օբյեկտի մակարդակի պիքսելային ցանցի հավասարեցումը միացնելու համար.

1. Ընտրեք օբյեկտ
2. Բացեք Փոխակերպման վահանակը (Պատուհան > Փոխակերպում):
3. Վահանակի ներքևում նշեք «Հավասարեցնել պիքսել ցանցին» վանդակը (եթե այն չեք տեսնում, կրկնակի սեղմեք վահանակի վրա՝ ընտրանքները ցուցադրելու համար)

Նշում. Pixel ցանցի հավասարեցումը լռելյայն միացված է բոլոր նոր օբյեկտների համար, որոնք ստեղծվել են վեբ փաստաթղթի պրոֆիլի միջոցով: Այնուամենայնիվ, եթե դուք օբյեկտներ եք տեղադրում Illustrator-ի այլ ֆայլերից, ապա ձեզ հարկավոր է ձեռքով կարգավորել դրանց պիքսելների հավասարեցումը: Illustrator-ի հետ աշխատելու խորհուրդներ

4. Միացրեք պիքսելների նախադիտումը:

Pixel-Preview ֆունկցիան կստիպի Illustrator-ին իրեն պահել ճիշտ այնպես, ինչպես Photoshop-ը, երբ ձեր պատկերը չափում է 100%-ից բարձր՝ ամեն անգամ կատարյալ վեկտորներ ստանալու փոխարեն, դուք իրականում կտեսնեք պիքսելներն այնպես, ասես աշխատում եք ռաստերային պատկերի հետ:

Եթե ​​միացնեք պիքսելների նախադիտումը, կզգաք, թե Photoshop-ում եք:

Մտածեք, թե որքան լավն է այն. դուք ունեք վեկտորային գրաֆիկայի ողջ հզորությունը ձեր մատների վրա և կարող եք տեսնել, թե ինչպիսին է արդյունքը պիքսելային մակարդակում:

Կոկիկ, այնպես չէ՞:

Միացնել կամ անջատել պիքսելների նախադիտումը

1. Բացեք դիտման ընտրացանկը
2. Ընտրեք Pixel View:

5. Օգտագործեք Artwork պատուհանները: Illustrator-ի հետ աշխատելու խորհուրդներ

Պատկերացրեք, որ երկու տեսախցիկ ուղղված են ձեր նախագծին:

Մեկ տեսախցիկը ունի մեծացման նորմալ մակարդակ, որը ցույց է տալիս ձեր աշխատանքի 100%-ը: Մյուս տեսախցիկը ունի 400% խոշորացման մակարդակ և ուղղված է կոնկրետ մեկ պատկերակի վրա, որի վրա աշխատում էիք:

Ինչպես վիրաբույժը, դուք օգտագործում եք խոշորացման տեսախցիկը պատկերակում պիքսելային մակարդակի փոքր փոփոխություններ անելու համար, երբեմն հայացք նետելով 100% խոշորացման տեսախցիկին՝ տեսնելու, թե իրականում ինչ տեսք ունի այն իր իրական չափերով:

Կափարիչի պատուհանները հիանալի են, երբ անհրաժեշտ է աշխատել փոքր տարրերի հետ, ինչպիսիք են պատկերակները. կարիք չկա անընդհատ մեծացնել և փոքրացնել՝ ստուգելու համար, թե ինչ տեսք ունի ամեն ինչ:

Սրանք Artwork պատուհաններ են. դրանք թույլ են տալիս միաժամանակ դիտել ձեր դիզայնը՝ խոշորացման տարբեր մակարդակներով, գունային կարգավորումներով և այլ տատանումներով: Սա շատ օգտակար է վեբ դիզայնի համար, հատկապես, երբ աշխատում եք պիքսելային մակարդակի մանրամասների հետ:

Artwork պատուհաններն օգտագործելու համար՝

1. Բացեք պատուհանի ընտրացանկը, այնուհետև ընտրեք Նոր պատուհան: Illustrator-ը կստեղծի նոր ներդիր նույն փաստաթղթով:
2. Կրկին գնացեք «Պատուհան» ընտրացանկ, ընտրեք «Կարգավորել» > «Տեղափոխել բոլորը պատուհան»: Սա թույլ կտա փոխվել պատուհանների չափը և տեղադրությունը իրար կողքի, ինչպես հարմար եք գտնում:
3. Փորձեք մեծացման տարբեր մակարդակներով պատուհաններում և սկսեք որոշ փոփոխություններ կատարել՝ տեսնելու, թե ինչպես է այն աշխատում: Illustrator-ի հետ աշխատելու խորհուրդներ

6. Օգտագործեք սիմվոլներ՝ արագ կոճակներ, պատկերակներ և այլն ստեղծելու համար:

Քանի՞ անգամ եք Photoshop-ում ստեղծել նույն (կամ գրեթե նույն) կոճակը, պատկերակը կամ վիջեթը: Եթե ​​դուք զբաղվում եք վեբ դիզայնով, հավանաբար դա անում եք ամեն օր:

Illustrator-ը կարող է օգնել ձեզ խնայել ժամանակը և խուսափել սիմվոլներով այս կրկնվող աշխատանքից:

Ըստ էության, սիմվոլները պատրաստի անվերջանալի հավաքածու են դիզայնի տարրեր, որը կարելի է ավելացնել աշխատանքին՝ պարզապես քաշելով և թողնելով, այնուհետև անհրաժեշտության դեպքում փոփոխել։ Սա իդեալական է կոճակների, սրբապատկերների և այլ ստանդարտ օբյեկտների համար, որոնք զրոյից ստեղծման կարիք չունեն:

Բայց կա ևս մեկ պատճառ, թե ինչու են սիմվոլները հզոր, և դա կոչվում է ակնարկ:

Սիմվոլները ոչ միայն հարմար են, այլև հեշտացնում են դիզայնի կրկնվող տարրերի թարմացումը:

 

Ըստ էության, երբ դուք փոփոխություններ եք կատարում բնօրինակ խորհրդանիշում, այդ փոփոխություններն անմիջապես արտացոլվում են ձեր արվեստի գործերում հայտնաբերված խորհրդանիշի բոլոր օրինակներում: Ձեզ անհրաժեշտ են ավելի մեծ կոճակներ ձեր կայքում: Պարզապես փոխեք խորհրդանիշը: Ցանկանու՞մ եք, որ ձեր ձևի դաշտերը տարբեր տեսք ունենան յուրաքանչյուր էջում: Պարզապես փոխեք խորհրդանիշը: Դուք հասկանում եք գաղափարը:

Խորհուրդ. Եթե չեք ցանկանում, որ դա տեղի ունենա որպես խորհրդանիշի կոնկրետ օրինակի հետ, աջ սեղմեք ձեր նկարազարդման օբյեկտի վրա և ընտրեք Break Symbol Reference: Սա կբացառի այն ավտոմատ թարմացումներից:

Ահա մի լավ տեսանյութ, որը բացատրում է, թե ինչպես օգտագործել և շահարկել սիմվոլները.

Սիմվոլների օգտագործումը Adobe Illustrator-ում - ից Adobe TV .

Գոյություն ունեցող խորհրդանիշ օգտագործելու համար՝

1. Բացեք «Symbols» վահանակը «Պատուհան» ցանկից:
2. Քաշեք ընտրված խորհրդանիշը ձեր աշխատանքի վրա

Ստեղծեք նոր խորհրդանիշ.

1. Ստեղծեք խորհրդանիշի պատկեր
2. Բացեք «Symbols» վահանակը «Պատուհան» ցանկից:
3. Քաշեք նկարազարդումը վահանակի վրա
4. Հաստատելու համար երկխոսության վանդակում սեղմեք OK:

Խորհրդանիշը խմբագրելու համար՝

1. Բացեք «Symbols» վահանակը «Պատուհան» ցանկից:
2. Կրկնակի սեղմեք խորհրդանիշի վրա՝ խմբագրման ռեժիմ մտնելու համար:
3. Ավարտելուց հետո կրկնակի սեղմեք խորհրդանիշի պատկերից դուրս ցանկացած վայրում՝ խմբագրման ռեժիմից դուրս գալու համար:

7. Հեշտությամբ ընդլայնեք օբյեկտները 9 հատվածի մասշտաբով: Illustrator-ի հետ աշխատելու խորհուրդներ

Սա առաջադեմ սիմվոլիական հատկանիշ է, որը թույլ է տալիս սահմանել, թե օբյեկտի որ մասերն են ձգվում մասշտաբի ժամանակ, և որոնք են մնում անփոփոխ:

Ձախ՝ ձգված կոճակի օրինակ՝ 9-հատված խոշորացման կարգավորումով և առանց դրա: Աջ. 9 հատվածի մասշտաբի կարգավորումը ներառում է 4 ուղեցույցների տեղափոխում, որոնք պատմում են Illustrator-ին, թե օբյեկտի որ մասերն են պաշտպանված, և որ մասերը կարող են մասշտաբավորվել:

 

Գործնական օրինակ է կլորացված անկյուններով կոճակը. եթե ցանկանում եք այն երկարացնել, ապա չեք կարող այն պարզապես հորիզոնական ձգել, քանի որ դա կխեղաթյուրի ամբողջ առարկան: Փոխարենը, դուք պետք է ձեռքով տեղափոխեք ձևի կետերը: 9-հատված մասշտաբով ձգումն աշխատում է այնպես, ինչպես նախատեսել եք: Illustrator-ի հետ աշխատելու խորհուրդներ

Որպեսզի իսկապես հասկանաք, թե ինչպես է այն աշխատում, լսեք այս հիանալի վիդեո ձեռնարկը Adobe TV-ից՝ արագ արագացնելու համար.

Օգտագործելով 9 սեգմենտային մասշտաբավորում սիմվոլներով - ից Adobe TV .

8. Կլորացված անկյուններ ամենուր։

Դուք կարող եք ստեղծել կլորացված ուղղանկյուն Photoshop-ում, սակայն Illustrator-ը թույլ է տալիս կիրառել ոչ կործանարար կլորացված անկյունային էֆեկտ գրեթե ցանկացած օբյեկտի վրա: Ի՞նչ է ոչ կործանարար ազդեցությունը: Սա նշանակում է, որ դուք կարող եք միացնել, անջատել կամ փոխել դրա կարգավորումները՝ առանց ազդելու հիմքում ընկած բնօրինակ օբյեկտի վրա:

Դուք կարող եք կիրառել կլորացված անկյունների էֆեկտը գրեթե ցանկացած տեսակի օբյեկտի վրա և հարմարեցնել այն ըստ անհրաժեշտության: Illustrator-ի հետ աշխատելու խորհուրդներ

Կլորացված անկյունային էֆեկտը կիրառելու համար.

1. Ստեղծեք ուղղանկյուն կամ ցանկացած այլ առարկա սուր անկյուններով
2. Էֆեկտների ընտրացանկից ընտրեք Stylize > Rounded Corners:
3. Մուտքագրեք անկյունի շառավիղը և սեղմեք «Նախադիտում»՝ տեսնելու, թե ինչ տեսք ունի այն:
4. Էֆեկտը կիրառելու համար սեղմեք OK:

Կլորացված անկյունի էֆեկտը փոխելու համար.

1. Ընտրեք կլորացված անկյուններով օբյեկտ
2. Բացեք Արտաքին տեսքի վահանակը Պատուհանի ընտրացանկից:
3. Գտեք «Կլորացված անկյուններ» էֆեկտը և կրկնակի սեղմեք դրա վրա՝ դրա կարգավորումները փոխելու համար, կամ սեղմեք աչքի պատկերակը միացնելու կամ անջատելու համար:

9. Արագ լրացման ստեղծում ռաստերային օրինակով: Illustrator-ի հետ աշխատելու խորհուրդներ

Նուրբ ֆոնային նախշերը մեծ հաջողություն են վեբ դիզայնում, բայց շատ դիզայներներ կարծում են, որ դրանք հեշտ չէ կիրառել Illustrator-ում:

Պետք է խոստովանեմ, որ դա ինտուիտիվ չէ, բայց լուծումը պարզ է:

Bitmap օրինաչափություն ստեղծելու համար.

1. Տեղադրեք նախշի նկարը ձեր կտորի վրա
2. Սեղմեք «Տեղադրեք» վերևի ժապավենի վրա (կարևոր է, առանց դրա չի աշխատի):
3. Քաշեք օրինաչափությունը Swatches պալիտրա
4. Կիրառեք նմուշ ցանկացած առարկայի վրա՝ այն նախշով լցնելու համար

10. Պատկերների և առարկաների շուրջ տեքստի ավտոմատ տեղադրում:

Photoshop-ը հայտնի է տեքստի խմբագրման իր շատ հիմնական հնարավորություններով: Եթե ​​ցանկանում եք տեքստը փաթաթել պատկերի շուրջ, դուք պետք է ստեղծեք երկու կամ երեք տարբեր տեքստային շրջանակներ և մոդելավորեք էֆեկտը: Illustrator-ի հետ աշխատելու խորհուրդներ

Բարեբախտաբար, Illustrator-ը ձեզ լուսաբանել է:

Տեքստը պատկերի շուրջ փաթաթելու համար՝

1. Ընտրեք պատկերը կամ առարկան, որի շուրջը ցանկանում եք փաթաթել տեքստը
2. Բացեք «Օբյեկտ» ընտրացանկը, ընտրեք «Փաթաթել տեքստ» > «Նոր»:
3. Փաթաթման հեռավորությունը սահմանելու համար կրկին բացեք Text Wrap ընտրացանկը և ընտրեք Text Wrap Options:
4. Տեղափոխեք պատկերը տեքստի վրայով, որպեսզի տեսնեք փաթաթման էֆեկտը

11. Ստեղծեք հարուստ տեսողական էֆեկտներ օբյեկտների արտաքին տեսքի կարգավորումներով: Illustrator-ի հետ աշխատելու խորհուրդներ

Illustrator-ում օբյեկտի Արտաքին տեսքի վահանակն աշխատում է ինչպես Photoshop-ում շերտի էֆեկտները. դուք կարող եք ավելացնել բազմաթիվ լցոնումներ և հարվածներ օբյեկտի վրա, այնուհետև խաղալ դրանց փոխանցման ռեժիմների, անթափանցիկության և էֆեկտների հետ՝ հետաքրքիր արդյունքներ ստանալու համար:

Այս տեքստը ընդամենը մեկ վեկտորային օբյեկտ է, որը ոճավորվել է Արտաքին տեսք և Էֆեկտներ վահանակի միջոցով:

Խաղահրապարակը բավականին մեծ է՝ ստվերից, լղոզումից և փայլից մինչև տեքստուրավորում, աղավաղում և 3D: Այս կերպ դուք կարող եք վերստեղծել էֆեկտների մեծ մասը Photoshop-ից, մինչդեռ դեռ աշխատում եք վեկտորային գրաֆիկայի հետ:

Արտաքին տեսքի վահանակը հզոր և զվարճալի է. խորհուրդ եմ տալիս անմիջապես փորձել այն կամ դիտել ստորև ներկայացված ձեռնարկը՝ հասկանալու համար, թե ինչպես է այն աշխատում:

Արտաքին տեսքի վահանակի տիրապետում - ից Adobe TV .

Պատրա՞ստ եք սկսել փորձարկել Illustrator-ի հետ:

Photoshop-ի միջոցով կայքերի և օգտատերերի միջերեսների ստեղծումն այժմ դարձել է նորմ, և դիզայներների մեծ մասը գոհ է այս լուծումից: Illustrator-ի հետ աշխատելու խորհուրդներ

Բայց միայն այն պատճառով, որ Photoshop-ն այդքան տարածված է, չի նշանակում, որ Illustrator-ը ոչինչ չունի առաջարկելու, ճիշտ հակառակը: Գործիքներով, ինչպիսիք են պիքսելային ցանցի հավասարեցումը, տեքստի փաթաթումը և օբյեկտի տեսքը, այն ուժեղ գործ է դարձնում:

Համակցված հզոր դասավորության գործիքներ և վեկտորային գրաֆիկա, պատկերների կտրում և արտահանում, Illustrator-ը միանշանակ ակնհայտ ընտրություն է վեբ դիզայներների համար, ովքեր ցանկանում են արագ զարգացնել կայքերը: