<
  • Главная
Статьи

Створення геометричних паттернів в Illustrator - PhotoDrum.com - сайт дизайнера

  1. Створення кубічного фонового малюнка
  2. намалюйте шестигранник
  3. Поворот на 30 °
  4. Малюємо вертикальну лінію
  5. Вирівнювання по вертикалі і по горизонталі
  6. Копіювання і поворот лінії на -60 °
  7. Вирівнювання по вертикалі і по горизонталі
  8. Поділ на трикутні сегменти
  9. застосування кольору
  10. робимо шаблон
  11. застосовуємо шаблон
  12. Створення трикутного фонового малюнка
  13. Створюємо розділові лінії
  14. малюємо прямокутник
  15. створюємо трикутник
  16. Копіювання і поворот на 120 °
  17. Копіювання і поворот на 60 °
  18. Видалення непотрібних частин
  19. Копіювання і відображення
  20. створюємо патерн

Нещодавно я отримав листа з питанням - як створити такого роду патерн в Photoshop або Illustrator. З введенням в Illustrator CS6 інструменту Pattern Maker дозволяє створювати шаблони різних типів плитки, а не тільки квадратні, як раніше. Це одна з причин, чому я вважаю за краще Illustrator, а не Photoshop для такого роду геометричних творінь. У цьому уроці я поясню, два з трьох шаблонів, показаних в прикладі.

Створення кубічного фонового малюнка

У цій частині уроку я покажу вам, як можна створити кубічний фоновий патерн за допомогою інструменту Pattern Maker в Illustrator. Для цього необхідно мати версію Illustrator не нижче CS6. Давайте почнемо…

намалюйте шестигранник

намалюйте шестигранник

Виберіть інструмент Polygon Tool, яка знаходиться під іконкою Rectangle Tool і натисніть на полотні ...

Виберіть інструмент Polygon Tool, яка знаходиться під іконкою Rectangle Tool і натисніть на полотні

Введіть у відповідних полях: радіус рівний 100px, і 6 в якості кількості сторін. Натисніть OK. З чисто практичних міркувань, задайте шестикутника заливку будь-якого кольору, але без обведення.

Поворот на 30 °

Поворот на 30 °

Для перетворення цього об'єкта в куб, ми повинні повернути шестигранник на 30 °. Вибравши шестикутник і використовую інструмент Rotate Tool затисніть клавішу Alt / Option і клацніть мишею в центрі. Введіть 30 ° в якості значення кута повороту, і натисніть кнопку ОК.

Малюємо вертикальну лінію

Малюємо вертикальну лінію

Тепер ми створимо розділові лінії, щоб розділити цей об'єкт на 6 трикутників. Почнемо з малювання вертикальної лінії. Виберіть інструмент Line Tool і намалюйте вертикальну лінію десь в центрі шестикутника (для вашої зручності утримуючи клавішу Shift).

Вирівнювання по вертикалі і по горизонталі

Вирівнювання по вертикалі і по горизонталі

Тепер, виберіть обидва об'єкти і натисніть Align Vertical Center і Align Horizontal Center, у верхній частині робочої області. Якщо ви не бачите цю панель, то включіть її View> Control.

Копіювання і поворот лінії на -60 °

Копіювання і поворот лінії на -60 °

Виберіть одну тільки вертикальну лінію, виберіть інструмент Rotate Tool і натиснувши кнопку Alt / Option клікніть точно в центрі лінії. Щоб простіше знаходити точне місце, включите Smart Guides: перейти до View> Smart Guides. Якщо ви бачите галочку, то вони вже включені. Ви можете використовувати комбінацію клавіш Cmd / Ctrl + U, щоб включати і вимикати Smart Guides.

Ви можете використовувати комбінацію клавіш Cmd / Ctrl + U, щоб включати і вимикати Smart Guides

У вікні введіть -60 ° як значення кута повороту, і переконайтеся, що натиснули на кнопку Copy. Тепер, використовую поєднання кнопок Cmd / Ctrl + D щоб повторити цю дію (Object> Transform> Transform Again).

Вирівнювання по вертикалі і по горизонталі

Вирівнювання по вертикалі і по горизонталі

Так само, як і раніше, виберіть всі об'єкти і натисніть на Align Vertical Center і Align Horizontal Center.

Поділ на трикутні сегменти

Поділ на трикутні сегменти

Виділивши всі об'єкти, перейдіть до панелі Pathfinder і виберіть Divide. Це розділить шестикутник на 6 трикутників.

застосування кольору

застосування кольору

Тепер виберіть кожен трикутник і надайте йому колір. використовуйте інструмент Direct Selection Tool (біла стрілка), щоб вибирати потрібний вам трикутник. Ви можете вибрати будь-який вподобаний вам колір.

робимо шаблон

робимо шаблон

Тепер починається найцікавіше! Виберіть об'єкт і перейдіть до Object> Pattern> Make.

Виберіть об'єкт і перейдіть до Object> Pattern> Make

Illustrator видасть попередження, що картина буде збережений в панелі Swatches. Просто натисніть кнопку ОК. Тепер ви перебуваєте в режимі Pattern. Виберіть Hex by Row в випадаючому меню і введіть ім'я у відповідне поле. От і все! Тепер ви можете застосовувати шаблон ...

застосовуємо шаблон

застосовуємо шаблон

Щоб застосувати створений нами патерн (Pattern), намалюйте прямокутник і виберіть патерн як заливки на панелі Swatches. Часто буває, що отримується зображення або занадто велике або занадто мале. Щоб це виправити я зазвичай зраджую розмір об'єкта за допомогою масштабу. Наприклад, встановлюю 500% за допомогою Scale Tool (Alt / Option і натискаємо мишею), не забувши переконатися, що галочка Transform patterns у вікні Scale знята.

Наприклад, встановлюю 500% за допомогою Scale Tool (Alt / Option і натискаємо мишею), не забувши переконатися, що галочка Transform patterns у вікні Scale знята

Потім я масштабується об'єкт назад в його оригінальний розмір, знову використовуючи інструмент Scale Tool, і, вводячи значення 20%. Так як спочатку я збільшив свій об'єкт 5 разів більше (на 500%), тепер потрібно зробити його в 5 разів менше. Тепер я ставлю галочку Transform patterns і натискаю кнопку ОК.

Створення трикутного фонового малюнка

Наступний урок навчить нас створення трикутного патерну. Ви побачите, що ми будемо використовувати схожу техніку поділу об'єкта на трикутники. Давайте почнемо ...

Створюємо розділові лінії

Створюємо розділові лінії

Виберіть інструмент Line Tool і намалюйте вертикальну лінію (утримуючи клавішу Shift). Колір контуру можете використовувати будь-який, який вам подобається. Тепер виберіть інструмент Rotate Tool і натиснувши клавішу Alt / Option натисніть точно у верхній точці лінії. У вікні, яке з'являється введіть 120 ° як значення кута обертання, і переконайтеся, що натискаєте на кнопку Copy. Потім, натисніть Cmd / Ctrl + D, щоб повторити цю дію.

малюємо прямокутник

малюємо прямокутник

Групуємо 3 лінії разом, перейшовши в Object> Group або використовуючи поєднання клавіш Cmd / Ctrl + G. Тепер, виберіть інструмент Rectangle Tool і намалюйте прямокутник (пейзажної орієнтації), починаючи в точці перетину з лівої лінії, в лівому верхньому кутку (див. Зображення вище). Далі виберіть обидва об'єкти (прямокутник і групу ліній) і зробіть вирівнювання по центру горизонталі і вертикалі.

створюємо трикутник

створюємо трикутник

Виділіть прямокутник і помістіть його нижче групи ліній, перейшовши по Object> Arrange> Send to Back і натисніть Divide на панелі Pathfinder.

Копіювання і поворот на 120 °

Копіювання і поворот на 120 °

Виберіть інструмент Direct Selection Tool (біла стрілка) і видаліть нижнє 2 трикутника. Інструментом Rotate Tool, натиснувши клавішу Alt / Option клікніть мишею в нижній точці трикутника. У вікні Rotate введіть 120 ° як значення кута обертання, і переконайтеся, що натиснули на кнопку Copy. Тепер натисніть на поєднання клавіш Cmd / Ctrl + D щоб повторити дію.

Копіювання і поворот на 60 °

Копіювання і поворот на 60 °

Якщо ви хочете, то ви вже можете застосовувати кольори для кожного трикутника. У своєму прикладі я вибрав наступні кольори, щоб створити ефект глибини. Тепер виберіть обидва вертикальних трикутника. Інструментом Rotate Tool знову з натиснутим Alt / Option клікніть саме в нижній точці зіткнення обраних трикутників. У вікні Rotate введіть 60 ° в якості значення кута повороту, і переконайтеся, що натиснули на кнопку Copy.

У вікні Rotate введіть 60 ° в якості значення кута повороту, і переконайтеся, що натиснули на кнопку Copy

Якщо вам хочеться, ви можете вибрати інші кольори для цих 2 трикутників. Тут все залежить від вас.

Видалення непотрібних частин

Видалення непотрібних частин

Так як я хочу, щоб в кінцевому підсумку отримати патерн ідеально-прямокутної форми, мені потрібно видалити одну половину нижнього трикутника. Я можу це легко зробити за допомогою інструменту Pathfinder.

Копіювання і відображення

Копіювання і відображення

Виберіть 2 трикутні форми зліва, і виберіть інструмент Reflect Tool (натиснувши клавішу О). Затиснувши кнопку Alt / Option клікніть мишею як показано на малюнку вище. У вікні виберіть Vertical Axis і натисніть на Copy.

створюємо патерн

створюємо патерн

Виберіть всі об'єкти і перейти до Object> Pattern> Make.

Виберіть всі об'єкти і перейти до Object> Pattern> Make

В панелі Options Pattern виберіть Grid в типі плитки і задайте своє ім'я для патерну. Поміняйте кольору, якщо вам це потрібно за допомогою інструменту Direct Selection Tool.

От і все! Тепер у вас в руках знання, яке допоможе вам творити свої неповторні патерни. Отримуйте задоволення і експериментуйте!

Автор тут .

оцінка відвідувачів

[Всього: 7 Загальна: 3.4]



Новости
  • Виртуальный хостинг

    Виртуальный хостинг. Возможности сервера распределяются в равной мере между всеми... 
    Читать полностью

  • Редизайн сайта

    Редизайн сайта – это полное либо частичное обновление дизайна существующего сайта.... 
    Читать полностью

  • Консалтинг, услуги контент-менеджера

    Сопровождение любых интернет ресурсов;- Знание HTML и CSS- Поиск и обновление контента;-... 
    Читать полностью

  • Трафик из соцсетей

    Сравнительно дешевый способ по сравнению с поисковым и контекстным видами раскрутки... 
    Читать полностью

  • Поисковая оптимизация

    Поисковая оптимизация (англ. search engine optimization, SEO) — поднятие позиций сайта в результатах... 
    Читать полностью