1. Особливості створення в'язаного текстури
2. Photoshop простіше Illustrator
3. Action Ugly Sweater
4. набори візерунків
5. висновок

У минулих наших матеріалах ми багато розповідали про красивому святковому оформленні дизайну сайту в честь Нового року і Різдва. У той же час, чим ближче сама подія, тим більше в інтернеті починає з'являтися і відповідних тематичних матеріалів. Це візерунки, пензлики, текстури, готові шаблони, фони, actions та інше, та інше.

Але наше з вами особлива увага сьогодні буде прикута до того, як створити фон або текстуру у вигляді в'язки на спицях або інакше, у вигляді джемперной в'язки, в'язки светрів. Ні для кого не секрет, що в'язка з «зимовим» малюнком - «бич» новорічних свят і особливо в західних країнах (аналогічно тому, як кліпарти Санта-Клауса в Росії використовуються набагато частіше, ніж Діда Мороза). Тому, створюючи оформлення для розпродажу в інтернет-магазині, невеликий секції з товарами або для розділу «Наше Новорічне Пропозиція» (а може навіть просто, змінюючи дизайн самого звичайного сайту компанії на новорічно-святковий ), Цілком доречно використовувати невеликий шматочок такого ось виїзного фону або текстурки. Зазвичай у вигляді в'язки зображують оленів, сніжинки, ялинки, кутові орнаменти, крапочки, зірочки, літери і написи. Іншими словами, все те, що легко самостійно вив'язати спицями та нитками.

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

Особливості створення в'язаного текстури

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

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

І ще один момент; він більше пов'язаний саме з в'язанням. Щоб вив'язати малюнок (нехай і новорічний), його розмічають строго по клітинках, асоціюючи кожну петлю з однією клітиною. Тому, щоб і нам в Photoshop намалювати оленя або сніжинку, доведеться її чітко і симетрично розрахувати по клітинках. Насправді це нескладно і в інтернеті таких матеріалів «навалом» і Google приходить на допомогу. Тим більше, що схеми вишивки хрестиком теж можуть підійти, але вони дрібнуваті в деталях.

Створювати красиву в'язану текстуру можна двома способами: самостійно або за допомогою готового Actions. Ми розглянемо два варіанти, бо при самостійному створенні налаштувань і корекцій можна виробляти набагато більше.

Photoshop простіше Illustrator

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

Створюємо новий документ з розмірами 50х50 рх з прозорим фоном. Це буде і наш візерунок, і наша пензлик. Малюємо фігуру Еліпс по висоті нашого квадратика. Товщину його визначите самі, це і відобразить товщину нитки. Виділяємо фігуру ctrl + T і повертаємо її так, щоб нижній кінець був в середині квадрата, а верхній дивився в кут.

Копіюємо шар, затискаючи Alt + ЛФМ і розгортаємо другий еліпс по горизонталі. Поєднуємо дві фігури, щоб їх нижні кінці зійшлися, об'єднуємо шари і зберігаємо як кисть і як візерунок. Меню Редагування -> Визначити кисть і Визначити візерунок.

Створюємо новий документ. Розмір його залежить від вашого візерунка, який ви будете розмножувати. Якщо це частина орнаменту, порахуйте, скільки петельок в ньому. А одна петля у нас 50 рх. Ми вибрали 1000х600, прозорий.

Переходимо в Редагування -> Налаштування -> Напрямні, сітки і встановлюємо лінію сітки кожні 50 пікселів, тобто по ширині нашої петлі. Внутрішнє розподіл на свій розсуд. Потім Перегляд -> Показати -> Сітку.

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

Важливо: для зручності рівності копіювання збільште масштаб зображення, а також включите прив'язку до напрямних, сітці тощо. У вас будуть показуватися і значення зсуву по осях Х і Y, а, значить, вирівняти буде набагато простіше.

Створили смужку. Шарів багато. Об'єднуємо їх. І аналогічним чином починаємо копіювати однієї великої смугою вниз. АЛЕ. Якщо у вас вдома є в'язані речі і ви уважно подивитеся на в'язку, то петельки по вертикалі розташовані дуже близько. Тобто чітко по вертикалі в сітці в Photoshop вирівнювати не варто. Навпаки, підберіть те значення (у нас зміщення було 34 рх по Y), що більш красиво і дотримуйтеся його.

Ці шари теж можна об'єднати, щоб було простіше. Фон залити червоним, блакитним або будь-яким іншим кольором.

Тепер приступимо до найпростішого орнаменту. Створюємо новий шар. І взагалі, все малюнки на тлі петель малюємо на нових шарах. Оскільки різдвяні малюнки зазвичай вив'язуються білим кольором на яскравому контрастному тлі, то вибираємо нашу пензлик. Розмір може бути на пару пікселів більше, ніж оригінальний розмір в 50РХ. Причина в тому, що нитки, буває, теж використовують трохи різні. А такий варіант додасть візерунку реалістичності. І малюємо стовпчик петельками поверх наших фонових петельок. Повірте, вважати і фантазувати по вже заготовленим фону набагато простіше, ніж відразу пензликом малювати, змінюючи кольору. Трохи нижче ще стовпчик, і ще. Потім, готову частину орнаменту можна скопіювати на новий шар. І ось що вийшло.

Далі можна скопіювати вийшов малюнок, зрушити вниз і повернути по вертикалі. Зменшіть розмір і побачите красу орнаменту.

Зрозуміло, що 50 px пензлик може бути і більшою, тому дивіться по сітці (налаштуйте її) і поекспериментуйте з різними варіаціями. Ялинка, написи, олені та інші прикрашення малюються так само. Більш того, можна створити заготовки фону або орнаментів.

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

Action Ugly Sweater

Другий, можливо, більш простий спосіб створення в'язаного малюнка - це використання actions для Photoshop. Ugly Sweater в своєму складі має сам actions, а також узор і стиль.

Запускаємо англійську версію Photoshop і послідовно встановлюємо кожен з трьох файлів. Як це робиться можна прочитати ... та хоча б і в останньому матеріалі по actions 2017 .

Особливість даного доповнення в тому, що перевести в в'язану текстуру можна практично будь-яке зображення. Тобто, зовсім неважливо наскільки воно художнє або схематичне, головне - щоб воно було чітким. Крім цього, перед початком самого Actions ви можете вибрати розмір петель.

Встановили всі файли з архіву, відкриваємо зображення. Ми підібрали найпростіші, але святкові елементи і спробуємо їх «зв'язати».

Ми також вибрали розмір петель 50px (для порівняння) і натискаємо Play. Рано чи пізно з'явиться вікно фільтра Постерізация. Чим більше ви вкажете значення, тим плавніше і градієнтних будуть передані колірні відтінки. У реальному в'язанні відтінки можна передавати, але складно, тому кольори зазвичай чіткі. Ми виберемо щось середнє - 4.

Наступний діалог орієнтований на роботу з кількістю петель в цілому. Або петель буде густо і багато, або мало.

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

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

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

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

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

набори візерунків

Але якщо самим створювати малюнки і в'язки немає бажання / фантазії, то, зрозуміло, в інтернеті можна знайти і готові варіанти візерунків, зображень, орнаментів. Наприклад, на одному тільки freepik можна знайти як просто добірку різдвяних візерунків, так і фонових текстур. І ось які:

Як видно, створені вони за принципом відтворення загального фону петлями, а потім прокраски потрібних петель строго за схемою: одна клітина = одна петля.

висновок

Зрозуміло, в інтернеті можна підібрати і ще більшу кількість готових текстур з різдвяно-новорічною тематикою, і actions для Photoshop, і навіть приклади того, як самим отрисовать орнаменти. Але ми зупинилися на найпростіших рішеннях і варіантах, які ще можна встигнути використати для роботи над новорічним дизайном будь-якого сайту.

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

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

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

З наступаючим вас, читачі, роком рудого песика!