Як створити стилізовані ілюстрації ігри

Jan 31, 2026

Як

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

У цьому Підручник Photoshop Я буду ходити за моїм процесом захоплення стилю тихого апокаліпсису.

Отримати Photoshop CC тут

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

Я можу підсумувати основи таким чином: широкі ділянки тонкої текстури, укладеної в гострих і простих силуетах.

Я візьму вас через мій процес, де ми будемо використовувати форми, які ми досягаємо на ескізі, як основу для остаточних силуетів. Використовуючи прості посібники композиції, щоб забезпечити загальний образ збалансованого, ми дамо зображення живописно виглядати за допомогою текстурних щіток та шрифтів жирним шрифтом. Ми можемо зберегти ці сильні силуети та сміливі форми з однією з моїх улюблених таємних озброєнь: Lasso Tool Photoshop.

Ми додаємо ще одну дику тварину, лося, до списку противників, які ви можете зіткнутися у грі. І ми зосередимося ілюстрацією навколо цього гіганта лісу.

01. Дайте собі (або клієнт) варіанти

Creating thumbnails with composition options aids the artist and the client — Створення ескізів з опціями складу СНІДу художника та клієнта

Завдання полягало в тому, щоб мати лося водою, поблизу березових дерев, і показуючи Cattails помітно, які вони їдять. Є багато інших способів постановки цих елементів. Я придумав 12 мініатюр, щоб дати собі варіанти та генерувати ідеї. Я придумав як варіанти першої, так і третьої особи, для креативний директор і Арт-директор подивитися.

02. Вирішіть якомога більше проблем

Next stage is to refine the chosen thumbnail — Наступний етап - уточнити вибраний ескіз

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

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

Secret: Composition Checks

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

03. Організуйте свій ескіз

Spend some time developing the composition — Проведіть деякий час, розробляючи композицію

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

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

04. Не бійтеся використовувати інструменти перетворення

Free Transform and Warp will help you get the concept just right — Безкоштовна трансформація та деформація допоможе вам отримати концепцію прямо

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

Я використовую безкоштовні інструменти трансформації та деформації ( Cmd + t , клацніть правою кнопкою миші & gt; ), як це необхідно, щоб отримати його в основному правильним, і фарбують будь-які проблеми.

05. Підвищуйте фокусну точку

Lift the focal point from the background — Підніміть фокус з фону

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

06. Маска з вибором

Next, create a selection mask — Далі створіть маску вибору

Інший спосіб я маскую, де я малюю, використовуючи мої шари для створення вибору. На цьому етапі я пофарбував більше гілок і дерев. Тепер я хочу почати додавання деякого світла, що потрапив у верхню частину дерев. Я створюю маску для відбору ( CMD + Shift + натисніть шари).

07. Посилання на освітлення

Getting the lighting right is crucial at this stage — Отримання права освітлення має вирішальне значення на цьому етапі

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

08. Lasso, який вибір

The lasso tool is an underrated ally — Інструмент Lasso є недооціненим союзником

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

Pro Secret: Lasso - це моя таємна зброя

Інструмент вибору Lasso - один з моїх улюблених інструментів Photoshop. Я використовую його для малювання фігур, а також поєднуватися органічні круглі форми з гострими прямими. Деякі ярлики, щоб мати на увазі: Л (Інструмент Lasso); L + cmd + ліфт стилус з таблетки (Отримайте прямі лінії точки до точки); L + зсув (додати до вибору); і L + alt (відняти від відбору).

09. Принесіть на текстурні щітки

Start painting in some texture — Почніть картина в деякій текстурі

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

10. Переробка палітри

It's time to dip into Hue and Saturation — Настав час зануритися в відтінок і насичення

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

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

11. Тепло сонця

The sun's warm glow is added here — Тут додано тепле світло сонця

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

12. Підвищуйте фокусну точку

Making adjustments to the focal point will ensure it draws the eye — Внесення коригувань до фокусного центру забезпечить це привернення очей

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

Pro Secret: Практика з кистями

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

13. Почніть додавати детально

Start adding detail, but remember to stop! — Почніть додавання деталей, але не забудьте зупинити!

Я отримую деякий відгук, щоб перебільшити розмір рогів, тому я збільшую їх розмір. І їх, будучи уваги, не дуже багато каракулі, я починаю додавання деталей на сцену. Якщо я використовую кисті текстури, то я обов'язково дозволяю текстуру робити важкий підйом. Це може зайняти кілька штрихів, щоб отримати правильно так Cmd + z Справний біт, поки я не отримаю інсульт, який є ідеальним.

14. Завершення з свіжими очима

An oft-overlooked stage – step away, then return to your work afresh — Пропущений етап - крок, а потім поверніться до своєї роботи

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

Ця стаття була опублікована Imaginefx Журнальний випуск 157. Купити його тут .

Пов'язані статті:

4 Перки роботи в студії Indie Games
5 порад для Kickstart Ваша 3D кар'єра
5 способів для дизайнерів знайти наступну студію

Як створити стилізовані ілюстрації ігри

01. Дайте собі (або клієнт) варіанти

02. Вирішіть якомога більше проблем

03. Організуйте свій ескіз

04. Не бійтеся використовувати інструменти перетворення

05. Підвищуйте фокусну точку

06. Маска з вибором

07. Посилання на освітлення

08. Lasso, який вибір

09. Принесіть на текстурні щітки

10. Переробка палітри

11. Тепло сонця

12. Підвищуйте фокусну точку

13. Почніть додавати детально

14. Завершення з свіжими очима

Як - Найпопулярніші статті

Як намалювати тварин: 15 кращих порад

Як намалювати лев

Підготуйте дошку для фарбування в 3 простих кроках

Початок роботи з WebGL за допомогою трьох.js

Як створити лаву лаву з Keyshot

Як зробити смачні текстури з олівцями

Як передати звук у живопису

Створіть ефект розливу води в Realflow

Категорії