«Галоп пікселя — частина четверта» — Анімація світла і тіні



Доброго часу доби Хабру і цінителям піксель-арту, шанувальникам квадратних точок, адептам лімітованих дозволів і квітів. Радий представити на ваш суд чергову статтю з циклу «Галоп Пікселя». Не буду витрачати час на виправдання мого довгої відсутності і в увазі явної присутності перейду до суті справи. Сьогодні ми продовжимо вивчати анімацію. На цей раз це буде анімація світла і тіні. Здебільшого на статичних об'єктах. Всі пам'ятають – спочатку база. Спочатку фундамент. Спочатку просте. Ну а складне ввалится у ваші двері само, слідом за діточками.

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

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

Лопати в руки.



Читати далі →

«Галоп пікселя — частина друга» — перспектива, колір, анатомія та прикладні вправи



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

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

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



Читати далі →

«Галоп пікселя - частина перша» - базові поняття, етапи дорослішання, прикладні вправи



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

У даній публікації ми не розглядаємо програми, але копаємо щось більше. Самі пікселі. Від джерел, почавши з чотириколірної CGA-ери аж до епохи ренесансу. У публікації ми не розглядаємо гри, не співаємо дифірамби художникам минулого (хіба що зовсім небагато), займаючись саме процесом створення найпростішого піксель-арту. Даний матеріал буде цікавий артистам-початківцям і зацікавленим. Стаття практично не містить теорії, нудних умовиводів і являє сторонній погляд на світ піксель-арту з боку якогось самоучки, який вирішив відкрити кожну з Америк самостійно, не озираючись на офіційних загальновизнаних і задокументованих Колумбів. Стаття забезпечена великою кількістю пояснювальних ілюстрацій, прикладів, і рад.

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



Читати далі →

Курс піксель-арту 6

Це переклад публікації «Les Forges Pixel Art Course».

Частина 1: Правильні інструменти
Частина 2: Лінії і криві
Частина 3: Перспективи
Частина 4: Тінь і світло
Частина 5: Палітри кольорів
Частина 6: Згладжування
Частина 7: Текстури і розмиття
Частина 8: Світ тайлів

Частина 6: Згладжування (Anti-aliasing)

Де весь ваш піксель-арт стає красивим. Чи ні. Насправді це залежить від того, наскільки жахливий він був раніше.
image

Читати далі →

Pixel Дизайн надзвичайно актуальне в даний момент

image

Це певний комфорт, а більше того класно, коли річ отримує статус «ретро». '69 Ford Mustang.Висока зачіска з валиком. Бетті Уайт. Pixel дизайн.


Читати далі →

Курс піксель-арту 5

Це переклад публікації «Les Forges Pixel Art Course».

Частина 1: Правильні інструменти
Частина 2: Лінії і криві
Частина 3: Перспективи
Частина 4: Тінь і світло
Частина 5: Палітри кольорів
Частина 6: Згладжування
Частина 7: Текстури і розмиття
Частина 8: Світ тайлів

Частина 5: Колірні палітри

1. Коли і чому вибирати палітру?
Хороше запитання, чому зрештою я почав про це? Просто тому що палітра — це 50% якості вашої роботи. На всьому протязі гри важливо мати послідовні панелі, тому що вони суттєво сприяють загальній атмосфері. Загалом, що становить різницю між хорошою і невдалою графікою, це в значній мірі палітра. «Добре, це важливо мати хороший вибір, я зроблю це в кінці». А-та-та, звичайно ні! Палітра працює від початку до кінця, коли ви малюєте піксель-арт. Для мене це перше і останнє що я роблю: я починаю зі створення стартової панелі в кутку мого зображення, потім я підлаштовую її по мірі просування, потім, як закінчу, я витрачаю час на поліпшення її. Покращення в основному зумовлені «чуттям», то що ви вивчіть тут, може бути поставлено під сумнів: це просто стартова точка.

Читати далі →

Курс піксель-арту 4

Це переклад публікації «Les Forges Pixel Art Course».

Частина 1: Правильні інструменти
Частина 2: Лінії і криві
Частина 3: Перспективи
Частина 4: Тінь і світло
Частина 5: Палітри кольорів
Частина 6: Згладжування
Частина 7: Текстури і розмиття
Частина 8: Світ тайлів

Частина 4: Тінь і світло

Сьогодні ми перейдемо з 2D в 3D, в той час як залишимося в 2D. Ви побачите (або немає). З тим що ми обговорювали досі, ви зможете робити красиві штрихові малюнки та малювати предмети з коректною перспективою. Це гарний початок, але цього недостатньо, щоб робити піксель-арт. У цій частині ми поглянемо на затінення. Це набір технік, що дозволить нам ліпити наші краєвиди і персонажів щоб уявити обсяг (і я врятую вас від довгого розповіді про традиційну важливості цієї частини, ЦЕ ПРОСТО СУПЕР ВАЖЛИВО).

Читати далі →

Курс піксель-арту 3

Це переклад публікації «Les Forges Pixel Art Course».

Частина 1: Правильні інструменти
Частина 2: Лінії і криві
Частина 3: Перспективи
Частина 4: Тіні і світло
Частина 5: Палітри кольорів
Частина 6: Згладжування
Частина 7: Текстури і розмиття
Частина 8: Світ тайлів

Частина 3: Перспективи

Проблема перспективи в 2D іграх, це питання яке виникає часто, і це можливо те, чому так багато аматорських ігор мають безліч противоречивостей в цій області. Зокрема ця частина адресується до типовим перспектив у RPG, так що якщо ви шукаєте інформацію про вид збоку або від першої особи, вам слід пошукати де-небудь ще. Це важливо, пам'ятати що перспектива — це «мистецтво представлення тривимірних об'єктів на плоскій поверхні (в даному випадку це ваш екран) як їх побачив би спостерігач.»

Читати далі →

Курс піксель-арту 2

Частина 2: Лінії і криві

Якщо ви ще не відбувся художник, кращий шлях почати малювати, робити це олівцем, після чого обводити чорнилом, потім розфарбовувати. Те ж саме стосується і до піксель-арту: перший крок у зображенні, це позначити контури — цей крок називається «штриховий малюнок» (Lineart). Штриховий малюнок — це дуже важливий крок для досягнення хорошого результату. Кілька пікселів зображення, можуть бути більшою його частиною (в протилежність малювання, де масштаб дозволяє більше припущень) так що помилка в один або два пікселя, може зробити так, що ваш персонаж буде виглядати спотвореним. Для ясності, точність штрихового малюнка є Р-Е-Ш-А-Ю-Щ-Е-Й для успіху піксель-арту.

Читати далі →

Курс піксель-арту

Це переклад статті.

Передмова



Є багато визначень піксель-арту, але тут ми будемо використовувати таке: зображення піксель-арт, якщо воно створено цілком руками, і присутній контроль над кольором і позицією кожного пікселя, який намальований. Безсумнівно, в піксель арт включення або використання кистей або інструментів розмиття або машин деградації (degraded machines, не впевнений), та інших опцій, які «сучасним», нами не
використовуються (взагалі-то put at our disposal значить «в нашому розпорядженні», але за логікою начебто так правильніше). Він обмежений такими інструментами як «олівець» і «заливка».

Проте не скажеш, що піксель-арт або не-піксель-арт графіка — більш або менш красива. Справедливіше сказати, що піксель-арт інший, і він краще підходить для ігор стилю «ретро» (як Супер Нінтендо або Гейм Бій). Ви також можете комбінувати техніки вивчені тут, з ефектами з не-піксель-арту, для створення гібридного стилю.

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

Читати далі →