2д спрайт дерев для платформера. Спрайти для ігор – що це таке? Плоскі та вигнуті поверхні

З цієї статті ви отримаєте загальні уявлення, як малювати круту 2D графіку для ігор. Це не покроковий туторіал, це щось у рази крутіше!

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

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

Список тем:

Форми
Анатомія та пропорції
Перспектива
Наука про колір
Освітлення та затінення
Відточування навичок

Якщо ці пункти не схопили вас за живе, наочна демонстрація ваших здібностей «до» та «після» йде нижче:

Факт із інтернету!

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

У повсякденному життіми звикли часто бачити 2D-зображення. Але розуміти, що річ виглядає красиво, не те саме, що знати, чомуце так. Будь-яке двовимірне зображення можна розбити на базові елементи, тому ви можете уявляти собі створення двовимірної графіки як поєднання цих елементів, щоб: 1) Вийшло схоже на те, що ви мали на увазі; і 2) Не було супер потворно. Наприклад, ми всі знаємо, як виглядають квадрат і сфера, але яке це має відношення до створення зрозумілого на вигляд персонажа?

Щоб відповісти на це, ми приступаємо до першої частини:

Форми

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

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

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

Перспектива

Перспектива – це створення ілюзії глибини на 2D-поверхні, вона виходить шляхом зміни форм та контурів предметів, і це досить велика тема, тому ви побачите тут кілька підзаголовків.

Геометрична перспектива

У більшості 2D ігор творці просто не бажають зв'язуватися з геометричною перспективою, тому що її реалістична реалізація в графіці буде дуже трудомісткою. Щоб піти легким шляхом, розробники користуються нереалістичним припущенням, що збоку все видно однаково добре (як у класичному платформері Super Mario), або розгортають графіку більш реальною на вигляд, але все ж таки далекою від реальності ізометричної проекції.

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

Ще більше враження навів би поїзд, що мчить назустріч.

Ви звернули увагу як сходяться паралельні лінії (реальні та уявні)?

Можна додати ще більше червоних ліній, але все зрозуміло

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

Точка сходу та лінія горизонту за своєю суттю втілюють просту ідею: предмети, що знаходяться вдалині, виглядають менше предметів, які ближче до нас. А наближена до нас сторона предмета здається більшою, ніж віддалена. У наведеному вище прикладі використана лише одна точка сходу, але насправді на картині буде стільки точок сходу, скільки є наборів паралельних ліній – для кожного своя. Звучить надто складно? Так і є, тому в малюнках перспектива зазвичай спрощується до одно-, дво- та триточкової. В одно- та двоточковій перспективі передбачається, що один або кілька наборів паралельних ліній залишаються паралельними назавжди і ніколи не сходяться. Ось приклад куба та паралелепіпеда в одноточковій перспективі:

Олівець та папір… А ви на що сподівалися?

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

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

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

У триточковій перспективі об'єкт виглядає епічно, принаймні з погляду висоти

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

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

Коло перетворюється на еліпс

Ось просте правило. Коли ви дивитесь на край циліндра (наприклад, дах круглої будівлі), крива вигинається вгору. Коли ви дивитеся вниз, наприклад, на основу стовбура дерева, крива вигинається вниз. Через середину зображення проходить лінія горизонту.

Щоб показати обсяг фігур, їх слід було б заштрихувати, але ми залишимо так

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

Ракурс

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

Грубо, але зрозуміло

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

Циліндри малювати простіше, ніж людей

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

Перекриття та паралакс

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

Картинка увійшла в історію як дивні пагорби на фоні всіх ігор серії Super Mario

Цей набір ліній створює у вас враження, що маленька кругла штучка праворуч (кущ?) знаходиться перед рештою, а найбільша – позаду. Ефект іноді називають «T-правилом», оскільки перетин ліній об'єктів попереду і позаду утворює щось на кшталт літери T. Це просто, але досить потужно. У наведеному прикладі всі Т перевернуті догори ногами:

Ветерани програмування можуть згадати про ASCII 193

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

Оскільки 2D гри часто навмисно порушують звичайні правила перспективи з тієї простої причини, що їх легко намалювати без них, доводиться покладатися на інші способи отримати уявлення про глибину. Ще один із простих способів- робити об'єкти, імовірно віддалені від глядача, більш розмитими та менш докладними на вигляд. Ось приклад реального життя, на фотографії міського пейзажу промислового Китаю:

Міський зміг у всій красі

Ви також можете помітити ефект геометричної перспективи, хоча у разі основна точка сходу буде зліва кадру. Майже кожен 2D-платформер, який коли-небудь створений, використовує повітряну перспективу. Наприклад (знов Super Mario World):

А також перекриття та паралакс

Зверніть увагу, що чим далі на тлі знаходиться об'єкт, тим розмитим він виглядає. Про близькість об'єкта до гравця можна сказати навіть за кольором контурів. Це безпосередньо зводиться до ідеї розмаїття. Контраст розповість гравцеві, що важливо, а що ні.

Подивіться знову на скріншот із Super Mario World. Злегка затінені блакитні пагорби? Неважливо. Труба з білим відблиском та чорними контурами? Важливо. Єдиний яскраво-червоний предмет на екрані? Супер важливо. Пам'ятайте, що інтерактивні об'єкти у грі повинні завжди виділятися по відношенню до не інтерактивних, якщо немає конкретної причини приховувати щось від гравця.

Лінійна та повітряна перспектива на ArtyFactory.com, Тьюторіал від perspective-book.com

Наука про колір

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

Відтінок, насиченість, яскравість

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

Почнемо з порівняння двох кольорів:

Червоний та синій

Червоний та синій. Зрозуміло, що це різні кольори, чи не так? Але насправді є точніший термін Відтінок (Hue). Лівий квадрат має червоний відтінок, а правий має синій відтінок. Інші відтінки включають зелений, помаранчевий, фіолетовий і т. д. Хоча відтінок може здатися надлишковим терміном для визначення кольору, це не так, тому що кількість будь-якого відтінку може змінитися:

Червоний та блідо-червоний

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

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

Остання властивість - Яскравість (Brightness). Іноді замість нього використовують значення (Value). Яскравість набагато простіша у розумінні: показує, наскільки колір яскравіший. Ось такий червоний, як вище, і його менш яскрава (тобто темна) версія:

Червоний та темно-червоний (менш яскравий)

У зв'язку між яскравістю та насиченістю треба трохи розібратися:

Ці властивості можна змінювати одночасно

Ось приклад, як колір може впливати на атмосферу гри. Порівнюються New Super Mario (якщо вам вже набридли приклади зі старого) та Castlevania: Lords of Shadow.

Також зверніть увагу, що від Маріо не полетіли криваві ошметки, коли він настав на гриб

Нічого особливого, просто хотілося показати, як красиво на загальному тлі виділяються яскраві статусбари

Говорячи про колір, ми можемо знову згадати про… Барні та Годзілу! Подумайте, як колір робить їх такими різними з погляду відтінку, яскравості та насиченості, і що станеться, якщо одну або кілька цих властивостей змінити. Що станеться, якщо ви візьмете тільки одну властивість і наділите їм обох персонажів? Як вам хочеться обійняти сірого Барні?

Коротко про RGB

Прийміть вітання! Тепер ви розбираєтеся в колірній моделі HSB (Hue Saturation Brightness/Тон Насиченість Яскравість) або HSV (Значення = Яскравість). Практично будь-яка програма для обробки зображень користується цим терміном поряд з RGB (колірна модель Червоний Зелений Синій) та CMYK (Блакитний Пурпуровий Жовтий Чорний). Але HSB, мабуть, найпростіше пояснює, що відбувається з квітами. Особливо щодо того, наскільки яскравим чи насиченим є потрібний вам колір, коли ви працюєте над шейдингом. Однак у різних додатках вам доведеться мати справу з колірною моделлю RGB, тому коротко розглянемо її. RGB просто описує всі кольори з погляду червоного, зеленого та синього, тому що всі кольори можна описати як комбінацію цих трьох. Аналогічним чином інформацію про колір обробляє людське око. Витратьте трохи часу, щоб пограти з значеннями кольорів і побачити, як змінюються значення HSB і RGB, і як вони пов'язані один з одним. Ось стандартна діаграма RGB (зверніть увагу, що відбувається, коли кольори перекриваються):

Також відома як адитивна колірна модель, оскільки кольори створюються шляхом додавання світла, а не його поглинання (як у субтрактивній моделі)

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

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

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

Типове колесо колеса

Відтінки також зазвичай поділяються на теплі та холодні, у термінах колірної температури. Причому червоно-жовті кольори вважають теплими, а сині кольори прохолодними, як показано нижче:

Цікавий факт. Щоб показати спеку в кадрі, у фільм «Роби як треба» (1989) режисер додав більше помаранчевого тону

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

Інші відносини між кольорами також можна пояснити за допомогою колеса. Аналогічні кольори – це просто відтінки поряд один з одним, такі як зелений, жовтий та кольори між ними. Контрастні кольори – це кольори (відтінки) на 180 градусів віддалені один від одного, які здаються яскравішими при використанні разом. Мабуть, ви бачили їх у дії, навіть якщо не знали чому. Синій та помаранчевий навіть стали стежкою (стандартним стилістичним прийомом).

Якщо ви використовуєте Firefox, подивіться на значок. Знову синій та помаранчевий!

Спробуйте пов'язати кольори з певними расами або ворогами, середовищами або рівнями під час роботи над ігровою графікою. Позначення кольором не обов'язкове, однак ви можете використовувати його як спосіб впливу на сприйняття гравців. Подумайте про набір кольорів для поганих хлопців, але використовуйте, наприклад, унікальні відтінки для конкретних ворогів. Не бійтеся експериментувати і намагайтеся використовувати більш рідкісні кольори. У будь-якій досить просунутій програмі для обробки зображень (наприклад, GIMP) колір змінити простіше, ніж будь-яка інша властивість. Це одна з небагатьох речей, які можна легко змінити у готовому малюнку.

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

Рекомендуємо вивчити (англійською):Теорія кольору для дизайнерів

Освітлення та затінення

У цій частині ви побачите багато прикладів піксель арту, але в них йдеться про базові концепції, які застосовуються до будь-якого типу 2D графіки.

Джерела світла

Художники-початківці часто не розуміють, навіщо насправді малюють світло і тінь. Затінення (або шейдинг) малюнка зазвичай означає застосування різних відтінків, щоб створити ілюзію світла на кресленні, так само, як перспектива – це ілюзія глибини. І так само як із перспективою, вам необхідно створити якісь 2D аналоги видимих у реальності ефектів. Тут є тільки одне правило: світло має звідкись виходити. Він не може бути скрізь, тож якщо ви просто розфарбуєте малюнок, це буде виглядати неправильно. Коли новачки намагаються намалювати тінь, але не розуміють, як, це призводить до об'єктів, які виглядають ось так:

Серйозно, так не треба робити

Порівняйте з варіантом без тіней:

Краще залишити так, ніж як було вище

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

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

Ось приклад із джерелом світла у верхньому лівому кутку:

Вам також треба подумати, чи не може одна з частин об'єкта відкидати тінь на інші

Звернені до джерела світла частини будуть світлішими, а протилежні їм – темнішими. Що може бути простішим? Але це не завжди саме так…

Плоскі та вигнуті поверхні

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

Американський бомбардувальник F-117. Плоскі поверхні

Більш звичний на вигляд F-15. Вигнуті поверхні

Знову повернемося до параграфа про форми. Хто з цих поганих хлопців здасться вам добрим, а хто насторожить вас одним зовнішнім виглядом?

Ви можете бачити реальний градієнт між світлом та тінню. Зверніть увагу на ліве крило, на ньому градієнт є просто ідеальним. Тепер повернемося до раніше згаданого убожества з подушечным затіненням:

Джерело світла для куба та сфери не зовсім однакове. В чому різниця?

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

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

Такий шейдинг дозволяє краще відчути об'єм.

Ще пара цифрових прикладів на ту саму тему.

Якби сфери знаходилися на блакитній поверхні, відбите світло мало б блакитний відтінок

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

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

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

Згадаймо про теплі та холодні кольори. Блики мають теплий відтінок, а тіні холодний

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

Якщо використовувати відтінки занадто багато, гра нагадуватиме Instagram

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

Серед митців немає єдиної думки щодо зміни тону. Знайдіть своє рішення, але пам'ятайте, що чим сильніше ви зміните тон, тим сюрреалістичнішим стане ваш малюнок.

Шейдинг та текстурування

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

Це коли-небудь стане вам у нагоді при покупці фарби для ремонту

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

МатоваТекстура відбиває не дуже добре і розсіює світло при відображенні. Це означає, що вона здається більш рівно освітленою. Хорошим прикладом поверхні з матовою текстурою є стара автомобільна шина.

Гладкатекстура стоїть десь посередині. Вона добре відбиває, але сильно розсіює світло при відбитті. Гладку текстуру часто має пластик, наприклад більшість комп'ютерних клавіатур.

Отже, не забувайте про властивості зображуваних вами матеріалів. Це глянсовий метал чи матова тканина? Одяг середньовічних персонажів не повинен відображати світло наче пластмаса, а космічні обладунки не повинні здаватися м'якими на дотик.

Коротше кажучи:Щоб 2D графіка виглядала достовірною, світло повинне мати напрямок.

Відточування навичок

Що робити тепер, коли викладено усі основи? Уперед! Починайте пробувати! Це правда: малювати може будь-хто. Звичайно, деякі люди мають більше навичок, але найбільша різниця між поганим художником і хорошим – це те, наскільки багато вони практикувалися. Чим більше практики, тим краще ви володієте навичкою. Але практикуйтеся з розумом. Відмінну нагоду для цього дають ігрові проекти. Якщо ви мріяли про свою гру, починайте робити нариси для неї, паралельно читаючи цю статтю.

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

Олівець та папір

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

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

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

Малюнки (вони ж скетчі)

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

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

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

Типовий скетч

Чернетка, чернетка, знову чернетка

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

Повторіть розділ про анатомію та пропорції. Не знаючи будови черепа важко придумати придатний шолом

Верхня штучка взагалі повинна відкидати тінь на забрало

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

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

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

Висновок та подальше читання

Тепер ви знаєте основи та повністю готові до створення пристойної графіки для 2D ігор. Якщо вам цікаво дізнатися більше на тему, то протягом статті ви можете помітити посилання на додаткові джерела. Сама ж стаття багато в чому ґрунтується на книзі Кріса Соларські "Drawing Basics and Video Game Art". Ви можете прочитати деякі з його творів. Наважуйтеся!

Оригінал статті на англійською: Total beginner guide for better 2d game art

P.S.

Вам також може бути цікаво

З розвитком HTML5 та мобільних платформ 2D ігри повертаються в моду та привертають увагу навіть великих видавців. Завдяки таким інструментам, як Unity, та онлайн-ресурсам з ігровими ассетами, розробляти ці ігри стало набагато легше. Нижче наведено список з 10 найкращих сайтів з 2D ресурсами для ігор – як платними, так і безкоштовними.

*Сайти перераховані у випадковому порядку*

1. Unity Asset Store (платний)

Найбільший сайт із платними ігровими ассетами. Використовувати двигун Unity для роботи необов'язково – щоб отримати доступ до ресурсів на Asset Store, потрібно лише завантажити його безкоштовну версію. Завантажені файли будуть збережені в папку проекту Unity, звідки їх можна імпортувати в будь-який ігровий 2D двигун.

Варто зазначити, що Unity в руках умілого розробника має величезний потенціал, про що свідчить велика кількість успішних 2D ігор (чого тільки вартує популярна Bad Piggies від Rovio). А Unity Asset Store пропонує широкий вибір 2D ассетів.

2. GameDev Market (платний)

GameDev Market – відносно новий сайт, зручно організований за категоріями контенту (як і Super Game Asset, про який йтиметься нижче). Тут ви знайдете як 2D, так і 3D ресурси, включаючи UI, спрайти персонажів, іконки та оточення. Художники виставляють асети на продаж, і асортимент зростає з кожним днем.

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

4. Scirra Store (платний)

Scirra - компанія-розробник Construct 2, популярного 2D редактора на HTML5, у якої нещодавно з'явився власний магазин ассетів. Тут можна знайти аудіо-, графічні ресурси і навіть готові ігрові шаблони для Construct 2. Втім, для роботи можна використовувати будь-який інший 2D редактор.

5. Game Art Partners (платний)

На сайті Game Art Partners можна купити різноманітні асети для 2D платформерів, включаючи анімованих персонажів, монстрів, зброю, візуальні ефекти і набори елементів інтерфейсу.

6. Super Game Asset (платний)

Якщо ви створюєте RPG або гру із ізометричною графікою – цей сайт для вас. Тут ви знайдете найякісніші ассети: барвисті іконки для RPG (мабуть, найкращі з доступних онлайн), 2D спрайти, анімовані спрайти персонажів та величезні ізометричні карти. Що важливо, більшість представлених ресурсів виконані в одному стилі.

7. Open Game Art (безкоштовний)

Вичерпний ресурс для розробників ігор з відкритим вихідним кодом, Open Game Art можна назвати найбільшими зборами ігрових ассетів зі вільною ліцензією. Усі матеріали – від спрайтів до ікон – можна завантажити за ліцензіями GNU або Creative Commons. Це відмінний сайт для новачків, але багато асет відрізняються за візуальним стилем, тому їх доведеться ретельно відбирати.

8. Kenney Game Assets (безкоштовний)

Ще один відмінний сайт із більш ніж 20 тис. ассетами, включаючи елементи UI та різні спрайти для 2D платформерів. Більшість ресурсів представлені в векторної графікита підійдуть для будь-якого пристрою, незалежно від роздільної здатності екрана. Ассети можна завантажити окремо (безкоштовно) або одним набором (за скромну плату $9).

9. Game-Icons.net (безкоштовний)

Game-icons.net – найкращий сайт з безкоштовними іконками, яких тут не мало не мало 2000. Незважаючи на те, що всі іконки чорно-білого кольору, вони досить універсальні і можуть бути використані для позначення дій, заклинань, навичок, предметів тощо. п. Приємний бонус – векторний формат.

10. Reiner's Tilesets (безкоштовний)

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

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

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

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

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

Роздільна здатність екранів

Співвідношення сторін

А ось як виглядає список найбільш популярних дозволів стосовно один одного:

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

Якщо намалювати щось у розмірі 2048 x 2048 px, а потім програмно зменшити до розміру 512 x 512 px, то зображення залишиться чітким, у зворотний бік з растровою графікоютаке не проробиш - картинка вийде змащеною.

Як видно вище, зі списку найпопулярніших дозволів, максимальна висота складає 1536 px.

Для найпопулярніших форматів співвідношення сторін (98,5%) можна підібрати ширину зображення такою, щоб по висоті залишалися ті самі 1536px. Ось що з цього вийшло:

З урахуванням того, що бічні грані відрізатимуться на екранах із співвідношенням сторін відмінним від 16:9, можна розмістити важливі для геймплея об'єкти так, щоб вони залишилися видно, тобто. розмістивши їх усередині зони розміром 2048 X 1536 px.Виходячи з цього шаблону, можна малювати фон та інші елементи ігрового світу.

Створення спрайт-листа у Sprite Sheet Packer

Sprite Sheet Packer – це інструмент для створення спрайт-аркушів (спрайтшит, спрайт шит) різних форматів. Домашня сторінкапакувальника спрайтів https://spritesheetpacker.codeplex.com/. Ця невелика програма, що розповсюджується під MIT-ліцензією, поєднує безліч одиночних зображень в одне зображення, на прозорому полотні якого ефективно розміщуються вхідні зображення. Для нормальної роботи Sprite Sheet Packer у системі має бути встановлений Microsoft. Net Frameworkне нижче за версію 3.5
Програма підтримує вхідні зображення форматів PNG, JPG, BMP та GIF. Результатом є одне зображення формату PNG 32 біт з прозорим фоном. Sprite Sheet Packer також створює супутній текстовий файл, який відображає імена файлів вхідних зображень із їх координатами та розмірами. Все це потрібно для використання у вашій програмі роботи зі спрайтами, щоб знайти області зображень, які вам потрібні.

Інтерфейс користувача Sprite Sheet Packer має необхідний і достатній набір елементів управління. Розібратися в ньому не важко. Відкриття вхідних файлів можливе як із діалогового вікна, так і методом перетягування. Відкривати файли можна індивідуально або одразу множинним вибором.

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

Оскільки я припускаю використовувати Sprite Sheet Packer як інструмент для створення майстер-спрайтів для застосування css-спрайтів на веб-сторінках, я не став перекладати дві специфічні опції. Це – "Require Power of Two Output?" і "Require Square Output?". Як я розумію, вони призначені для завдання якихось спеціальних форматів спрайт-листа при використанні програми прямого призначення - створення спрайт-листів для ігор. Нижче наведу скріншоти всіх варіантів побудови спрайт-листа.

1 - Опції "Require Power of Two Output?" і "Require Square Output?" . Розміри спрайт-листу 462х200px.

2 - "Require Power of Two Output?". Розміри спрайт-листу 512х256px.

3 - "Require Power of Two Output?" і "Require Square Output?". Розміри спрайт-листу 512х512px.

4 - "Require Square Output?". Розміри спрайт-листу 336х336px.

Приклад спрайт-листа наведений дуже простий. Я не став морочитися з картинками різних розмірів, а взяв перші зображення формату PNG з розмірами 32х32 пікселя. На сторінці розробника (див. посилання вище) можна побачити приклади спрайт-листів з картинками різних розмірів. Мені здається оптимальним для створення майстер-спрайту для подальшого розміщення css-спрайтів на веб-сторінках останній варіант. Цей спрайт-лист має оптимальну квадратну форму з невеликим порожнім запасним простором для можливого додавання нових спрайтів у міру потреби. Наведу скріншот фрагменту текстового файлукарти для останнього варіанта спрайт-лист.

На скріншоті видно обіцяні імена файлів спрайтів, їх координати та розміри. Але координати картинок тут наведені без урахування знаку мінус, тому при створенні стилів для css-спрайтів це треба враховувати. Набагато простіше визначення потрібних координат завантажити отриманий майстер-спрайт у програму Sprite Cow, вона безпроблемно вкаже координати їхнього використання у CSS.

Ось, власне, і все.

Друзі, Mult-uroki.ru - це некомерційний проект, яким з кожним днем користується все більше більше людейу світі як ресурс з безкоштовним якісним навчальним матеріалом на тему створення мультфільмів та 2d анімації. Ви можете ДОПОМОГТИ У РОЗВИТКУ ПРОЕКТУ невеликою сумою грошей, оскільки часто той час, який я міг би присвятити створенню нових уроків, я втрачаю, займаючись підробітком, щоб вижити. Дякую!

Показати супутні матеріали до даному уроку, на які я посилався в цьому відеоролику:

За моїми відеоуроками ви можете навчитися створювати 2d/3d мультфільми, персонажів та анімацію у будь-якій стилізації.

Почніть вивчення з першого уроку:

1. Огляд програми Anime Studio Pro (Moho Pro). Створюємо Вашу першу якісну анімацію

Урок триває 41 хвилину! За цей час ви складете повну думку про мене і про програму, і прийміть подальше рішення, яке, можливо, змінить ваше подальше життя (навіть якщо ви не потім дивитися мої уроки — заощадить вам час!).

Де брати спрайти для ігор?

Для себе ви відповісте на такі запитання:

— Чи виходить у мене працювати в програмі?
— Чи зрозумілий процес проходження картинки від підготовки в Adobe Photoshop до анімації та готового відеоролика?
— Чи сподобалося моє пояснення, чи я шукатиму щось інше?
— Чи можу я на цьому заробити?
— Чи зможу я сама/сама створити свій мультфільм?, який може послужити, наприклад, чудовим подарунком!

У цьому уроці я розповідаю, як створити спрайт анімацію для 2d ігор у програмі Anime Studio Pro (Moho Pro). Будь-які двигуни (SVG) і будь-яка стилізація (png сиквенція).

Мій проект (соціальна мережа) присвячений навчанню створення 2d мультфільмів, персонажів, 2d/3d анімації, мальованої анімації, створенню 2d ігор мовою javascript та flash, відеомонтажу, звучанню, постобробці відео тощо. за допомогою публікації моїх відео уроків на сайті моєї соціальної мережі http://mult-uroki.ru, у групі ВКонтакте: https://vk.com/mult_uroki та каналі Youtube: https://www.youtube.com/c/Mult-urokiRu за програмами 2d / 3d анімації та моделювання об'єктів анімації, місцевості та фонів у: Anime Studio Pro (Moho Pro) (ASP) (асп) (аніме студіо про) , Autodesk Maya 2013, Adobe After Effects CS6, Adobe Premier Pro, Adobe Photoshop, Adobe Audition, Adobe Flash, Toon Boom Animation, Cinema 4D, Blender та Poser Pro. За моїми уроками ви дізнаєтесь як створюються мультфільми та анімація, як роблять ліпсинг персонажам та озвучення мультфільмів, які бувають закони анімації та монтажу, як бувають види планів і як їх правильно чергувати, як створюється розкадрування та анімати, які мультфільми зроблено у програмі Anime (Moho Pro) і яка програма краща (простіше) і що вибрати для створення свого першого 2д мультфільму в домашніх умовах Anime Studio Pro (Moho Pro) або Adobe flash? Video tutorials: Створення character bone and 2d animation в Anime Studio Pro (Moho Pro 12) program. Як створити і зменшити характеристики в Anime Studio Pro (Moho Pro)? how to make a 2d cartoon?

11.05.2016Олександр Птічкін

Прості звичні нам блискавки – це розряди, які проскакують між хмарами у тропосфері та поверхнею землі.

Безкоштовні ресурси для 2D ігор

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

Відкрили ці розряди відносно нещодавно, 1989 року. Відкрив їх Джон Рандольф Вінклер, відставний професор, 73-річний ветеран NASA, коли направив на грозові хмари високочутливу відеокамеру, просто вивіряючи її, а потім, переглядаючи запис кадр за кадром, виявив два яскраві спалахи, які, на відміну від блискавок, йшли не вниз. до землі, а вгору, до іоносфери. Причиною їх виникнення називають формування електричного полявисокої напруженості над областю грози, що виглядає як спалах світла дивної форми. Спрайти зазвичай виникають групами, найчастіше у формі кільця. Вони рухливі, здійснюють "танцюючі" рухи, і їх дуже легко прийняти за НЛО. Вертикальні стовпи свічення у спрайтах досягають 20 км у висоту, їх пучок може бути діаметром до 70 км.

Сподобався піст? Підтримай Фактрум, натисніть:

Як замінити спрайт при його русі встановленим шляхом.

Допустимо, у вас є спрайт, що складається з 36 зображень (0-35).
Тобто кожен наступний – зображення на 10 градусів убік.
Зазвичай, у події малювання, у дії малювання спрайту в полі - subimage - ми пишемо direction / (360 / image_number).
Тобто direction/10. Адже в дорозі напрямок об'єкта — дрібне число!
Вирішуємо завдання.
У події малювання (або кроку) ставимо set the value of variable,
direction=(round(round(direction)/10))*10.
Пояснюю.
Напрямок = (округлений (округлений (напрямок) поділений на 10))
множене на 10
Пояснюю ще.
Дробний напрямок у дорозі округляємо. (Приклад 268.34 = 268)
Потім ділимо його на десять (268/10 = 26.8)
потім округляємо (26.8 = 27)
потім множимо на десять (27 * 10 = 270)
Ура! Отримали все! Тепер: -subimage-direction (270) / 10 = 27
Тобто 27 зображення спрайту, де об'єкт дивиться вниз, що потрібно.

Як швидко зробити спрайт людини, що дивиться (вид зверху) у різні боки (18, 36, 72 сторони)

Створюємо один спрайтик із одним зображенням людини. Клікаємо Edit sprite
Вибираємо Animation / Rotation Sequence / і далі проти годинникової стрілки.
потім, у number of frames пишемо кількість підзображень (людей у різні сторони) і градуси пишемо 360. (якщо він повертається на всі боки)
Далі ОК і ... ПРО ДИВО! сталося!

Текстури, тайли, фони

у вас потрібна кількістьзображень.
Потім потрібно встановити (за ідеєю) перше зображення (номер 0) де чувак дивиться
по direction=0, щоб у події малювання subimage писати direction/10, чувак повинен дивитися праворуч. Можна скористатися (якщо не дивиться)
Images/Cycle Left
images/cycle Right або клавішами shift+ctrl+(L або R)
Ось і готовий спрайт.

Як створити автомат із питною водою (ігровий).

Для початку робимо два спрайти - сам автомат і банка. Потім ці об'єкти.
Принцип роботи: герой стикається з автоматом, і при успіху вилітає банку на
певну відстань від автомата. Повторюється через певний час.
У події CREATE героя вводимо змінну (true/false), наприклад, no_kola,
для відстеження, чи вже гра. Отже, no_kola=true (тобто гра не йде)
У події зіткнення:
1) Герой зупиняється.
2) Якщо no_kola=false (гра йде)
3) Exit this event
4) With chance 1 out (число чим більше, тим менше шансів, у мене 4)
5) Створити об'єкт банку.
Ось тут докладніше. Все залежить від того, в який бік летітиме банк. Applies to: Other
Якщо вліво, то x=-(random(20)), якщо вправо, то + Y=random(20)-10 Все -Relative
6) Потім, якщо треба граємо звуки.
7) Ставимо no_kola = true (гра йде).
8) Потім ставимо таймер, наприклад на 50, а подію цього таймера пишемо no_kola=true(немає гри).
Потім у події cREATE банки програємо переможний звук (мовляв, виграв) та у події зіткнення героя з банкою знищуємо її та граємо звук випивання банки. Всі.

Як створити вогонь, що все більше розпалюється. (Пожежа)

Спрайт вогню робимо, потім об'єкт. Робимо звук.
У Create пишемо:
1) Якщо звук вогню не грає
2) Граємо звук вогню
3) Ставимо змінну fire=false, контролю поширення.
У Step пишемо:
1) Якщо fire = false
2) Alarm 0 to (число, швидкість розповсюдження, у мене 300)
3) Ставимо fire = true
В Alarm 0 пишемо:
1) Якщо об'єкт fire у позиції (x, y = random(100)-50, Relative)
2) Старт блоку
3) fire = false
4) Exit
5) Кінець блоку
6) create object fire (x, y =random(100)-50, relative)
7) Alarm 0 = 300 8) Fire = false
Принцип дії. Змінна Fire стежить, чи потрібно намагатися створити вогонь через певний час. А коли вона дорівнює false, Alarm знову встановиться на спробу створити вогонь. Якщо позиція, де задумається поставити вогонь, вже зайнята вогнем, fire стане false і Alarm0 знову заведеться. При цьому горітиме все – і стіни, і люди, і предмети. При виході вогню із кімнати краще його дебудувати.
От і все.

Створення озброєного персонажа (зокрема до зубів).

У цій пораді ти знайдеш принцип, а сам уже й зробиш коди.

ПРОСТО ЗБРОЄНИЙ

Під цим можна розуміти кілька видів зброї.
Стріляє одинарно, мала шкода. (Пістолет)
Стріляє багаторазово, мала шкода. (Узі, інгрем)
Стріляє одинарно, велику шкоду. (Рушниця)
Стріляє одинарно, максимальна шкода. (Базука)
В даному випадку, мається на увазі, що у гравця завжди будуть ці 4 зброї, навіть якщо немає патронів (вогонь без патронів — певний звук). Щоб стріляти, достатньо знайти патрони і все. Можлива також стрілянина без перезаряджання.
Наприклад я, у грі МАКС ПЕЙН, до-рую роблю зараз, використовую просте озброєння. Пістолет і узі відрізнятимуться лише часом між вильотом куль. напр 10
Для них потрібний один об'єкт кулі.
Рушниця стріляє повільніше пістолета. (але збитки напр, в 3 рази більше)
Потрібен інший об'єкт, бажано спрайт більше.
Базука стріляє дуже повільно. (а тут шкода напр, при попаданні - смерть)
А тут треба створити маленьку рокету. При зіткненні з ким / чим вибухає, і об'єкт Вибух завдає шкоди (напр, 10).
Щоб взагалі було завжди чим стріляти, можна зробити кулі пістолета нескінченними.
А як вибирати зброю? Я так вирішив це завдання. Поряд з героєм я малюю його здоров'я, а вище пишу назву зброї і поруч патронів. Для перемикання можна використовувати цифри (наприклад, 1234). Потрібно ввести змінні (true/false), наприклад: use_pistol, use_usi, use_rifle, use_rocket І при перемиканні цифр усі змінні ставляться як false, а потрібна – true.
І в події малювання: якщо така зміна = true, то писати таку зброю.

ЗБРОЄНИЙ ДО ЗУБІВ

У даному випадку гравець не має всіх цих зброї, і при підбиранні патронів від тієї зброї, якої у нього немає, стріляти не можна. Нескінченними є каміння, ніж та бензопила, біта. Стріляти потрібно буде із перезарядкою.
1 Використовується нескінченно на близькій відстані. (Ніж, біта, бензопила)
2 Ставиться поруч із героєм. (Граната, міна, капкан.)
3 Кидається певну відстань від героя. (Камінці, граната, коктейль молотова)
4 Стріляє одинарно, мала шкода. (Пістолет, арбалет)
5 Стріляє багаторазово, мала шкода. (Узі, інгрем)
6 Стріляє одинарно, велику шкоду. (Рушниця, дробовик)
7 Стріляє багаторазово, велику шкоду. (Калашников, важкий кулемет)
8 Стріляє одинарно, максимальна шкода. (Базука, гранатомет)
Захист - Бронежилети, шоломи, костюми, що не горять.
1 З ножем та пилкою напевно зрозуміло. У пилки більша шкода. А біта використовується на трохи далі відстані, але шкода як у ножа.
2 Гранату можна також класти поруч із собою, через деякий час вона рвоне.
Міна ставиться поруч, збитки так само як і від гранати, тільки поки на неї не наступлять, не рвоне.

Капкан як і міна, але з меншою шкодою.
3 Камені можна зробити нескінченними і такими, що приносять незначну шкоду.
Граната кидається, залежно від того, чи довго триматимеш клавішу (Powershoot)
Коктейль молотова шкоди не завдає, а навколо себе створює вогонь, який через деякий час зникає. А ось вогонь і завдає шкоди, (напр, 2) І якщо зіткнеться з противником то буде на ньому, навіть якщо той піде, і доки не висохне вогонь або не здохне ворог.
4 Пістолет розібрали, арбалет — менша шкода
5 Розібрали
6 При пострілі з дробовика створюється безліч згуртованих куль, що окремо завдають малої шкоди. (Напр, 3) Але оскільки їх багато, то шкода буде велика.
7 Як відомо, калаш має погробний забій, як і кулемет. Втрата менше, ніж у 6, але стріляє трохи повільніше 5.
8 Гранатомет стрілятиме гранатами, але не Powershoot. А з базукою ось що:
При розриві ракети буде вибух та ще й залишиться горіти вогонь, як із Молотова.
І є ще одна категорія – Вогнемет. Стрілятиме на недалеку відстань, але вогонь як у Молотова, буде приносити величезну шкоду, залишаючись на ворогові.
А Захист? Будь ласка! Броня - додаткові 100 health-ів, при пострілі по ній немає крові.
Шолом допоможе захистити тільки голову, отже, це випадковий захист, десь 1 до 5.
А негорючий костюм - вводимо змінну, havekostum = true, і при зіткненні з вогнем, вогонь приставити до тіла не буде, а зменшуватиме тільки силу костюма.

От і все! Можна скомбінувати і простий, і до зубів, і отримати досить хороше озброєння. Але другий метод потрібен цілком явно для відмінних ігор. Поки

Дякую, * SpleaN *

Якщо у вас з'явиться бажання запропонувати на загальний огляд свої уроки або просто цікаву інформацію щодо створення ігор за допомогою GameMaker, то ласкаво просимо - надсилайте свої роботи за адресою gamemaker e1.ru, із зазначенням теми 'Уроки з GM' або безпосереднім вказівкою на предмет уроку .

Надіслані вами матеріали ми з радістю розмістимо на сторінках нашого сайту, з обов'язковою вказівкою автора!

1. Unity Asset Store (платний)

2. GameDev Market (платний)

Graphicriver – один із найпопулярніших ресурсів шаблонних зображень. У зв'язку з розвитком казуальних мобільних ігор там з'явилася окрема категорія з 2D ассетами. До розміщення на сайті весь контент проходить внутрішню перевірку, а після публікації будь-який користувач може залишити свою оцінку та відгук. Разом: це надійний сайт, що активно розвивається під пильним модеруванням Envato.

4. Scirra Store (платний)

5. Game Art Partners (платний)

6. Super Game Asset (платний)

7. Open Game Art (безкоштовний)

Вичерпний ресурс для розробників ігор з відкритим вихідним кодом Open Game Art можна назвати найбільшими зборами ігрових ассетів з вільною ліцензією. Усі матеріали – від спрайтів до ікон – можна завантажити за ліцензіями GNU або Creative Commons. Це відмінний сайт для новачків, але багато асет відрізняються за візуальним стилем, тому їх доведеться ретельно відбирати.

8. Kenney Game Assets (безкоштовний)

Ще один відмінний сайт із більш ніж 20 тис. ассетами, включаючи елементи UI та різні спрайти для 2D платформерів. Більшість ресурсів представлені у векторній графіці та підійдуть для будь-якого пристрою, незалежно від роздільної здатності екрану. Ассети можна завантажити окремо (безкоштовно) або одним набором (за скромну плату $9).

9. Game-Icons.net (безкоштовний)

10. Reiner's Tilesets (безкоштовний)

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