Illustrator бағдарламасымен жұмыс істеуге арналған кеңестер. Міне, ақылсыз идея - Illustrator бағдарламасында келесі веб-жобаңызды жасаңыз. Егер сіз негізгі веб-дизайнер болсаңыз, бұл ұсынысқа жақсы жауап бермеуіңіз мүмкін. Illustrator Photoshop жасай алатын барлық нәрсені жасай алмайды, солай ма?

Олай емес.

Дегенмен Photoshop іс жүзінде құралға айналды веб-дизайн, Illustrator сіздің қажеттіліктеріңізді қанағаттандыра алмайды. Орналасу құралдарының арқасында ол көбінесе веб-дизайн үшін жақсырақ және қолайлы бағдарлама болып табылады.

Көптеген веб-дизайн мамандары дәлел іздеп Illustrator қолданбасын аралап көргісі келмейтіндіктен, мен Illustrator қолданбасында веб-дизайнмен тәжірибе жасауды бастау үшін сізге білу қажет вебке қатысты мүмкіндіктердің тізімін жасадым.

Осылардың бірнешеуін қолданып көріңіз, мен сізге веб-дизайн жұмыс процесінде Illustrator қолданбасын стандартты құрал ретінде пайдалана бастауыңызға кепілдік беремін.

1. Ең алдымен: барлық бірліктерді пиксельдер күйіне орнатыңыз. Illustrator бағдарламасымен жұмыс істеуге арналған кеңестер

Әдепкі бойынша Illustrator метриканы пайдаланады нысан және нүкте өлшем бірліктері мәтін үшін. Бұл көптеген дизайн жағдайлары үшін тамаша параметрлер, бірақ үшін веб-дизайн Сіз барлық жерде пикселдерді көргіңіз келетін шығар. Сондықтан басқа нәрсемен жұмысты бастамас бұрын, құрылғыларыңыздың дұрыс орнатылғанына көз жеткізіңіз.

мән бірліктері - пиксельдер. Illustrator бағдарламасымен жұмыс істеуге арналған кеңестер

Бірліктерді пикселдерге орнату үшін:

  1. Өңдеу мәзірінде ашыңыз
  2. Параметрлер ішкі мәзірінен өлшем бірліктерін таңдаңыз.
  3. Барлық опцияларды "пиксель" мәніне орнату

2. Веб-құжат профилін пайдаланып құжаттарды жасаңыз.

 

Жаңа дизайнмен жұмыс істеуді бастағыңыз келгенде, «Жаңа құжат» терезесі арқылы оңай жылжып, кейбір маңызды мәліметтерді өткізіп жіберіңіз, мысалы, CMYK түстерін пайдаланбау үшін Illustrator қолданбасында веб-дизайнмен жұмыс істеуді жоспарлап отырғаныңызды айту. және нысанның бұлыңғыр жиектері. Жаңа құжат терезесінде Интернет профилі параметрін таңдауды ұмытпаңыз, сонда бәрі жақсы болады.

3. Нысандар үшін пиксельді торды туралауды қосыңыз. Illustrator бағдарламасымен жұмыс істеуге арналған кеңестер

Бұл мүмкіндік Photoshop бағдарламасында бұлыңғыр кескін жиектерімен қиындыққа тап болсаңыз, өмірді құтқарады.

Pixel Grid Alignment қисық және көлбеу сегменттерді біркелкі сақтай отырып, пиксельдік торға тамаша сай болу үшін нысанның тікелей көлденең және тік сегменттерін реттейді. Нәтиже - қытырлақ, пиксельдік мінсіз пішіндер — веб-дизайнда сізге қажет нәрсе.

Illustrator бағдарламасымен жұмыс істеуге арналған кеңестер

Үстіңгі түймеде пиксельді торды туралау қосулы, бұл әрқашан қытырлақ жиектерге әкеледі.

Нысан деңгейіндегі пиксельді торды туралауды қосу үшін:

  1. Объектіні таңдаңыз
  2. Трансформация тақтасын ашыңыз (Терезе > Түрлендіру).
  3. Панельдің төменгі жағындағы «Пиксель торына туралау» құсбелгісін қойыңыз (егер оны көрмесеңіз, опцияларды көрсету үшін панельді екі рет басыңыз)

Ескерту. Веб-құжат профилі арқылы жасалған барлық жаңа нысандар үшін пиксельді торды туралау әдепкі бойынша қосылады. Дегенмен, басқа Illustrator файлдарынан нысандарды қойып жатсаңыз, олар үшін пиксельді туралауды қолмен реттеу керек болады. Illustrator бағдарламасымен жұмыс істеуге арналған кеңестер

4. Пиксельді алдын ала қарауды қосыңыз.

Pixel-Preview мүмкіндігі суретті 100%-дан жоғары масштабтау кезінде Illustrator қолданбасын Photoshop сияқты әрекет етеді — әр уақытта тамаша векторларды алудың орнына, растрлық кескінмен жұмыс істегендей пикселдерді көресіз.

Пиксельді алдын ала қарауды қосу сізді Photoshop бағдарламасында жүргендей сезінеді.

Оның қаншалықты керемет екенін ойлап көріңіз - сізде векторлық графиканың барлық күші бар және сіз пиксел деңгейінде нәтиженің қалай көрінетінін көре аласыз.

Ұқыпты, солай емес пе?

Пиксельді алдын ала қарауды қосу немесе өшіру

  1. Көру мәзірін ашыңыз
  2. Pixel View таңдаңыз.

5. Artwork терезелерін пайдаланыңыз. Illustrator бағдарламасымен жұмыс істеуге арналған кеңестер

Сіздің жобаңызға екі бейнекамера бағытталғанын елестетіп көріңіз.

Бір камерада жұмысыңыздың 100% көрсететін қалыпты масштабтау деңгейі бар. Басқа камерада 400% масштабтау деңгейі бар және сіз жұмыс істеп жатқан белгілі бір белгішеге бағытталған.

Хирург сияқты сіз масштабтау камерасын белгішеге шағын пиксель деңгейінде өзгертулер енгізу үшін пайдаланасыз, кейде 100% масштабтау камерасына қарап, оның нақты өлшемінде қалай көрінетінін көресіз.

Illustrator 12 бағдарламасымен жұмыс істеуге арналған кеңестер

Мұқаба терезелері белгішелер сияқты шағын элементтермен жұмыс істеу қажет болғанда тамаша — барлығы қалай көрінетінін тексеру үшін үнемі үлкейту және кішірейту қажет емес.

Бұл Artwork терезелері — олар дизайнды әртүрлі масштабтау деңгейлерімен, түс параметрлерімен және басқа нұсқалармен бір уақытта көруге мүмкіндік береді. Бұл веб-дизайн үшін өте пайдалы, әсіресе пиксел деңгейіндегі мәліметтермен жұмыс істегенде.

Artwork терезелерін пайдалану үшін:

  1. Терезе мәзірін ашыңыз, содан кейін Жаңа терезе таңдаңыз. Illustrator бірдей құжат көрінісімен жаңа қойынды жасайды.
  2. Терезе мәзіріне қайта өтіп, Реттеу > Барлығын терезеге жылжыту тармағын таңдаңыз. Бұл сізге өзгертуге мүмкіндік береді терезелердің өлшемі мен орналасуы өз қалауыңызша бір-бірінің қасында.
  3. Терезелерде әртүрлі масштабтау деңгейлерімен тәжірибе жасап, оның қалай жұмыс істейтінін көру үшін кейбір өзгерістерді енгізе бастаңыз. Illustrator бағдарламасымен жұмыс істеуге арналған кеңестер

6. Түймелерді, белгішелерді және т.б. жылдам жасау үшін таңбаларды пайдаланыңыз.

Photoshop бағдарламасында бірдей (немесе бірдей дерлік) түймені, белгішені немесе виджетті қанша рет жасадыңыз? Егер сіз веб-дизайнмен айналыссаңыз, оны күн сайын жасайсыз.

Illustrator сізге уақытты үнемдеуге және таңбалармен қайталанатын жұмысты болдырмауға көмектеседі.

Түпнұсқасы бойынша рәміздер – дайын заттардың шексіз жиынтығы дизайн элементтері, оны жай сүйреп апару арқылы жұмысқа қосуға болады, содан кейін қажетінше өзгертуге болады. Бұл нөлден жасауды қажет етпейтін түймелер, белгішелер және басқа стандартты нысандар үшін өте қолайлы.

Бірақ таңбалардың күшті болуының тағы бір себебі бар және оны дан жасау деп атайды.

Таңбалар ыңғайлы ғана емес, сонымен қатар қайталанатын дизайн элементтерін жаңартуды жеңілдетеді.

Таңбалар ыңғайлы ғана емес, сонымен қатар қайталанатын дизайн элементтерін жаңартуды жеңілдетеді.

 

Негізінде, бастапқы таңбаға өзгертулер енгізген сайын, бұл өзгерістер өнер туындыңызда табылған таңбаның барлық даналарында бірден көрсетіледі. Сізге веб-сайтыңызға үлкенірек түймелер қажет пе? Тек таңбаны өзгертіңіз. Пішін өрістерінің әр бетте әртүрлі көрінуін қалайсыз ба? Тек таңбаны өзгертіңіз. Сіз идеяны түсінесіз.

Кеңес: Бұл таңбаның белгілі бір данасында болғанын қаламасаңыз, суреттегі нысанды тінтуірдің оң жақ түймешігімен басып, Таңба сілтемесін үзу опциясын таңдаңыз. Бұл оны автоматты жаңартулардан алып тастайды.

Міне, таңбаларды қалай пайдалану және өңдеу керектігін түсіндіретін жақсы бейне:

Adobe Illustrator бағдарламасында таңбаларды пайдалану -дан Adobe теледидары .

Бар таңбаны пайдалану үшін:

  1. Терезе мәзірінен Таңбалар тақтасын ашыңыз.
  2. Таңдалған таңбаны жұмысыңызға сүйреңіз

Жаңа символ жасаңыз:

  1. Символ бейнесін жасаңыз
  2. Терезе мәзірінен Таңбалар тақтасын ашыңыз.
  3. Суретті панельге сүйреңіз
  4. Растау үшін диалогтық терезеде OK түймесін басыңыз.

Таңбаны өңдеу үшін:

  1. Терезе мәзірінен Таңбалар тақтасын ашыңыз.
  2. Өңдеу режиміне өту үшін таңбаны екі рет басыңыз.
  3. Аяқтаған кезде өңдеу режимінен шығу үшін таңба кескінінің сыртындағы кез келген жерді екі рет басыңыз.

7. 9 сегментті масштабтау арқылы нысандарды оңай кеңейтіңіз. Illustrator бағдарламасымен жұмыс істеуге арналған кеңестер

Бұл масштабтау кезінде нысанның қай бөліктері созылатынын және қайсысы өзгеріссіз қалатынын анықтауға мүмкіндік беретін кеңейтілген символология мүмкіндігі.

Сол жақта: 9 сегментті масштабтау параметрі бар және онсыз созылған түйменің мысалы. Оң жақта: 9 сегментті масштабтау параметрі Illustrator қолданбасына нысанның қай бөліктері қорғалғанын және қандай бөліктерді масштабтауға болатынын көрсететін 4 бағыттағышты жылжытуды қамтиды.

 

Практикалық мысал - бұрыштары дөңгеленген түйме - оны ұзарту керек болса, оны жай ғана көлденең соза алмайсыз, себебі бұл бүкіл нысанды бұрмалайды. Оның орнына пішін нүктелерін қолмен жылжытуға тура келеді. 9 сегментті масштабтау арқылы созылу сіз ойлағандай жұмыс істейді. Illustrator бағдарламасымен жұмыс істеуге арналған кеңестер

Оның қалай жұмыс істейтінін шынымен түсіну үшін Adobe TV қолданбасының осы тамаша бейне оқулығын тыңдап, жылдам жұмыс істей аласыз:

Таңбалармен 9 сегментті масштабтауды қолдану -дан Adobe теледидары .

8. Барлық жерде дөңгелектелген бұрыштар!

Photoshop бағдарламасында дөңгелектенген тіктөртбұрышты жасауға болады, бірақ Illustrator кез келген нысанға дерлік бұзбайтын дөңгелектелген бұрыш әсерін қолдануға мүмкіндік береді. Деструктивті емес әсер дегеніміз не? Бұл негізгі бастапқы нысанға әсер етпестен оны қосуға, өшіруге немесе параметрлерін өзгертуге болатынын білдіреді.

Illustrator 23 бағдарламасымен жұмыс істеуге арналған кеңестер

Дөңгелектелген бұрыштар әсерін кез келген нысан түріне қолдануға және қажетінше реттеуге болады. Illustrator бағдарламасымен жұмыс істеуге арналған кеңестер

Дөңгелектелген бұрыш әсерін қолдану үшін:

  1. Төртбұрышты немесе өткір бұрыштары бар кез келген басқа нысанды жасаңыз
  2. Әсерлер мәзірінен Стильдеу > Дөңгеленген бұрыштар тармағын таңдаңыз.
  3. Бұрыш радиусын енгізіп, оның қалай көрінетінін көру үшін «Алдын ала қарау» түймесін басыңыз.
  4. Әсерді қолдану үшін OK түймесін басыңыз.

Дөңгелектелген бұрыш әсерін өзгерту үшін:

  1. Бұрыштары дөңгеленген нысанды таңдаңыз
  2. Терезе мәзірінен Көрініс тақтасын ашыңыз.
  3. Дөңгелектелген бұрыштар әсерін тауып, параметрлерін өзгерту үшін оны екі рет басыңыз немесе қосу немесе өшіру үшін көз белгішесін басыңыз.

9. Растрлық үлгімен жылдам толтыруды құру. Illustrator бағдарламасымен жұмыс істеуге арналған кеңестер

Жіңішке фондық үлгілер веб-дизайндағы үлкен хит, бірақ көптеген дизайнерлер оларды Illustrator бағдарламасында қолдану оңай емес деп ойлайды.

Мойындауым керек, бұл интуитивті емес, бірақ шешім қарапайым.

Растрлық үлгімен жылдам толтыруды жасау

Растрлық үлгіні жасау үшін:

  1. Үлгінің суретін кесіндіңізге салыңыз
  2. Жоғарғы таспадағы «Кірістіру» түймесін басыңыз (маңызды - онсыз жұмыс істемейді!)
  3. Үлгіні Swatches палитрасына сүйреңіз
  4. Кез келген нысанды үлгімен толтыру үшін үлгіні қолданыңыз

10. Суреттер мен объектілердің айналасында мәтінді автоматты түрде орналастыру.

Photoshop өзінің қарапайым мәтінді өңдеу мүмкіндіктерімен танымал. Мәтінді кескіннің айналасына орау керек болса, екі немесе үш түрлі мәтін жақтауларын жасап, әсерді имитациялау керек. Illustrator бағдарламасымен жұмыс істеуге арналған кеңестер

Бақытымызға орай, Illustrator бағдарламасы сізді қамтыды.

Мәтінді кескіннің айналасына орау үшін:

  1. Мәтінді айналдырғыңыз келетін суретті немесе нысанды таңдаңыз
  2. Нысан мәзірін ашыңыз, Мәтінді орау > Жаңа опциясын таңдаңыз.
  3. Орау аралығын орнату үшін Мәтінді орау мәзірін қайта ашыңыз және Мәтінді орау опциялары тармағын таңдаңыз.
  4. Орау әсерін көру үшін суретті мәтіннің үстіне жылжытыңыз

11. Объектінің сыртқы түрі параметрлерімен бай көрнекі әсерлер жасаңыз. Illustrator бағдарламасымен жұмыс істеуге арналған кеңестер

Illustrator бағдарламасында нысанның «Көрініс» тақтасы Photoshop бағдарламасындағы қабат әсерлері сияқты жұмыс істейді — объектіге бірнеше толтырулар мен штрихтар қосуға, содан кейін қызықты нәтижелерге қол жеткізу үшін олардың тасымалдау режимдерін, мөлдірлігін және әсерлерін ойнатуға болады.

Бұл мәтін «Көрініс және әсерлер» тақтасы арқылы мәнерленген жалғыз векторлық нысан ғана.

Ойын алаңы өте үлкен - көлеңкеден, бұлыңғырлық пен жарқыраудан текстураға, бұрмалауға және 3Dге дейін. Осылайша сіз векторлық графикамен жұмыс істей отырып, Photoshop эффектілерінің көпшілігін қайта жасай аласыз.

"Көрініс" панелі күшті және көңілді - мен оны бірден пайдаланып көруді немесе оның қалай жұмыс істейтінін түсіну үшін төмендегі оқулықты қарауды ұсынамын:

Сыртқы көрініс тақтасын меңгеру -дан Adobe теледидары .

Illustrator қолданбасымен тәжірибе жасауға дайынсыз ба?

Photoshop көмегімен веб-сайттар мен пайдаланушы интерфейстерін жасау қазір қалыпты жағдайға айналды және көптеген дизайнерлер бұл шешімге риза. Illustrator бағдарламасымен жұмыс істеуге арналған кеңестер

Бірақ Photoshop соншалықты кең таралғандықтан, Illustrator ұсынатын ештеңесі жоқ дегенді білдірмейді, керісінше. Пиксельді торды туралау, мәтінді орау және нысанның көрінісі сияқты құралдардың көмегімен ол күшті жағдай жасайды.

Күшті біріктірілген орналасу құралдары және векторлық графика, кескінді кесу және экспорттау, Illustrator веб-сайттарды жылдам дамытқысы келетін веб-дизайнерлер үшін анық таңдау болып табылады.