Թափանցիկ GIF-ը Adobe Illustrator-ում կատարվում է հետևյալ կերպ. Գնալ դեպի Ֆայլ> Պահպանել համարՎեբ և սարքեր (Alt + Ctrl + Shift + S): Բացվող պատուհանում Օպտիմիզացված ֆայլի ձևաչափ դաշտում նախ պետք է գնաք ներդիր Նկարի չափսը(Նկարի չափսը). Փաստն այն է, որ լռելյայնորեն ամբողջ էջը ընկնում է օպտիմալացման պատուհանում, և դա սովորաբար անհրաժեշտ չէ: Հետևաբար, Պատկերի չափ ներդիրում հանեք վանդակը Սեղմեք Artboard-ին(Կտրել էջի չափը) և սեղմել Դիմել կոճակը:

Այնուհետև ձևաչափի ընտրության ցանկում ընտրեք GIF և նշեք «Թափանցիկություն» վանդակը:

Դրանից հետո մենք կսահմանենք, թե որ գույները կլինեն թափանցիկ։ Նկարում առկա բոլոր գույները պարունակվում են ներդիրում Գունավոր աղյուսակ(Գունավոր աղյուսակ) և ցուցադրվում են որպես գունավոր քառակուսիներ: Ընտրեք գործիքը պատուհանի ձախ կողմում գտնվող գործիքագոտում Աչքի կաթիլ(pipette):

Գույները սահմանելու երկու եղանակ կա. Ամենահեշտ ձևն այն է, որ ուղղակիորեն պատկերի վրա աչքաթողով գույն նշելն է. դրանից հետո գույնը կնշվի գունային աղյուսակում մուգ հարվածով: Դե, եթե հստակ գիտեք, թե որ գույնը պետք է լինի թափանցիկ, կարող եք այն ընտրել անմիջապես գունային աղյուսակում՝ սեղմելով համապատասխան գունավոր քառակուսին։ Իսկ առաջին և երկրորդ դեպքերում, եթե անհրաժեշտ է ընտրել մի քանի գույն, ապա պետք է աշխատել Shift (կամ Ctrl) ստեղնը սեղմած։ Գույն ընտրելուց հետո պետք է ծրագրին հրահանգել այն թափանցիկ դարձնել։ Դա անելու համար հարկավոր է սեղմել պատկերակը Քարտեզագրում է ընտրված գույները Թափանցիկ(Ընտրված գույները ավելացրեք թափանցիկությանը): Նկարում այս կոճակը շրջանաձև է, և կարմիրն ընտրված է որպես թափանցիկ: Պատկերի վրա կհայտնվի թափանցիկ տարածք, իսկ գունային աղյուսակի քառակուսին կփոխի իր տեսքը՝ դրա մի մասը կդառնա սպիտակ եռանկյունի: Ընտրված գույնը չեղարկելու համար անհրաժեշտ է ընտրել այն Գույնի աղյուսակում, այնուհետև կրկին սեղմել Քարտեզների ընտրված գույները Թափանցիկ պատկերակը:

Մի քանի խոսք թափանցիկության սահմանման եղանակի մասին. Բացվող ընտրացանկը պատասխանատու է դրա համար: Նշեք Transparency Dither ալգորիթմը, ռուսերեն - Թափանցիկության մոդելավորման ալգորիթմ (նկ. ստորև): Չորս ընտրություն կարելի է կատարել՝ առանց թափանցիկության շեղում, առանց ալգորիթմ, դիֆուզիոն թափանցիկության շեղում, ցրված ալգորիթմ, օրինաչափության թափանցիկության շեղում, օրինաչափության վրա հիմնված ալգորիթմ և աղմուկի թափանցիկության շեղում, աղմուկի վրա հիմնված ալգորիթմ: Դիֆուզ ալգորիթմի ռեժիմում սահիչը ակտիվանում է Գումարը(Գումար), որը թույլ է տալիս փոխել դիֆուզիոն արժեքը: Ի՞նչ կիրառել գործնականում: Կախված նպատակից և պատկերից: Ես չեմ օգտագործում այս տարբերակը և միշտ թողնում եմ այն ​​լռելյայն՝ No Transparency Dither:

Սեղմեք Պահպանել - թափանցիկ gifպատրաստ է։ Աշխատանքն իրականացվել է Adobe Illustrator տարբերակով CS4 (v. 14), սակայն բոլոր գործողությունները և ստեղնաշարի դյուրանցումները տեղին են CS3-ի ավելի վաղ տարբերակի համար (v. 13):

Այսօր մենք այնքան էլ սովորական չենք Adobe ձեռնարկՆկարազարդող. Որովհետև այս անգամ մենք ոչ թե ստատիկ նկար ենք պատրաստելու, այլ իրական անիմացիա։ Պատկերացրեք, ստացվում է Adobe-ի հետԿարող եք նաև նկարել մուլտֆիլմեր Illustrator-ում :)

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

Առաջին բանը, որ պետք է անել՝ նկարել բոլոր անհրաժեշտ տարրերը ապագա անիմացիայի համար: Դա անելու համար ես առանձին փաստաթղթում պատրաստեցի ֆիլմի շրջանակի երկու դիրք, տեղեկատու շրջան, որը կտրվեց առանձին հատվածների, հյուսվածք և ուղղահայաց քերծվածք՝ հնության էֆեկտը ավելացնելու համար, ինչպես նաև բոլոր թվերն ու մակագրությունները։ .

Երբ մեր մուլտֆիլմի բոլոր մասերը պատրաստ լինեն, կարող եք սկսել ինքնին անիմացիան ստեղծել։ Հարմարության համար դա լավագույնս արվում է նոր փաստաթղթում: Այս դեպքում շերտերը կխաղան անիմացիոն շրջանակների դերը։ Եվ հենց առաջին շերտում պարզապես անհրաժեշտ է պատճենել ֆիլմի ժապավենի շրջանակը։ Տեղադրեք այն աշխատանքային տարածքի մեջտեղում:

Այժմ ստեղծեք երկրորդ շերտը և դրա մեջ պատճենեք ֆիլմի ժապավենը, որի մեջ եզրերի երկայնքով անցքերը շրջված են: Այն նաև պետք է կենտրոնացված լինի:

Այս երկու շերտերից արդեն կարող եք ստանալ շարժվող ֆիլմի անիմացիան։ Բայց հետագայում մեզ շատ ավելի շատ շերտեր են պետք: Այսպիսով, ընտրեք առաջին երկու շերտերը, անցեք վահանակի ընտրանքներ և պատրաստեք շերտերի պատճենը:

Նմանապես, մենք պետք է կուտակենք ֆիլմի 12 շերտ կինոնկարներ:

Այժմ մենք ունենք շերտերի մի ամբողջ փունջ, և դրանք բոլորը տեսանելի են: Այն առումով, որ վերին շերտերը խոչընդոտում են ստորիններին, ինչը այնքան էլ հարմար չէ աշխատանքի համար։ Հետևաբար, դուք կարող եք անջատել որոշ շերտեր՝ կտտացնելով շերտի անվան ձախ կողմում գտնվող պատկերակին: Բոլոր շերտերը միանգամից անջատելու կամ միացնելու համար սեղմած պահեք Alt ստեղնը՝ միաժամանակ սեղմելով աչքի պատկերակը: Շերտերը միացնելով և անջատելով՝ դուք կարող եք ճշգրիտ տեսնել, թե ինչ է գտնվում մեր ապագա անիմացիայի որոշակի շրջանակում: Եվ հիմա, որպեսզի մենք մի փոքր ցնցում ավելացնենք ֆիլմի շարժմանը, մենք պետք է ստացված շրջանակները մի փոքր տեղափոխենք տարբեր ուղղություններով: Դա անելու համար ներառեք միայն այն շերտը, որի հետ դուք պատրաստվում եք աշխատել այս պահինև այնուհետև շրջանակը մի քանի պիքսել ուղղեք երկու կողմերում:

Երբ դուք անցնեք բոլոր շերտերը և ավելացնեք մի փոքր տեղաշարժ, կարող եք սկսել շարժվող շրջանի անիմացիա ստեղծել: Դա անելու համար մուլտֆիլմի մասերով փաստաթղթից պատճենեք սեկտորներից բաղկացած շրջանակը և դրեք այն առաջին շերտի վրա ֆիլմի շրջանակի վրա:

Եթե ​​դուք չեղարկեք շրջանակը, ապա այն կունենա մեկ ամբողջություն: Սա հենց այն է, ինչ մեզ անհրաժեշտ է:

Բայց քանի որ այն բաղկացած է առանձին հատվածներից, դուք կարող եք շատ արագ և հեշտությամբ ստեղծել անիմացիա՝ փոխելով դրանց գույնը: Դա անելու համար պատճենեք այս շրջանակը երկրորդ շերտին և առաջին հատվածը դարձրեք ավելի թեթև: Հիշում եք, որ մեր ֆիլմը շարժվում է շարժման ժամանակ, ուստի բոլորովին պարտադիր չէ շրջանակը դնել հենց կադրի կենտրոնում։ Տեղադրեք այն աչքի վրա:

Նմանապես, դուք պետք է կրկնօրինակեք շրջանակը յուրաքանչյուր հաջորդ շերտում, մինչդեռ ավելի բաց գույնով ներկեք մեկ հատված ավելի, քան նախորդ անգամ: Այս 12 շերտերը միասին կազմում են թաղանթ՝ լցնող շրջանով:

Հաջորդը մենք պետք է հյուսվածք ավելացնենք մեր շերտերին: Միացրեք առաջին շերտը և պատճենեք այնտեղ գտնվող հյուսվածքը բնօրինակ ֆայլից պահեստամասերով:

Հետո հերթով միացրեք հաջորդ շերտերը և այնտեղ պատճենեք նույն հյուսվածքը։ Յուրաքանչյուր շրջանակի վրա այն տարբեր տեսք տալու համար պարզապես պտտեք այն 90 աստիճանով: Ինչպես կռահեցիք, մենք պետք է հյուսվածքներ ավելացնենք բոլոր 12 կադրերին:

Եթե ​​արդեն հոգնել եք կրկնօրինակելուց, ապա ես կարող եմ ձեզ գոհացնել - շատ քիչ է մնացել։ Ամենադժվարն ավարտված է։ Մնում է ուղղահայաց քերծվածքներ ավելացնել, և գրեթե ամեն ինչ: Դա անելու համար կրկին պատճենեք բնօրինակ քերծվածքը և տեղադրեք այն կամայական տեղում մի քանի շերտերում: Իմ դեպքում քերծվածքները հայտնվում են միայն երկու շերտով։

Այժմ, երբ ֆիլմի անիմացիայի հետ կապված հիմնական օղակը պատրաստ է, մնում է ավելացնել թվերը։ Քանի որ մենք հետ ենք հաշվում 3-ից 1-ին գումարած Go !!! բառը, մեզ էլ ավելի շատ շերտեր են պետք: Ոչ թե 12, այլ 48. Դա անելու համար պետք է պատրաստի շերտերի ևս երեք օրինակ՝ ֆիլմի անիմացիայով։

Եվ հետո ամեն ինչ պարզ է. Միացրեք հենց առաջին շերտը և այնտեղ դրեք երեք թիվը։

Այնուհետև դուք պետք է պատճենեք այս թիվը հաջորդ շերտերում, մինչև շրջանագծի անիմացիան ավարտվի: Երբ հասնեք շերտերի հաջորդ օրինակին, որտեղ շրջանակը նորից ամբողջությամբ կլցվի, պետք է արդեն դնել երկու թիվը։ Նույն կերպ պատճենեք թիվ մեկը ցանկալի շերտերում։ Եվ երբ հասնեք Go !!! վերնագրի վերջնական շերտերին, պարզապես ջնջեք շրջանակը նախքան մակագրությունը ցանկալի շերտում պատճենելը:

Այս ամենը անիմացիայի հետ է կապված: Այստեղ գլխավորը չշփոթվելն է։ Շերտերին կարելի է հարմար անուններ տալ, բայց ես ինչ-որ չափով ծույլ էի :) Եվ այնուամենայնիվ, երբ ավարտեք աշխատանքը, անպայման նորից միացրեք բոլոր շերտերը՝ սեղմելով աչքի պատկերակը:

Արտահանման կարգավորումներով պատուհանում համոզվեք, որ դրեք Export As: AI Layers SWF Frames: Հենց այս տարբերակն է նկարազարդող շերտերը վերածում անիմացիոն շրջանակների։ Այնուհետև սեղմեք Ընդլայնված կոճակը:

Կբացվի լրացուցիչ պարամետրեր... Այստեղ դուք պետք է սահմանեք շրջանակի արագությունը Frame Rate: Ես վայրկյանում 12 կադր ունեմ: Looping վանդակը պատասխանատու է անիմացիայի հանգույցի համար: Նրա շնորհիվ տեսահոլովակը կհնչի շրջանաձեւ։ Իսկ Layer Order: Bottom Up տարբերակը վերարտադրում է նկարազարդողի շերտերը ներքևից վերև վահանակում: Հենց այսպես մենք կառուցեցինք մեր անիմացիան։

Ելքի ժամանակ մենք ստանում ենք ֆլեշ տեսանյութ մեր անիմացիայի հետ:

Այժմ դուք կարող եք տեսնել, որ Adobe Illustrator-ում պարզ անիմացիա պատրաստելն այնքան էլ դժվար չէ, որքան թվում է առաջին հայացքից։

Բայց երկար տեսանյութեր կամ ինտերակտիվ հավելվածներ ստեղծելու համար դեռ ավելի լավ է օգտագործել Adobe Flash-ը կամ այլ ֆլեշ խմբագիրներ: Օրինակ, ես այս կատվին պատրաստել եմ հին Macromedia Flash-ով, որը ես փորել եմ իմ աշխատանքի ժամանակ:

Բացի այդ, վերջերս HTML5-ը և CSS3-ն ավելի ու ավելի են օգտագործվում անիմացիաներ ստեղծելու համար: Այս կոդը աջակցվում է ժամանակակից բրաուզերների կողմից և չի պահանջում ֆլեշ նվագարկիչ:

Հռոմեական aka dacascasհատուկ բլոգի համար Notes of a microstock illustrator

Բաժանորդագրվեք մեր տեղեկագրին, որպեսզի բաց չթողնեք որևէ նոր բան.

Ողջույն բոլորին! Այսօր ես կփորձեմ նկարագրել ծրագրի հնարավորությունները Adobe illustratorհամեմատելով այն ողողման հնարավորությունների հետ: Սա կլինի ոչ թե ծրագրի գլոբալ վերլուծություն ըստ ոսկորների, այլ ավելի շուտ որոշ հետաքրքիր չիպերի նկարագրություն, որոնք ես հայտնաբերեցի այս ծրագրում: Տեղեկատվությունն ուսումնասիրելիս մաս առ մաս հավաքեցի՝ ամեն ինչ մեկ գրառման մեջ դնելու համար։ Անմիջապես պետք է խոստովանեմ, որ ես իլյուստրատորի գերփորձառու օգտատեր չեմ, վերջին վեց ամիսն է միայն այն օգտագործում եմ գծագրության մեջ (մինչ այդ ամեն ինչ նկարում էի ֆլեշով)։ Շատերը դժգոհում են, որ նկարազարդողը բարդ է, միշտ չէ, որ ինտուիտիվ պարզ է: Որոշ չափով համաձայն եմ, որ flush-ից հետո այս ծրագիրը դժվար է։ Բայց այստեղ գլխավորը ոչ թե թողնելն է, այլ ուսումը շարունակելը։ Եվ մի երկու շաբաթ անց միտք է հայտնվում, թե ինչպես կարող էի առանց նրա նախկինում:

Այսպիսով, այն, ինչ ինձ դուր եկավ նկարազարդողի մեջ, և այն, ինչ ես գտա ինձ համար, որը չկա Flash-ում:
1. Սկսեմ ամենապարզից, բայց միևնույն ժամանակ անհրաժեշտից։ Փորձեք առարկաները շրջանաձև դասավորել մի արագությամբ: Նախկինում էր Deco գործիք, բայց այն հանվեց, ըստ երեւույթին ավելորդ համարվեց։ Մենք որոշեցինք, որ ավելի հաճելի է դա անել գրիչներով: Illustrator-ն ունի այս ֆունկցիան. Էֆեկտ - Խեղաթյուրում և փոխակերպում - Փոխակերպում.

Ամեն ինչ արագ և պարզ է, արժեքները (օբյեկտների միջև հեռավորությունը, պատճենների քանակը) սահմանվում են մեր կողմից պարամետրերում:

2. Զիգ-զագ

Նույնիսկ ավելի պարզ, բայց, այնուամենայնիվ, օգտակար բան. Մանրուք կթվա, բայց ակնթարթում պետք է ձեռքով նկարել, իլյուստրատորում դա վայրկյանների հարց է։

3. Օբյեկտների դեֆորմացիա (Warp)

Չկա նման բան մի ֆլեշ. Ստորև բերված օրինակում ես ցույց տվեցի պարզ ձևերը դեֆորմացնելու ընդամենը 2 եղանակ (Effect - Warp - Arc / Fish): Փաստորեն, ծրագրի վերջին տարբերակում դրանք 15-ն են:

4. Անկյունների ավտոմատ կլորացում (կլոր անկյուններ)

Դուք կարող եք դա անել ձեռքով. գրաֆիկական օբյեկտի վրա, երբ ընտրված է, անկյունում հայտնվում է սպիտակ կետ և կլորացված գծի նշան (բոլոր աչքերում): Մենք մկնիկով քաշում ենք, հարմարեցրեք ձեր ճաշակին:

Բայց սա վերաբերում է միայն ձևերին, մատիտի գծով մի փոքր այլ կերպ. կիրառեք կլորացման էֆեկտը ( Էֆեկտ - ոճավորել - կլոր անկյուններ): Ելքի դեպքում մենք ստանում ենք նույն արդյունքը:

5. Կոշտացում (կոշտացում)

Էֆեկտը կիրառվում է պարզ ձևեր (Էֆեկտ - Խեղաթյուրում և փոխակերպում - կոպտում): Ելքի ժամանակ մենք ստանում ենք մի բան, որը նման է ցածր 3D մոդելի: Իմ կարծիքով՝ թույն :) Եվ ամենակարեւորը՝ շատ պարզ։

6. Pucker & Bloat(ձգում և փքվածություն)
Օրինակ ստորև նկարում.

7. Ձևի ընդլայնում (Offset Path)

Flash-ն ունի Expand Fill ֆունկցիա, այն ընդհանրապես չի աշխատում մատիտի գծերով, ի տարբերություն նկարազարդողի:

8. Վրձիններ (Art Brush, Pattern Brush, Scatter Brush)
Տե՛ս ստորև նկարը՝ օրինակներով.

9. Հյուսվածքային խոզանակ

Illustrator-ը նաև պարունակում է շատ հյուսվածքային վրձիններ, որոնց մասին ես գրել եմ և ինչպես են դրանք հայտնվել նոր տարբերակողողել -. Նկատվել է, որ Adobe Animate-ում վրձինների օգտագործումը չափազանց դանդաղ է: վերջ :(

10. Ես վստահ չեմ, թե արդյոք սա ուղղակի հնարք է, բայց ես ուզում եմ կենտրոնանալ զվարճալի անունով վրձնի վրա: ԲլոբԽոզանակ... Գտնվում է գործիքների տուփի մեջ, շատ գեղեցիկ վրձին է օգտագործման համար: Ունի մի փունջ կարգավորումներ, ինձ սովորականից շատ է դուր գալիս: Դժվար է բառերով բացատրել դրա առավելությունների մասին, ավելի լավ է մեկ անգամ փորձել։

10.Split to Grid

Օգտակար է նաև Split to Grid (Object-Path-Split to Grid) ֆունկցիան, որը թույլ է տալիս կտրել ձևը հավասար հատվածների: Ի՞նչ է սա մեզ հիշեցնում: Ճիշտ է, պատուհանները բարձրահարկ շենքում են։ Ինչ վերաբերում է ինձ, մի թույն բան նկարելու համար, օրինակ, քաղաքային տեսարաններ;)

Եւս մեկ օգտակար գործիքներկայացված է Illustrator-ում, հավանաբար առաջին թողարկումից ի վեր: Այն կարող է օգտագործվել, օրինակ, փայտի հյուսվածքներ ստեղծելու համար.

12. Տեղափոխել (աջ - Փոխակերպել - Տեղափոխել)

Օբյեկտի տեղաշարժը սահմանված հեռավորությամբ: Ցանկության դեպքում կարող եք անմիջապես ստեղծել պատճեն, որը կտեղադրվի ընտրված օբյեկտից ցանկալի հեռավորության վրա հորիզոնական / կամ ուղղահայաց: Flash-ի ավելի վաղ տարբերակն ուներ մի պլագին, որն ուներ այս ֆունկցիան... Ցավոք սրտի, չեմ հիշում նրա անունը։

Շատ հարմար է Illustrator-ում ստեղծել անխափան նախշեր ( Օբյեկտ-Պատտերն-Մեյք): Հիշում եմ, թե ինչպես էի խելահեղորեն հմուտ ստեղծագործության մեջ: CC 2015-ի illustrator տարբերակում ամեն ինչ ավտոմատացված է, մի շարք կարգավորումներ կօգնեն ձևավորել նախշը տասնյակ տատանումների մեջ՝ ձեռքի տակ ունենալով ընդամենը մի քանի գրաֆիկական տարրեր: Ավելի շատ վաղ տարբերակներըբոլոր ծրագրերը պետք է կատարվեին ձեռքով, ինչպես մինչ այժմ ֆլեշում:

(Նշում. օրինաչափությունը կարելի է պատրաստել վեկտորային խմբագրվող օբյեկտ՝ օգտագործելով վերլուծական ֆունկցիան ( Օբյեկտ - Ընդլայնել արտաքին տեսքը).

14. Օբյեկտի խճանկար

Գոյություն ունեցող նկարի հիման վրա գունային գունապնակի ստեղծում: Մեզ դուր եկած նկարը ներմուծում ենք հիվանդ (Բաց), այնուհետև Օբյեկտ - Ստեղծել օբյեկտի խճանկար... Պարամետրերում մենք նշում ենք բարձրության և լայնության բաժանման հաճախականությունը:

Եվ ելքում մենք ստանում ենք.

15.Խառնել

Օգտագործվում է գրադիենտներ ստեղծելու համար: Դուք կարող եք ստեղծել քայլ առ քայլ անցումներ, ինչպես, օրինակ, նկարում: Չեմ ասի, որ հաճախ եմ օգտագործում, բայց ինչ-որ մեկին կարող է օգտակար լինել։ Կարծում եմ, որ այն կարող է օգտագործվել պարզ ֆոնային նկարներ ստեղծելու համար:

Նաև գործիքը կարող է օգտագործվել օբյեկտների կլոնավորման համար: Տեղադրեք երկու օբյեկտ միմյանցից հեռավորության վրա և կիրառեք Blend Options, ընտրեք քայլերի քանակը (կլոնավորված օբյեկտների քանակը):

16. Tool Build Shape Tool.Շատ հարմար բան պրիմիտիվների հետ աշխատելու համար։ Մի ակնթարթում ինձ ավելի քիչ հարմար թվաց։

Alt-ը պահելով և ընտրված հատվածների վրա սեղմելով՝ ջնջեք հատվածները: Եթե ​​մկնիկը պարզապես քաշենք մի քանի ընտրված տարածքների վրա՝ միացումներ:

Հավելվածը գործիք է, որն օգնում է ավտոմատ կերպով կտրել, միանալ և այլն: ընդգծված ձևեր. Ինչ վերաբերում է ինձ, դա այնքան էլ հարմար չէ, ավելի հաճախ եմ օգտագործում ԿառուցելՁևավորումԳործիք.

(արտատախտակներ)

18. Custom Tool Panel

Ինքներդ ձեր սեփական գործիքագոտին ստեղծելու ունակություն՝ հրաժարվելով ավելորդներից և ընտրել միայն այն, ինչ դուք օգտագործում եք:

Flash-ում արտտախտակներ, մասնավորապես տեսարաններ ( Տեսարան 1,2,3..) գտնվում են առանձին, և դուք պետք է անցեք դրանց միջև (Shift + F2): Illustrator-ում բոլորը կարող եք տեղադրել ձեր աչքի առաջ: Հարմար է, երբ նույն գծագրի մի քանի տարբերակ եք պատրաստում, որպեսզի համեմատության համար բոլոր տարբերակները ձեր աչքի առաջ լինեն։

19 իզոմետրիա օգտագործելով Գրաֆիկական ոճեր

Եվ վերջինը իզոմետրիա ստեղծելն է՝ առանց այն օգտագործելու 1 կտտոցով (ավելի ճիշտ՝ 3 կտտոցով, քանի որ ունենք 3 կողմ;) գրաֆիկական ոճերի միջոցով ( Գրաֆիկական ոճեր): Ինչպես է դա արվում, հաջորդ անգամ կստորագրեմ։

Illustrator-ը ընդհանրություն ունի ֆլեշի հետ՝ օբյեկտը սիմվոլում պահելու հնարավորությունը, և նույնքան հեշտությամբ այս նշանը կարող է փոխանցվել ֆլեշի (բացել ֆլեշ .ai ֆայլում, ըստ Ներմուծում - Ներմուծում դեպի բեմ).
Illustrator-ում խորհրդանիշն ունի նույն հատկությունները, ինչ Flash-ում:
Իսկ վերջում գրեմ, որ իլյուստրատորում, իմ կարծիքով, զիջում է ֆլեշին։ Այո, այո, և կա նման բան։ Եվ սա լրացման գործիքն է ( Ներկերի դույլ): Ինչքան էլ փորձեմ ընտելանալ հիվանդ ժամանակ, ֆլեշում ավելի հարմար է։
Եթե ​​իմ գրառումները օգտակար դարձան ձեզ համար, կամ եթե ցանկանում եք ինչ-որ բան ավելացնել ձեզանից, բարի գալուստ մեկնաբանություններում: Հաջողություն բոլորին;)

Վեբ գրաֆիկայի օպտիմիզացում

Գրաֆիկական տեղեկատվությունը շատ ավելի դանդաղ է փոխանցվում, քան տեքստայինը, և պատկերների բեռնման ժամանակը համաչափ է նրանց գրաֆիկական ֆայլերի չափերին: Այսպիսով արագ բեռնումՎեբ էջերը ենթադրում են ներկառուցված գրաֆիկայի փոքր չափս, որը ձեռք է բերվում դրանց օպտիմալացման միջոցով: Պատկերի օպտիմալացումը հասկացվում է որպես դրա փոխակերպում, որն ապահովում է ֆայլի նվազագույն չափը՝ պահպանելով պահանջվողը այս դեպքումպատկերի որակը, որը ձեռք է բերվում հիմնականում գրաֆիկական պատկերների գույների քանակի կրճատման, սեղմված և հատուկ ֆայլերի ձևաչափերի օգտագործմամբ և պատկերների առանձին հատվածների սեղմման պարամետրերի օպտիմալացման միջոցով:

Illustrator-ն ունի ներկառուցված պատկերների օպտիմալացման գործիքներ, որոնց շնորհիվ տարբեր մեթոդներնախադիտեք օպտիմալացման գործընթացի արագ և արդյունավետ իրականացումը: Նախադիտումտալիս է բավականին ճշգրիտ պատկերացում, թե ինչպիսին կլինի օպտիմիզացված պատկերը իրական ժամանակում, որն օգնում է գնահատել օպտիմալացման արդյունքը և հաջողությամբ ընտրել անհրաժեշտ պարամետրերը: Եվ դուք կարող եք օպտիմիզացնել ինչպես պատկերները, որոնք ստեղծվել են ուղղակիորեն Illustrator-ում, այնպես էլ մյուսները, օրինակ՝ լուսանկարները, որոնք ենթադրաբար տեղադրվելու են վեբ կայքում:

Օպտիմիզացման պարամետրերը սահմանվում են պատուհանում Պահպանել համացանցի համար(Save for Web) ընտրացանկից նույնանուն հրամանով կանչված Ֆայլ(Ֆայլ): Ծրագիրն առաջարկում է օգտագործել նախադիտման չորս ռեժիմներից մեկը, բայց երկուսը լավագույնս հարմար են օպտիմալացման որակը գնահատելու համար.

• 2-Վեր(երկու տարբերակ) - բնօրինակի և օպտիմիզացված պատկերի միաժամանակյա դիտում՝ նշված պարամետրերին համապատասխան (նկ. 1);
• 4-Վեր(չորս տարբերակ) - այս ռեժիմում դիտման տարածքը բաժանվում է չորս պատուհանների (նկ. 2)՝ ցուցադրելու բնօրինակ պատկերը և երեք տարբերակ՝ օպտիմիզացվածի երեք տարբերակները. առաջին տարբերակը ստեղծվում է սահմանված օպտիմալացման արժեքների հիման վրա, իսկ մյուս երկուսը։ ընթացիկ օպտիմալացման պարամետրերի տարբերակներ են:

Երկու ռեժիմներն էլ կարող են զգալիորեն խնայել ժամանակը որոնումների վրա ավելի լավ տարբերակօպտիմիզացում, քանի որ դրանք վերացնում են պատկերները պահպանելու անհրաժեշտությունը տարբեր պարամետրերօպտիմալացում և դրանց հետագա տեսողական համեմատություն: Բացի այդ, հնարավոր է գնահատել ոչ միայն օպտիմիզացված պատկերի որակը, այլև դրա չափը և բեռնման ժամանակը միացման տարբեր տարբերակների համար: Համեմատության համար, ամենահարմար ռեժիմը 4-Up-ն է (չորս տարբերակ), որը թույլ է տալիս տեսողականորեն գնահատել գունապնակի սեղմման կամ կրճատման ազդեցությունը պատկերի որակի և դրա չափի վրա և, ի վերջո, որոշել. լավագույն պարամետրերըօպտիմալացում։

Illustrator-ը թույլ է տալիս օպտիմիզացնել վեբ գրաֆիկան ոչ միայն GIF, JPG, PNG-8 և PNG-24, այլ նաև SWF և SVG ձևաչափերով: Ինդեքսավորված պատկերներ ունեցող փոքր քանակությամբգույները պահվում են GIF ձևաչափով: Ամբողջական գունավոր և մոխրագույն պատկերները պահպանելու համար՝ լուսանկարներ և գունավոր հարուստ գրաֆիկաներ, ինչպիսիք են գրադիենտ լցոնումները, օգտագործեք JPG ձևաչափ... Թափանցիկ տարածքներով ամբողջական գունավոր պատկերների համար կիրառեք PNG ձևաչափորը թույլ է տալիս պահպանել ինչպես ինդեքսավորված, այնպես էլ ամբողջական գունավոր պատկերներ, մինչդեռ PNG-8 ձևաչափով օպտիմիզացված պատկերի առավելագույն հնարավոր գույների քանակը 256 է, մինչդեռ PNG-24 ձևաչափով պատկերը կարող է ունենալ միլիոնավոր գույներ, և, հետևաբար, նման է JPEG ձևաչափին: PNG-24-ը տարբերվում է JPEG-ից նրանով, որ սեղմման մեթոդը, որն օգտագործվում է PNG-24 պատկերների օպտիմալացման համար, չի հանգեցնում որակի կորստի, բայց մեծացնում է ֆայլի չափը: SVG և SWF ձևաչափերը համատեղում են գրաֆիկան, տեքստը և ինտերակտիվ բաղադրիչները և կարող են նաև օպտիմիզացվել:

Եկեք նայենք պատկերի օպտիմալացման կոնկրետ օրինակին: Ենթադրենք, որ կայքի լոգոն մշակվել է Illustrator-ում (նկ. 3), որը սկզբում պահպանվել է AI ձևաչափով: Համացանցում այն ​​անմիջապես օպտիմալացնելու փորձը ոչ մի լավ բանի չի հանգեցնի, քանի որ այս դեպքում պատկերն ավտոմատ կերպով կկտրվի, ինչը հաշվի չի առնվի դեֆորմացիայի հետևանքով առաջացած տառերի իրական դիրքը (նկ. 4 և 5): .

Հետևաբար, եկեք փորձենք արտահանել պատկերանշանը PSD ձևաչափթիմը Ֆայլ => Արտահանում(File => Export) - ստեղծված պատկերի չափը կլինի 143 ԿԲ: Բացեք ստացված PSD ֆայլը և օգտագործեք հրամանը Ֆայլ => Պահպանել համացանցի համար(Ֆայլ => Պահպանել համացանցի համար): Հաշվի առնելով պատկերի մեջ ներգրավված գույների սահմանափակ քանակությունը, այս դեպքում օպտիմալ է GIF ֆորմատը, որի կոնկրետ կարգավորումներով պետք է որոշել։ Փորձարկելով կարգավորումները՝ կարող եք համոզվել, որ դա լավագույն որակըտալիս է ծրագրի լռելյայն սեղմման ալգորիթմը Ընտրովի(Ընտրովի): Ինչ վերաբերում է հակաալիզացմանը, հաշվի առնելով գրադիենտ լցոնի առկայությունը, ավելի լավ է ընտրել աղմուկի առաջացման ալգորիթմ. Աղմուկ(նկ. 6): Ստացված օպտիմալացման ֆայլի չափը կկազմի 6729 Կբայթ (նկ. 7), մինչդեռ ֆոնի թափանցիկությունը կպահպանվի, ինչը հեշտ է ստուգել՝ HTML ֆայլի հետ միասին պահելով պատկերը GIF ձևաչափով (նկ. 8): Արդյունքում, այս օրինակում emblem.html և emblem.gif ֆայլերը ստացվել են Primer1 թղթապանակում։

Կոճակներ

Ցանկացած վեբ-էջերի դիզայնի անփոխարինելի հատուկ տարր են գրաֆիկական կառավարումները՝ կոճակները: Առանց դրանց էջն ուղղակի անհնար է պատկերացնել։ Կոճակներ նկարելը այսօր դարձել է հատուկ ժանր, և Illustrator-ը թույլ է տալիս ստեղծել ամենաբարդ տարբերակները: Օրինակ, կոճակները, որոնք նախագծված են որպես ցանցային օբյեկտներ և/կամ ծածկույթներով դիմակներ, շատ ավելի տպավորիչ են թվում, քան սովորականները:

Դիտարկենք Illustrator-ում կլոր ուռուցիկ կոճակ ստեղծելու տարբերակը։ Նկարեք շրջանաձև վեկտորային օբյեկտ, որը լցված է ցանկացած գույնով (Նկար 9) և այն փոխարկեք ցանցի՝ օգտագործելով հրամանը Օբյեկտ => Ստեղծել գրադիենտ ցանց(Օբյեկտ => Ստեղծել գրադիենտ ցանց)՝ նշելով չորս տող և չորս սյունակ և ցուցակում. Արտաքին տեսք(Դիտել)՝ ընտրելով տարբերակ Դեպի Կենտրոն Ընդգծել(Հետին լույս) հավասար է 60-ի (նկ. 10): Ընտրեք գործիք Ուղղակի ընտրությունև սեղմեք ձախ կողմում վերին անկյունօբյեկտ՝ ընդգծելով այնտեղ գտնվող հանգույցային կետերը (նկ. 11): Փոխեք համապատասխան բջիջի գույնը սպիտակի` ընտրելով այն ներկապնակում Հավաքածուներ(նկ. 12):

Վերցրեք գործիք Էլիպս(Ellipse), տեղադրեք մկնիկի նշիչը մինչ այդ ստեղծված շրջանագծի կենտրոնում և սեղմած պահելով ստեղները Altև Հերթափոխ, նոր շրջանագիծը ձգեք հնի վրա այնպես, որ այն բոլոր կողմերից 1-2 պիքսել մեծ լինի հինից։ Դարձրեք նրան սև սահման ( Կաթված) 1-2 պիքսել լայնությամբ և լրացրեք շառավղային գրադիենտ կարմիրից մինչև սպիտակ (Նկար 13): Ստեղծված վեկտորային օբյեկտը 1-2 պիքսել քաշեք աջ և ներքև, այնուհետև, առանց ընտրությունը հանելու, սեղմեք դրա վրա աջ սեղմումով և համատեքստային մենյուընտրել թիմ Դասավորել => Ուղարկել Հետ(Կարգավորել => Հետ ուղարկել): Արդյունքում, դուք ստանում եք դատարկ կոճակի համար, որը ներկայացված է Նկ. 14.

Որպես կանոն, ցանկացած վեբ էջում կան նույն տիպի մի քանի կոճակներ, որոնք տարբերվում են, օրինակ, միայն դրանց վրա գծված սլաքների ուղղությամբ՝ նշելով կայքի միջոցով շարժման ուղղությունը: Դիտարկենք երկու կոճակ ունենալու ամենապարզ դեպքը, որոնցից մեկը՝ ներքև սլաքով, կնշանակի շարժվել դեպի հաջորդ էջը, և վերև սլաքի կոճակը նախորդին: Որպես դատարկ սլաք, վերցրեք գործիքով գծված սովորական եռանկյունին Բազմանկյուն(Բազմանկյուն), լցված սևով և նաև ոճավորված որպես ցանցի առարկա՝ ավելի մեծ էֆեկտի համար: Տեղափոխեք սլաքը կոճակի վրա և կարգավորեք բոլոր առարկաների դիրքը միմյանց նկատմամբ՝ օգտագործելով ներկապնակի համապատասխան կոճակները Շարել(Հավասարեցում): Ստացված կոճակներից առաջինը ներկայացված է Նկ. 15. Կատարեք կոճակի շերտի պատճենը՝ ընտրելով հրամանը Կրկնվող շերտ Շերտեր, - արդյունքում ստանում ենք երկու նույնական շերտ։ Այնուհետև շերտի պատճենի վրա ընտրեք սլաքը և պտտեք այն 180 °-ով, ընտրելով հրամանը. Փոխակերպում => Պտտում- Փոխակերպում => Պտտում: Մենք ստանում ենք նույն կոճակը, ինչպես ցույց է տրված նկ. 16. Խնդրում ենք նկատի ունենալ, որ շատ ավելի հարմար է մեկ նախագծի նույն տեսակի բոլոր կոճակները մեկ ֆայլում պահել տարբեր շերտերի վրա, ինչը ցույց է տրված այս դեպքում:

Այժմ դուք պետք է պահպանեք կոճակներից յուրաքանչյուրի օպտիմիզացված տարբերակները: Նախ անտեսանելի դարձրեք ստորին շերտը, այս դեպքում վերին շերտի կոճակը կպահպանվի: Ընտրեք թիմ Ֆայլ => Պահպանել համացանցի համար(File => Save For Web), կարգավորեք կոճակների օպտիմալացման տարբերակները, օրինակ, ինչպես ցույց է տրված Նկ. 17, սեղմեք կոճակը Պահպանել(Պահպանել) և մուտքագրել ֆայլի անունը: Արդյունքում պահպանված կոճակը ներկայացված է Նկ. 18. Այժմ վերադարձրեք ստորին շերտի տեսանելիությունը, իսկ վերինը դարձրեք անտեսանելի և նույն կերպ պահպանեք երկրորդ կոճակը՝ տալով այլ անուն։ Արդյունքը ցույց է տրված Նկ. տասնինը։

Այժմ մնում է միայն համոզվել, որ կոճակները լավ տեսք ունեն վեբ էջում և տեղադրել դրանք հատուկ էջում (Նկար 20): Արդյունքում, այս օրինակում Primer2.html ֆայլը և երկու գրաֆիկական պատկերները պատկերների թղթապանակում (թղթապանակ Այբբենարան 2).

Ցանկության դեպքում, օպտիմալացման գործընթացում, կոճակը հեշտությամբ կարող է վերածվել շերտի: Այս դեպքում հրամանն ընտրելուց հետո Ֆայլ => Պահպանել համացանցի համար(File => Save for Web) և սահմանելով օպտիմալացման պարամետրերը, ընտրեք գործիքը գործիքների գունապնակից Ընտրեք կտոր(Ընտրեք հատված) և կրկնակի սեղմեք պատկերի վրա, որն ի վերջո ինքնաբերաբար կվերածվի 1 սերիական համարով հատվածի (նկ. 21): Կրկնակի սեղմելով մկնիկի վրա, կբացվի պատուհանը Կտորի ընտրանքներ(Slice options), որում պետք է նշել հղումը և ցանկության դեպքում փոխել հատվածի անվանումը (նկ. 22), իսկ հետո պահպանել օպտիմիզացված պատկերը։ Արդյունքն այս դեպքում կլինի Primer3.html ֆայլերը (նկ. 23) և Primer3.gif (Primer3 թղթապանակ):

Ինտերակտիվ տարրեր

Էջը կյանքի կոչելու եղանակներից մեկը դիզայնի տարրերի ներմուծումն է, որոնք փոխում են դրանք տեսքը(կամ վիճակը) կախված մկնիկի վարքագծից կամ, ավելի քիչ հաճախ, ցանկացած այլ իրավիճակի դեպքում՝ մասշտաբում, ոլորում, բեռնում, սխալներ և այլն:

Այդպիսի տարրերից առավել հայտնի են պտտվողները (անգլերենից roll over - գլորվել, շրջվել) - տարրեր, որոնք փոխում են իրենց տեսքը մկնիկի ազդեցության տակ: Անիմացիոն կոճակները բնորոշ շրջադարձերի օրինակներ են: Rollovers-ը հաճախ օգտագործվում է կայքի այլ նավիգացիոն տարրեր ստեղծելու համար: Իրականում ցանկացած rollover ոչ թե մեկ, այլ մի քանի (մինչև չորս) պատկեր է, որոնցից յուրաքանչյուրը համապատասխանում է որոշակի իրադարձության։ Հիմնական իրադարձությունները համարվում են հետևյալը. Նորմալ - նորմալ վիճակ, Over - սավառնել մկնիկի կուրսորը տարրի վրա և վար - սեղմել մկնիկի ձախ կոճակը, երբ կուրսորը սավառնում է դրա վրա: Տեսականորեն կարող են ներգրավվել այնպիսի իրադարձություններ, ինչպիսիք են «Click»՝ սեղմելուց հետո մկնիկի ձախ կոճակը բաց թողնելը, «Վեր»՝ կոճակն ազատելուց հետո, «Դուրս»՝ ակտիվ գոտուց դուրս գալու ժամանակ: Այնուամենայնիվ, գործնականում դրանք հաճախ սահմանափակվում են տարրը փոխելու միայն առաջին երեք կամ նույնիսկ երկու իրադարձությունների համար:

Դասական գլորումներ

Դասական իմաստով rollover-ը GIF պատկերների և համապատասխան HTML կոդի շարք է, որի շնորհիվ, կախված մկնիկի վարքագծից, բրաուզերի պատուհանում մի պատկերը փոխարինում է մյուսին։

Illustrator-ը նախատեսված չէ ուղղակիորեն դասական վերափոխումներ ստեղծելու համար, սակայն այն կարող է օգնել ձեզ նախագծել դրանց սկզբնական տարրերը: Գաղափարն այս դեպքում առաջին իրադարձությանը համապատասխանող պատկերով շերտ ստեղծելն է։ Այնուհետև կրկնօրինակեք շերտը և փոխակերպեք պատկերը, որպեսզի համապատասխանի երկրորդ իրադարձությանը և այլն: Ստացված բազմաշերտ պատկերն արտահանվում է PSD ֆայլ՝ պահպանված շերտերով, որի հիման վրա ստեղծվում է rollover-ը Image Ready ծրագրում։ Illustrator-ի օգտագործման առավելությունը, ինչպես շատ այլ դեպքերում, նրա մի շարք հետաքրքիր առանձնահատկություններ են, որոնք հասանելի չեն մյուսներում: ծրագրային գործիքներ, վեկտորային գրաֆիկայի փոխակերպման հարմարության հետ միասին:

Փորձենք ստեղծել շրջադարձ մակագրության տեսքով, որը փոխում է գույնը՝ կախված մկնիկի վարքագծից։ Բացեք Illustrator-ը և ստեղծեք կլորացված, սևով լցված ուղղանկյունի ձև (Նկար 24), պատճենեք դրա պատճենը և տեղադրեք այն էկրանի ազատ տարածքում: Ուղղանկյունի առաջին օրինակը վերածեք ցանցի առարկայի, որի կենտրոնում ընդգծված է (հրաման Օբյեկտ => Ստեղծել գրադիենտ ցանց- Օբյեկտ => Ստեղծել գրադիենտ ցանց)՝ նշելով չորս տող և տասը սյունակ (Նկար 25): Ակտիվացրեք ուղղանկյունի երկրորդ օրինակը և կարգավորեք դրա գրադիենտ լցոնումը մոտավորապես այնպես, ինչպես ցույց է տրված Նկ. 26. Խառնեք գրադիենտ օբյեկտը ցանցի վրա, իջեցրեք գրադիենտ օբյեկտի անթափանցիկությունը մինչև մոտ 80%, իսկ չափը մոտ 1 պիքսելով՝ ընդօրինակելու բախման էֆեկտը: Եվ հետո մուտքագրեք տեքստը օբյեկտների վրա: Իր սկզբնական տեսքով թող այն ունենա սպիտակ գույն, որը կհամապատասխանի Normal վիճակին (նկ. 27), իսկ հետո, երբ փոխվում է շրջադարձային վիճակը, մակագրության գույնը կփոխվի, օրինակ, կանաչ. մկնիկի ցուցիչը սավառնում է դրա վրա (Over State) և կապույտ - երբ մկնիկի կոճակը սեղմված է (Down վիճակ):

Ուշադրություն դարձրեք գունապնակին Շերտեր- այս փուլում դրա մեջ կա միայն մեկ շերտ: Կատարեք այս շերտի երկու օրինակ՝ օգտագործելով հրամանը Կրկնվող շերտ(Duplicate Layer) գունապնակի մենյուից Շերտեր, - գունապնակում կլինի երեք շերտ (նկ. 28)։ Այնուհետև շերտի առաջին օրինակում փոխեք մակագրության գույնը կանաչի, իսկ երկրորդում՝ կապույտի (նկ. 29): Արդյունքում, դուք կստանաք անհրաժեշտ բլանկը գլորման համար:

Արտահանեք ստեղծված պատկերը PSD ձևաչափի վրա՝ պահպանելով շերտերը՝ օգտագործելով հրամանը Ֆայլ => Արտահանում(File => Export) և ընտրել RGB գույնի մոդելը (նկ. 30): Բացեք ստեղծված PSD ֆայլը ImageReady-ում (նկ. 31 և 32): Ստեղծեք շրջանակներ շերտերից՝ ընտրելով հրամանը Շերտերից շրջանակներ պատրաստեք(Create Frames From Layers) ներկապնակի ընտրացանկից Անիմացիա... Շարժապատկերման պատուհանը նման կլինի Նկ. 33. Միաժամանակ գունապնակում Գլորումներսկզբում կստեղծվի միասնական նորմալ պետություն:

Հետո պատուհանում Անիմացիաընտրեք սավառնող վիճակին համապատասխան շրջանակը՝ ներկապնակում գտնվելու ժամանակ Շերտերշերտը ավտոմատ կերպով ընտրվում է Շերտ 1 Պատճեն(նկ. 34): Անցեք գունապնակ Գլորումներև սեղմեք կոճակի վրա Ստեղծեք Rollover վիճակ(Ստեղծել rollover վիճակ) - նկ. 35, ինչը կհանգեցնի վիճակի ի հայտ գալուն Ավելի քան պետությունգունապնակում Գլորումներ(նկ. 36): Նույն կերպ պետություն ստեղծեք Ներքև վիճակ... Ակտիվացրեք պետությունը Նորմալգունապնակում Գլորումներև ջնջել ներկապնակում Անիմացիաբոլոր շրջանակները, բացառությամբ այն, որը պետք է համապատասխանի պետությանը Նորմալ... Արդյունքում, գունապնակում յուրաքանչյուր rollover վիճակի համար Անիմացիակլինի միայն մեկ շրջանակ (նկ. 37, 38 և 39):

Բրինձ. 38. Պատկերի դիտում, Շարժապատկերների պատուհանները և Շերտերն ու Շրջումներ պալիտրաները Over State վիճակի համար

Ստուգեք արդյունքը՝ սեղմելով կոճակը Նախադիտում լռելյայն դիտարկիչում(Բրաուզերի նախադիտում) գործիքագոտու վրա և նավարկելով դեպի դիտարկիչի պատուհանը (Նկար 40): Դրանից հետո պահեք ֆայլը հրամանի միջոցով Ֆայլ => Պահել օպտիմիզացված(File => Save Optimized) և նշելով տարբերակ HTML և պատկերներ (* .html)... Արդյունքում, այս օրինակում մենք ստացանք Primer4.html ֆայլը և մի շարք գրաֆիկական պատկերներ պատկերների թղթապանակում:

Բրինձ. 40. Բրաուզերի պատուհան Rollover տարրով

SVG rollovers

XML ստանդարտի հիման վրա ստեղծված SVG ձևաչափի աճող ժողովրդականությունը (Scalable Vector Graphics - scalable vector graphics), որը ստեղծվել է XML ստանդարտի հիման վրա, թույլ է տալիս նաև ստանալ մի շարք ինտերակտիվ տարրեր, մասնավորապես rollovers, միայն գործնականում այն ​​իրականացվում է բոլորովին այլ կերպ: Հարկ է նշել, որ ինտերակտիվ SVG rollover-ների ստեղծումը, ի տարբերություն դասականների, երբ համապատասխան HTML կոդը ստեղծվում է ամբողջությամբ ավտոմատ կերպով, պահանջում է JavaScript լեզվի իմացություն և օբյեկտի վրա հիմնված ծրագրավորման հիմնական սկզբունքների իմացություն:

SVG օբյեկտների հետ աշխատելու համար կա հատուկ գունապնակ։ SVG ինտերակտիվություն, որը հեշտ է բացել՝ օգտագործելով հրամանը Պատուհան => SVG ինտերակտիվություն(Պատուհան => SVG ինտերակտիվություն) - նկ. 41.

Հաշվի առեք այս տարբերակըստեղծելով շրջադարձ՝ օգտագործելով ինտերակտիվ կոճակի օրինակը, որի վերնագրի գույնը սևից կփոխվի կապույտի, երբ մկնիկը սավառնում եք, և կրկին կվերածվի սևի, երբ մկնիկը դուրս է գալիս ակտիվ գոտուց:

Ստեղծեք ուղղանկյուն կոճակ կլորացված եզրերով և դրա համար ընտրեք համապատասխան գրադիենտ լցոն, օրինակ, ինչպես ցույց է տրված Նկ. 42. Կարգավորեք կոճակի թափանցիկությունը գունապնակում Թափանցիկություն(Թափանցիկություն) - այս օրինակում պարամետրի արժեքը Անթափանցիկություն(Անթափանցիկություն) սահմանվել է 50%: Կրկնօրինակեք կոճակը, լրացրեք այն մուգ կանաչ գույնով (նկ. 43), այնուհետև հրամանով այն վերածեք ցանցային օբյեկտի. Օբյեկտ => Ստեղծել գրադիենտ ցանց(Օբյեկտ => Ստեղծել գրադիենտ ցանց)՝ նշելով չորս տող և տասը սյունակ և ցուցակում. Արտաքին տեսք(Դիտել)՝ ընտրելով տարբերակ Դեպի Կենտրոն(Կենտրոն) և սահմանելով արժեքը Ընդգծել(ընդգծեք) հավասար է 100-ի: Նվազեցրեք ցանցային օբյեկտի շերտի անթափանցիկությունը մոտ 40%-ով (նկ. 44): Տեղադրեք ցանցի առարկան գրադիենտի վերևում, և կոճակը նման կլինի Նկ. 45.

Բրինձ. 44. Կոճակի պատճենը ցանցավոր օբյեկտի վերածելը

Լրացրեք կոճակը նախատեսված մակագրությամբ և կարգավորեք դրա դիրքը՝ օգտագործելով ներկապնակի համապատասխան կոճակները Շարել(Հավասարեցում): Ստացված պատկերը կպարունակի մեկ շերտ երեք վերադրված օբյեկտներով (Նկար 46): Պլանավորված իրադարձությունները վերաբերելու են տեքստային օբյեկտին, ուստի հարմարության համար փոխեք նրա անունը Տեքստօբյեկտի վրա կրկնակի սեղմելով և նոր անուն մուտքագրելով: Նույն կերպ փոխեք շերտի անվանումը Շերտ 1-ից շերտ(նկ. 47):

Իրադարձությունների մշակումը ենթադրում է JavaScript ընթացակարգերի օգտագործում, այնպես որ դուք պետք է ներառեք այս ընթացակարգերը նկարագրող ֆայլ: Այն կոչվում է Events.js և տեղադրման ընթացքում պահվում է սկավառակի վրա Sample Files \ Sample Art \ SVG \ SVG պանակում: Adobe ծրագրերՆկարազարդող. Events.js ֆայլը միացնելու համար օգտագործեք հրամանը JavaScript ֆայլեր SVG ինտերակտիվություն(նկ. 48): Հաջորդը, դուք պետք է սեղմեք կոճակը Ավելացնել(Ավելացնել) և գտնել ցանկալի ֆայլձեր կոշտ սկավառակի վրա: Երբ նրա անունը հայտնվում է դաշտում URL(նկ. 49), սեղմեք կոճակը Կատարած(Դուրս գալ).

Բրինձ. 48. JavaScript Files հրամանի ընտրություն

Դրանից հետո դուք պետք է սահմանեք օբյեկտի արձագանքը մկնիկի իրադարձություններին: Տեքստ... Ընտրեք Տեքստային օբյեկտը դաշտում Իրադարձություն(Իրադարձության) գունապնակ SVG ինտերակտիվությունընտրել իրադարձություն նավարկելու վրա elemColor (evt, «Text», «# 3333FF»)- սա կնշանակի, որ երբ մկնիկը գտնվում է օբյեկտի վրա Տեքստնրա գույնը փոխվում է կապույտի (նկ. 50): Որպեսզի մկնիկի ակտիվ գոտուց դուրս գալուց հետո տեքստի գույնը փոխվի սևի, դուք պետք է ստեղծեք մեկ այլ իրադարձություն onmouseout- ընտրեք այն դաշտում Իրադարձություն(Իրադարձության) գունապնակ SVG ինտերակտիվություն... Այնուհետև գործողության տողում մուտքագրեք տեքստը elemColor (evt, «Text», «# 000000»)- սա կվերադառնա սև (նկ. 51):

Բրինձ. 51. SVG Interactivity պալիտրա վերջնական տեսքը Text օբյեկտի համար

Պահպանեք ստեղծված rollover-ը որպես SVG ֆայլ հրամանով Ֆայլ => Պահել որպես(Ֆայլ => Ֆայլի տեսակըձևաչափը SVG, և այնուհետև կարգավորելով SVG ֆայլը պահելու տարբերակները, ինչպես ցույց է տրված Նկ. 52. Պահելուց հետո դուք կստանաք միայն մեկ ֆայլ SVG ընդլայնմամբ, և ոչ երկու, ինչպես դասական rollover-ի դեպքում. այս դեպքում ստացվել է Primer5.svg ֆայլը (Primer5 թղթապանակ): Այնուամենայնիվ, որպեսզի rollover-ը իսկապես աշխատի, դուք պետք է լրացուցիչ պատճենեք Events.js ֆայլը JavaScript-ի ընթացակարգերի նկարագրությամբ SVG ֆայլով թղթապանակում: Դրանից հետո դուք կարող եք ստուգել, ​​թե արդյոք շրջվելն աշխատում է, արդյունքը նման կլինի Նկ. 53.

SVG անիմացիա

SVG ձևաչափը կարող է օգտագործվել նաև անիմացիա փոխանցելու համար: Փորձենք ստեղծել ամենապարզ անիմացիոն տարրը (այս դեպքում դա կլինի տեղեկատվություն ընկերության մասին), որը կհայտնվի էկրանին, երբ մկնիկը սավառնում եք համապատասխան գրաֆիկական օբյեկտի վրա և կվերանա, երբ մկնիկը հեռացվում է ինտերակտիվ տարրից։

Եկեք ստեղծենք մի շարք գրաֆիկական և տեքստային օբյեկտներ, ինչպիսին է նկարում ներկայացվածը: 54. Վերանվանել հարմար միջոցբոլոր ստեղծված օբյեկտները հաջորդաբար սեղմելով գունապնակում հաջորդ օբյեկտի անվան վրա Շերտերև մուտքագրելով ցանկալի անունը (նկ. 55): Խնդրում ենք նկատի ունենալ, որ ընդգծված Նկ. 56 օբյեկտ - Text1, Text2, Text3և Ճանապարհ 1- միշտ տեսանելի կլինի, իսկ մնացած բոլորը միայն այն ժամանակ, երբ մկնիկը սավառնում եք օբյեկտի վրա Տեքստ 1.

Բրինձ. 54. Պատկերի բնօրինակ տեսք

Ներառեք Events.js ֆայլը JavaScript-ի ընթացակարգերի նկարագրությամբ՝ օգտագործելով հրամանը JavaScript ֆայլեր (JavaScript ֆայլեր) գունապնակից SVG ինտերակտիվությունսեղմելով կոճակը Ավելացնել(Ավելացնել)՝ կոշտ սկավառակի վրա ընտրելով ցանկալի ֆայլը և սեղմելով կոճակը Կատարած(Դուրս գալ).

Սահմանել ռեակցիա մկնիկի իրադարձություններին օբյեկտի համար Տեքստ 1... Ընտրեք օբյեկտը Տեքստ, դաշտում Իրադարձություն(Իրադարձության) գունապնակ SVG ինտերակտիվությունընտրել իրադարձություն նավարկելու վրաիսկ ներքևի տողում մուտքագրեք տեքստը elemShow (evt, «Text4»); elemShow (evt, «Path2»)... Արդյունքում, երբ մկնիկը գտնվում է օբյեկտի վրա Տեքստ 1առարկաները տեսանելի կդառնան Տեքստ 4և Ճանապարհ 2... Խնդրում ենք նկատի ունենալ, որ եթե մի քանի գործողություններ պետք է կատարվեն, երբ տեղի է ունենում իրադարձություն, ապա դրանք պետք է նշվեն «;» նշանի միջոցով: Այնուհետեւ կատարեք նմանատիպ գործողություն իրադարձության վրա onmouseoutդրա համար մուտքագրելով տեքստ, որը կնշանակի թաքցնել առարկաները (նկ. 57):

Պահպանեք արդյունքը որպես SVG ֆայլ հրամանով Ֆայլ => Պահել որպես(File => Save As)՝ նշելով ֆայլի անունը՝ դաշտում ընտրելով Ֆայլի տեսակը SVG ձևաչափը և այնուհետև կարգավորել SVG ֆայլը պահելու տարբերակները, ինչպես ցույց է տրված Նկ. 58. Պահելուց հետո դուք կստանաք Primer6.svg ֆայլը (Primer6 թղթապանակ): Չմոռանաք պատճենել Events.js ֆայլը այս ֆայլով թղթապանակում: Եթե ​​դրանից հետո գործարկեք cos այս ֆայլը, ապա կտեսնեք արդյունքը, որը ներկայացված է Նկ. 59. Սա գրեթե այն է, ինչ ձեզ հարկավոր է: Միակ բանը, որ ներառված չէր մեր ծրագրերում, օբյեկտների սկզբնական տեսքն էր Տեքստ 4 և Ճանապարհ 2 բեռնախցիկում: Այս թերությունից ազատվելու համար ընտրեք այս երկու օբյեկտները միանգամից և ստեղծեք գործողություն նրանց համար: elemHide (evt, «Text4»); elemHide (evt, «Path2»)միջոցառման ժամանակ բեռնված(նկ. 60): Կրկին պահեք ֆայլը և համոզվեք, որ օբյեկտները հիմա են Տեքստ 4և Ճանապարհ 2տեսանելի է միայն այն ժամանակ, երբ մկնիկը սավառնում եք օբյեկտի վրա Տեքստ 1.

GIF անիմացիա

Ցանկացած վեբ էջ անհնար է պատկերացնել առանց վեբ անիմացիայի, ներառյալ անիմացիոն gif-երը: Դրանց ստեղծման տարբերակներից է Adobe ImageReady հավելվածի օգտագործումը, որը, ի թիվս այլ բաների, թույլ է տալիս շերտերից անիմացիաներ ստեղծել։ Այս դեպքում բազմաշերտ պատկերն ինքնին կարող է պատրաստվել տարբեր ծրագրերում, ներառյալ Adobe Illustrator-ը:

Շատ հեշտ է անիմացիան ստեղծել ներկապնակից տարրերի հիման վրա Խորհրդանիշներ(Սիմվոլներ) բացված հրամանով Պատուհան => Նշաններ(Պատուհան => Նշաններ) կամ խորհրդանիշների գրադարաններից մեկից, որը կարող է բացվել հրամանի միջոցով Պատուհան => Նշանների գրադարաններ(Պատուհան => Նշանների գրադարաններ):

Որպես օրինակ՝ մենք կփորձենք մեծացնել ցանկացած սիմվոլ օբյեկտի չափը, օբյեկտի ընդլայնման գործընթացի հիմնական փուլերը պետք է տեղադրվեն առանձին շերտերի վրա: Նախ, պարզապես տեղադրեք խորհրդանիշ առարկաները մեկը մյուսի վրա, այնուհետև մեծացրեք յուրաքանչյուր հաջորդ առարկայի չափը, օրինակ, ինչպես ցույց է տրված Նկ. 61. Արդյունքում գունապնակում Շերտերկստեղծվի մեկ շերտ՝ բազմաթիվ օբյեկտներով (նկ. 62): Եթե ​​դուք ուղղակիորեն արտահանեք այս պատկերը PSD ձևաչափով, ապա դա չի աշխատի, քանի որ կա միայն մեկ շերտ, և, իհարկե, երբ բացեք PSD ֆայլը ImageReady ծրագրում, կլինի նաև միայն մեկ շերտ: Հետեւաբար, նախ պետք է առարկաներ տեղադրել տարբեր շերտերի վրա: Դա կարելի է անել տարբեր ձևերով. ամենահեշտ ձևը նախ շերտն ընտրելն է: Շերտ 1Շերտերի գունապնակում և օգտագործեք հրամանը Ազատել շերտին(Թողարկեք շերտերին): Արդյունքը կլինի առարկաներից յուրաքանչյուրի շարժումը դեպի իր շերտը, բայց դրանք բոլորը կբնադրվեն շերտում։ Շերտ 1... Հետևաբար, այնուհետև դուք ստիպված կլինեք ձեռքով քաշել բոլոր տեղադրված շերտերը Շերտերի ներկապնակի վերևում, որպեսզի նրանք լինեն շերտից վեր: Շերտ 1իսկ հետո դատարկ շերտը Շերտ 1պարզապես հեռացնել (նկ. 63): Արտահանեք պատկերը PSD ձևաչափով, օգտագործելով հրամանը Ֆայլ => Արտահանում(Ֆայլ => Արտահանում) կարգավորումներով, ինչպես նկ. 64.

Ներբեռնեք ստեղծված PSD ֆայլը ImageReady-ում (Նկարներ 65 և 66): Բացեք պալիտրա ընտրացանկը ԱնիմացիաՇերտերից շրջանակներ պատրաստեք(Ստեղծեք շրջանակներ շերտերից): Արդյունքում կստեղծվի հինգ շրջանակ, որոնցից յուրաքանչյուրը կհամապատասխանի իր սեփական շերտին և ներկապնակի պատուհանին Անիմացիակընդունի այն ձևը, ինչպես նկ. 67.

Դրանից հետո սահմանեք ստեղծված շրջանակներից յուրաքանչյուրի տեւողությունը - այս դեպքում բոլոր կադրերի տեւողությունը սահմանվում է 0,2 վրկ: Եվ հետո հրամանով պահպանեք օպտիմիզացված անիմացիան Ֆայլ => Պահել օպտիմիզացված(Ֆայլ => Պահպանել օպտիմիզացված): Արդյունքը կարող է նմանվել Նկ. 68.

Նույնիսկ ավելի հարմար է ստանալ դատարկ նյութեր, որոնք հեշտ է վերածել անիմացիայի ImageReady-ում, օգտագործել գործառույթները Կենդանի խառնուրդներ Illustrator ծրագրակազմ: Illustrator-ի և ImageReady-ի այս համատեղ օգտագործումը կտրուկ արագացնում է GIF-ի ստեղծման գործընթացը:

Օրինակ, նկարեք երկու կամայական բազմագույն առարկաներ, ապա դրանք միաձուլեք համապատասխան պարամետրերով (նկ. 69): Անհնար է այս ֆայլն ուղղակիորեն օգտագործել անիմացիա ստեղծելու համար, քանի որ պատկերը մեկ շերտի վրա է (նկ. 70): Հետևաբար, նախ պետք է խառնուրդի օբյեկտի յուրաքանչյուր տարր տեղադրել առանձին շերտի վրա: Դրա համար պատուհանում Շերտերընդգծել գիծը , ակտիվացրեք ներկապնակի ընտրացանկը՝ սեղմելով դրա վերին աջ անկյունում գտնվող սև սլաքի վրա և ընտրեք հրամանը. Ազատում շերտերի հաջորդականությանը(Փոխակերպեք շերտերի հաջորդաբար) (նկ. 71): Բանալին սեղմած պահելով Հերթափոխ, ընտրեք ստեղծված շերտերը և դրեք դրանք շերտի վերևում Շերտ 1այնուհետև ջնջեք շերտը Շերտ 1այն զամբյուղ տեղափոխելով, արդյունքում շերտի գունապնակը կստանա նույն ձևը, ինչպես Նկ. 72.

Բրինձ. 70. Շերտերի պատուհանի սկզբնական վիճակը

Արտահանեք ստեղծված ֆայլը PSD ձևաչափի հրամանով Ֆայլ => Արտահանում(Ֆայլ => Արտահանում): Բացեք ստեղծված PSD-ֆայլը ImageReady ծրագրում (նկ. 73): Խնդրում ենք նկատի ունենալ, որ Illustrator-ում ստեղծված բոլոր շերտերը կհայտնվեն Layers պատուհանում (նկ. 74), իսկ պատուհանում. Անիմացիաառայժմ կլինի միայն մեկ շրջանակ.

Ակտիվացրեք ներկապնակի ընտրացանկը Անիմացիասեղմելով ներկապնակի վերին աջ անկյունում գտնվող սև սլաքը և ընտրեք հրամանը Շերտերից շրջանակներ պատրաստեք(Ստեղծեք շրջանակներ շերտերից) - արդյունքում այս օրինակում կստեղծվի հինգ շրջանակ, իսկ ներկապնակի պատուհանը Անիմացիաձևը կընդունի Նկ. 75. Ընտրեք բոլոր շրջանակները՝ սեղմած պահելով Հերթափոխ, և սահմանեք համապատասխան կադրի տևողությունը - այս օրինակում յուրաքանչյուր կադրի համար վերցված է նույն ժամանակը 0,2 վրկ։ Այնուհետև հրամանով պահպանեք օպտիմիզացված ֆայլը Ֆայլ => Պահել օպտիմիզացված(Ֆայլ => Պահպանել օպտիմիզացված)՝ ցանկի մեջ դնելով Ֆայլի տեսակըտարբերակ Միայն պատկերներ (* .gif)... Շարժապատկերը կնմանվի Նկ. 76.

Շատ ավելի հետաքրքիր է ոչ թե շարժվող, այլ խառնուրդ առարկաների սահուն չափափոխումը: Օրինակ, դուք կարող եք օգտագործել արդեն ստեղծված խառնուրդի անցումը: Այս դեպքում, յուրաքանչյուր խառնուրդի անցումային տարրի համար առանձին շերտեր ստեղծելուց հետո, կոճակների միջոցով տեղադրեք բոլոր առարկաները միմյանց վրա։ Հորիզոնական հարթեցման կենտրոն(Հորիզոնական կենտրոնի հավասարեցում) և Ուղղահայաց հարթեցման կենտրոն(Ուղղահայաց կենտրոնական հավասարեցում) գունապնակ Շարել(նկ. 77):

Արտահանել ստեղծված ֆայլը PSD ձևաչափով ( Ֆայլ => Արտահանում- File => Export) և բացել ստեղծված PSD-ֆայլը ImageReady ծրագրում (նկ. 78): Ստեղծեք անիմացիոն շրջանակներ ( Շերտերից շրջանակներ պատրաստեք- Շերտերից ստեղծեք շրջանակներ) և ընտրեք դրանց համապատասխան տեւողությունը (նկ. 79): Եվ հետո, անիմացիան ավելի արդյունավետ դարձնելու համար, պատճենեք առկա կադրերը, բայց ներս հակառակ կարգը- այնպես, որ պատկերը սկզբում մեծանա, ապա փոքրանա, և այդպես շարունակվի շրջանագծի մեջ (նկ. 80): Այնուհետև պահպանեք օպտիմիզացված ֆայլը ( Ֆայլ => Պահել օպտիմիզացված- Ֆայլ => Պահպանել օպտիմալացումով): Ստացված անիմացիան ներկայացված է Նկ. 81.

Բրինձ. 80. Անիմացիայի պատուհանի վիճակը կադրերը կրկնօրինակելուց հետո

Բրինձ. 81. Ավարտված անիմացիա

Flash ֆայլի ձևաչափը (SWF) հիմնված է վեկտորային գրաֆիկաև նախատեսված է համացանցի համար մասշտաբային, կոմպակտ գրաֆիկայի համար: Քանի որ այս ֆայլի ձևաչափը հիմնված է վեկտորային գրաֆիկայի վրա, օբյեկտը պահպանում է պատկերի որակը ցանկացած լուծաչափով և իդեալական է անիմացիոն շրջանակներ ստեղծելու համար: Illustrator-ում դուք կարող եք ստեղծել առանձին անիմացիոն շրջանակներ շերտերի վրա, այնուհետև արտահանել պատկերի շերտերը որպես առանձին շրջանակներ՝ ձեր կայքում օգտագործելու համար: Կարող եք նաև սահմանել խորհրդանիշներ Illustrator ֆայլում՝ անիմացիայի չափը նվազեցնելու համար: Երբ արտահանում եք, յուրաքանչյուր նշան սահմանվում է միայն մեկ անգամ SWF ֆայլում:

Արտահանման հրաման (SWF)

Ապահովում է առավելագույն վերահսկողություն անիմացիայի և բիթերի սեղմման վրա:

Ապահովում է ավելի շատ վերահսկողություն SWF-ի և bitmap ձևաչափերի խառնուրդի վրա՝ մասնատված դասավորության մեջ: Այս հրամանն առաջարկում է ավելի քիչ պատկերի ընտրանքներ, քան Export (SWF) հրամանը, բայց օգտագործում է ամենավերջին օգտագործված Export հրամանի տարբերակները (տես):

SWF ձևաչափով պահելու օբյեկտ պատրաստելիս նկատի ունեցեք հետևյալ ուղեցույցները:

Օգտագործելով Device Central-ը, դուք կարող եք տեսնել, թե ինչ տեսք կունենա Illustrator-ի նկարը հավելվածում: Flash Playerտարբեր ձեռքի սարքերի վրա:

Illustrator Artwork-ի տեղադրում

Illustrator-ում ստեղծված նկարները կարող են արագ, հեշտությամբ և հեշտությամբ պատճենվել և տեղադրվել Flash-ում:

Հետևյալ ատրիբուտները պահպանվում են, երբ դուք տեղադրում եք Illustrator արվեստը Flash-ում:

Եզրագծեր և ձևեր

• Գծի հաստությունը

  Գրադիենտների սահմանում

  Տեքստ (ներառյալ OpenType տառատեսակները)

  Առնչվող պատկերներ

• Միաձուլման ռեժիմներ

Բացի այդ, Illustrator-ը և Flash-ն աջակցում են հետևյալը` գեղարվեստական ​​գործ տեղադրելիս:

Illustrator-ի նկարներում շերտեր ընտրելիս բարձր մակարդակև դրանք Flash-ի մեջ տեղադրելը պահպանում է շերտերը և դրանց հատկությունները (տեսանելիությունը և արգելափակումը):

Illustrator-ի ոչ RGB գունային ձևաչափերը (CMYK, մոխրագույն և հատուկ ձևաչափեր) փոխարկվում են RGB-ի Flash-ի միջոցով: RGB գույները կպչում են սովորական ձևով:

Illustrator-ի գեղարվեստական ​​գործը ներմուծելիս կամ տեղադրելու ժամանակ կարող եք օգտագործել տարբեր ընտրանքներ՝ որոշակի էֆեկտներ պահպանելու համար (օրինակ՝ ստվերը, որը գցվում է տեքստով) որպես Flash զտիչներ:

Flash-ը պահպանում է Illustrator-ի դիմակները:

SWF ֆայլերի արտահանում Illustrator-ից

Illustrator-ից արտահանված SWF ֆայլերը համապատասխանում են Flash-ից արտահանված SWF ֆայլերի որակին և սեղմման հարաբերակցությանը:

Արտահանելիս դուք կարող եք ընտրել մի շարք նախապես սահմանված ոճերից օպտիմալ արդյունքի համար և նշել, թե ինչպես են օգտագործվում մի քանի գեղանկարչական տախտակներ, ինչպես են փոխակերպվում նշանները, շերտերը, տեքստը և դիմակները: Օրինակ, դուք կարող եք արտահանել Illustrator սիմվոլները որպես ֆիլմեր կամ գրաֆիկա, և ստեղծել SWF սիմվոլներ Illustrator-ի շերտերից:

Illustrator ֆայլերի ներմուծում Flash-ի մեջ

Illustrator-ում ամբողջական դասավորություն ստեղծելու և այն Flash-ում մեկ քայլով ներմուծելու համար դուք կարող եք պահպանել նկարը Illustrator-ի բնօրինակ ձևաչափով (AI) և այն բարձր ճշգրտությամբ ներմուծել Flash՝ օգտագործելով File> Import into Desktop. տարածքը կամ File> Import: դեպի գրադարան։

Եթե ​​ձեր Illustrator ֆայլը պարունակում է մի քանի գեղանկարչական տախտակներ, ընտրեք նկարչական տախտակը, որը պետք է ներմուծվի Flash Import երկխոսության վանդակում և նշեք կարգավորումներ այդ գեղանկարչական տախտակի յուրաքանչյուր շերտի համար: Ընտրված գրատախտակի բոլոր օբյեկտները ներմուծվում են Ֆլեշ ծրագիրորպես մեկ շերտ: Երբ դուք ներմուծում եք տարբեր գեղարվեստական ​​տախտակ նույն AI ֆայլից, այդ գեղարվեստական ​​տախտակի օբյեկտները ներմուծվում են Flash՝ որպես նոր շերտ:

Illustrator-ի գեղարվեստական ​​գործերը ներմուծելիս որպես AI, EPS կամ PDF հավելված Flash-ը պահպանում է նույն հատկանիշները, ինչ անում է Illustrator-ի գեղարվեստական ​​աշխատանքը տեղադրելու ժամանակ: Բացի այդ, եթե ձեր ներմուծած Illustrator ֆայլը պարունակում է շերտեր, կարող եք դրանք ներմուծել հետևյալ եղանակներից մեկով:

Փոխակերպեք Illustrator-ի շերտերը Flash շերտերի:

Փոխակերպեք Illustrator-ի շերտերը Flash շրջանակների:

Փոխակերպեք Illustrator-ի բոլոր շերտերը մեկ Flash շերտի: