Як додати фігури в фотошоп і користуватися ними

  1. Як малювати фігури
  2. Використання довільних фігур в фотошопі
  3. Як встановити фігури в фотошопі
  4. можливості фігур
  5. властивості
  6. Для вирізання і додавання
  7. Як вирівнювати фігури щодо інших елементів
  8. Малювання об'єктів за допомогою фігур (практика)

Всім привіт, шановні читачі блогу koskomp і мої дорогі друзі. Сьогодні я розповім вам, як додати фігури в фотошоп, як ними користуватися і для чого вони потрібні. А також в кінці статті ми намалюємо симпатичний стакан в векторному стилі. Багато хто вважає, що від цього інструменту спрямування немає, але я вас запевняю, що в веб-дизайні - це чи не основна функція. Подивіться на дизайн в моєму паблік. Він буквально побудований на фігурах. Тому знати це потрібно. При цьому справа не обмежиться простим малюванням квадратів. Тут все набагато цікавіше.

Як малювати фігури

Почнемо з простого, а саме малювання. Сама по собі група інструментів складається з шести видів:

  • прямокутник
  • Прямокутник із закругленими кутами
  • еліпс
  • багатокутник
  • Лінія (докладніше тут )
  • довільна фігура

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

Щоб додати фігуру, потрібно вибрати її в групі інструментів, і затиснувши ліву кнопку мишки починаємо її вимальовувати, а точніше вибирати область і розмір. Сама по собі фігура може бути будь-якого розміру і за замовчуванням вона буде риси непропорційно. Але якщо затиснути клавішу SHIFT, то вона вийде рівна з усіх боків, і таким чином прямокутник буде квадратом, а еліпс кругом.

Але якщо затиснути клавішу SHIFT, то вона вийде рівна з усіх боків, і таким чином прямокутник буде квадратом, а еліпс кругом

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

Також ми можемо встановити товщину цієї самої обведення, якщо ми все таки наважимося на вибір кольору

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

Для того, щоб змінити колір намальованого об'єкта можна просто знову вибрати інструмент «Фігура» і замінити його у властивостях зверху, або ж натиснути двічі на значок на панелі шарів

Використання довільних фігур в фотошопі

Якщо з усіма вищезгаданими фігурами все зрозуміло (бери і малюй), то трохи хотілося б затриматися саме довільному варіанті. Для початку виберіть цей інструмент.

Тут немає якоїсь чіткої форми (звідси і назва), але зате існує багато вже готових варіантів. Для того, щоб розглянути їх усі, у властивостях елемент «Фігура», а точніше розкрийте його. Як бачите, у нас тут присутні різні контури, за допомогою яких ми можемо намалювати стрілку, сердечко, що забороняє знак і багато іншого.

Як бачите, у нас тут присутні різні контури, за допомогою яких ми можемо намалювати стрілку, сердечко, що забороняє знак і багато іншого

Давайте спробуємо додати в фотошоп довільну фігуру у вигляді галочки. Я задам їй колір, обведення і намалюю її стандартним способом, тобто затиснувши ліву кнопку миші і потягнувши трохи в іншу сторону. Не забуваємо затискати клавішу Shift, щоб дотримуватися всі пропорції. Таким чином можна малювати прикольні нестандартні об'єкти. Примітний і той факт, що будь-якого розміру об'єкт ми не малювали, він завжди буде рівним і гладким. Все це тому, що фігура спочатку векторний об'єкт. А векторні об'єкти складаються з пікселів, як звичайне зображення, а формуються виходячи з формул.

А векторні об'єкти складаються з пікселів, як звичайне зображення, а формуються виходячи з формул

Як встановити фігури в фотошопі

Але сама принадність у тому, що цей набір можна поповнювати, тобто довільні фігури можна завантажити додатково, поповнюючи свою колекцію. Зробити це зовсім легко. Для цього вам достатньо завантажити ці набори з будь-якого сайту, наприклад pixelbox. Там дуже велика колекція з різними наборами. Припустимо, я скачаю цей чудовий набір з скейтбордистами.

Тепер йдемо в папку «Завантаження» або туди, куди у вас викачуються файли за замовчуванням. Далі запускаємо той файл, який ми завантажили. Його навіть не обов'язково розпаковувати, можна запустити прямо в архіві.

Після цього відкриється фотошоп і нові довільні елементи вже з'являться у вашій колекції. Беріть і користуйтеся.

можливості фігур

Самі по собі фігури мають дуже великими можливостями. Спочатку я думав, що за допомогою них можна малювати тільки квадратики і кнопки, але я сильно помилявся. Давайте розберемося докладніше.

властивості

Варто врахувати, що у кожної фігури є свої властивості, які можна змінювати, щоб досягти найбільш цікавого результату. Вони розташовуються в окремому віконці і як правило знаходяться десь в районі панелі шарів, але це необов'язково. Якщо вони у вас не активовані, то зробіть це увійшовши в головному меню в «Вікно» - «Властивості». Після цього можна намалювати будь-який елемент і подивитися, що в ньому можна поміняти.

У прямокутника і прямокутника з закругленими краями один і той же набір властивостей. В основному він стосується радіусу кутів. І якщо в першому випадку він нульовий по всіх фронтах, то в другому він вже заздалегідь встановлений. Ви можете змінити цей самий радіус, роблячи кути більш загругленнимі або навпаки, причому як все відразу, так і окремо.

Давайте заради інтересу намалюємо прямокутник і поставимо радіус 35 тільки в двох кутах (правому верхньому і лівому нижньому). Тільки перед цим обов'язково вимкніть зв'язок кутів, натиснувши на значок скрепочкі між ними, інакше значення будуть змінюватися для всіх.

Тільки перед цим обов'язково вимкніть зв'язок кутів, натиснувши на значок скрепочкі між ними, інакше значення будуть змінюватися для всіх

У разі, якщо ви використовуєте обведення, можна змінити її місце розташування. Тобто, вона може бути зовні фігури, всередині неї або йти по центру контуру. Це ви можете вибрати натиснувши на відповідний значок.

Це ви можете вибрати натиснувши на відповідний значок

Крім того, зверніть увагу на значок шестерінки. Він дає додаткові властивості для ваших фігур. Наприклад, якщо у вас активований прямокутник або еліпс, то можна буде відразу поставити, щоб він малював в рівних пропорціях, щоб отримати квадрат або коло, і вже не доведеться затискати клавішу SHIFT.

Наприклад, якщо у вас активований прямокутник або еліпс, то можна буде відразу поставити, щоб він малював в рівних пропорціях, щоб отримати квадрат або коло, і вже не доведеться затискати клавішу SHIFT

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

Тому не забувайте звертатися до даної функції

Для вирізання і додавання

Але недостатньо просто додати фігури в фотошоп, потрібно навчитися користуватися всіма їх принадами. За замовчуванням, при додаванні нового об'єкта, він створюється на новому шарі. Але якщо ви цього не хочете, то в «операціях з контурами» виберіть пункт «Об'єднати фігури». Тепер ви зможете створювати цілі об'єкти з кількох елементів.

Багато запитають, мовляв як же їх тоді виділяти, якщо вони все будуть на одному шарі? Відповідь проста: на панелі інструментів у нас є два курсора, один з яких відповідає за виділення контуру, а інший за виділення вузла. От саме за допомогою виділення контуру (чорний курсор) ми і зможемо вибрати лише певну фігуру на шарі.

Крім того, ми можемо вирізати, а точніше відняти фігуру з іншого, при цьому не зачіпаючи первісну. Для цього намалюйте інший об'єкт всередині первісного (не забудьте поставити режим «Об'єднати фігури», як ми це робили трохи вище, щоб вони були на одному шарі). Як бачите, поки особливо нічого не змінилося. Але так і повинно бути.

Тепер, виберіть інструмент «Виділення контуру» і ткніте на фігуру, яку ми тільки що намалювали. Після цього знову йдемо в «Операції з контурами», але цього разу вибираємо «Відняти передню фігуру». Ви самі побачите, як її Ніби випиляли і тепер замість неї шматок фону. Але насправді це не так. Елемент як був, так і залишився, просто він стала невидимий, але ви все одно можете його рухати, трансформувати і знову зробити видимим.

Така фішка частенько використовується при створенні логотипів, банерів та інших елементів веб-дизайну.

Як вирівнювати фігури щодо інших елементів

Ще важливою властивістю при малюванні фігур є їх вирівнювання. Наприклад, нам потрібно зробити кілька фігур з однаковою відстанню один від одного, а також на одній лінії. Припустимо я візьму інструмент «Еліпс» і за допомогою затиснутого Shift намалюю кілька кіл.

Тепер, візьмемо вже знайомий чорний курсор, який називається «Виділення контуру» і за допомогою затиснутої кнопкою миші виділимо всі чотири кола, за умови, що вони все таки на одному шарі. Якщо кожен коло у вас знаходиться на різному шарі, то тоді вам потрібно буде виділити саме верстви. Для цього можете використовувати затиснутий SHIFT або CTRL в панелі шарів. Після цього тиснемо правою кнопкою миші і натискаємо «Об'єднати фігури».

Але можна і не об'єднувати. Якщо, наприклад, у вас кожен елемент вимагає власного кольору, то просто виділіть шари і візьміть інструмент «Переміщення», інакше далі у вас нічого не вийде, тобто функції вирівнювання будуть недоступні.

Коли ми все виділили, йдемо в меню «Вирівнювання контуру» і вибираємо ті параметри, які нам потрібні. У моєму випадку я повинен вибрати «Центри по вертикалі» і «Розподілити по ширині». В цьому випадку фігури будуть вирівняні по центру, а відстань між ними буде однаковим. Точно також ця функція працює і в разі з вертикальною розстановкою.

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

Ну і залишилося розібрати ще одна цікава властивість, а саме деформацію. Ні, це не зовсім те, що ми вивчали в цій статті, але ми будемо змінювати зовнішній вигляд фігур.

  1. Припустимо, візьмемо і намалюємо прямокутник із закругленими краями.
  2. Після цього беремо білий курсор ( «Виділення вузла») і виділяємо тільки лівий верхній кут, щоб у нас захопили дві точки. Тепер, не змінюючи інструмент, затискаємо лівою кнопкою миші на цьому самому кутку, після чого починаємо їм управляти і ставити його куди хочемо. При цьому інші кути і сторони залишаються нерухомими.
  3. Точно також можна зробити з іншими кутами. Але пам'ятайте, що якщо ви виділите тільки одну точку на розі, то деформація буде відбуватися абсолютно по іншому.

Точно також я можу з зірки зробити якусь подобу корони. Для цього вибираю багатокутник, у властивостях ставлю режим зірки, а потім малюю її. Після цього вибираю інструмент «Виділення вузла» і починаю рухати всі доступні точки. Приблизно так - до і після.

Малювання об'єктів за допомогою фігур (практика)

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

  1. Вибираємо «Прямокутник із закругленими кутами» і малюємо заготовку нашого склянки. Відразу виберіть відповідний колір для склянки, наприклад коричневий. Для цього змініть його у властивостях зверху. Обведення можна не ставити.
  2. Тепер, виберемо інструмент «Виділення вузла» і виділимо лівий кут заготовки повністю (у вас повинно бути задіяно дві точки, а не одна).
  3. Тепер затисніть SHIFT і натисніть на стрілочку вліво на клавіатурі, після чого у вас вискочить вікно, де буде говоритися те, що дана операція перетворить фігуру в контур. Погоджуйтеся. Після цього ще раз натисніть на стрілку вліво з затиснутим шифтом. Написи вже не буде. Після це маніпуляції лівий кут повинен буде відстовбурчені.
  4. Те ж саме тепер робимо і з правим кутом, тобто виділяємо за допомогою білого курсору і робимо пару натискань на стрілку вправо, щоб відкопилив іншу сторону. Якщо напис знову з'явиться, погоджуйтеся.
  5. Далі створимо кришку. Для цього знову беремо багатокутник із закругленими краями, тільки на цей раз вибрати пункт «Об'єднати фігури» не вийде, так як на одному шарі не можна міняти колір заливки різних контурів.
  6. Далі малюємо прямокутник зверху нашої вийшла трапеції. І якщо у вас вона вийшла не чорного кольору, то поставте його в властивості.
  7. Зараз я бачу, що кришка сильно випирає з обох сторін. Треба б її злегка зменшити з боків. Для цього тиснемо комбінацію клавіш CTRL + T, щоб активувати «Вільне трансформування», після чого затискаємо клавішу ALT і тягнемо трохи за бічну область. Це дозволить зменшити нам кришку з боків пропорційно.
  8. Далі, знову беремо «Виділення вузла» і також як і в попередньому випадку трохи загинаємо кути, по черзі виділивши спочатку один, а потім другий. Вийти в підсумку повинно приблизно так.
  9. Залишається тільки вирівняти всю цю справу. Для цього виділяємо обидва шари в панелі шарів за допомогою затиснутої клавіші CTRL, а потім беремо інструмент "Переміщення" і у властивостях під головним меню ставимо «За центрами по горизонталі».

Можете ще підредагувати деякі елементи, наприклад виділити вузли та зменшити розмір дна, щоб стаканчик виглядав більш природно. Або можете додати деталей, наприклад якусь довільну фігуру. Але в цілому у нас вийшов найпростіший і в той же час стильний стакан в векторному виконанні.

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

Ну а якщо ви хочете знати фотошоп на ура і навчитися ним користуватися на п'ять з плюсом, то рекомендую вам подивитися і вивчити ці офігенний відеоуроки. На сьогоднішній день це один з кращих і докладних крсов по фотошопу, який я коли-небудь бачив. А найголовніше, що все розказано простою людською мовою. тому вам не потрібно буде встромляти в тему, ви все зрозумієте, навіть якщо ви повний новачок. Дуже рекомендую.

Ну а на цьому я свою статтю буду закінчувати. Не забувайте підписуватися на оновлення мого блогу, а також на паблік в соціальних мережах, щоб не пропустити виходу нової статті та цікаву новину. Чекаю вас знову. Удачі вам. Бувай!

З повагою, Дмитро Костін

Багато запитають, мовляв як же їх тоді виділяти, якщо вони все будуть на одному шарі?