художник, пиксель-артист, моделлер и дизайнер
0,0
рейтинг
27 декабря 2012 в 23:26

Разработка → Технология быстрого создания фонов для 2D-игр на базе 3D-заготовок (48 часов разработки) из песочницы

Вместо предисловия


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

Перед тем как начать я хотел бы сделать акцент на двух положениях:
Первое. Мы исходим из того что читатель знаком с такими пакетами как 3D Studio MAX (либо любым другим пакетом трехмерного моделирования) и Photoshop (или любым его аналогом). В данном конкретном случае я собираюсь использовать терминологию этих двух пакетов. Однако, не смотря на это те же самые принципы можно использовать, пользуясь любым другим софтом.

Второе. В своей работе я всегда исхожу из одной простой истины: простота – залог успеха. И если первое положение предельно ясно, то второе я хотел бы раскрыть несколько шире. Начав, как это ни печально, именно с теории.

Я весьма относительный технарь и многие вещи, доступные другим технарям для меня — темный лес. Не смотря на это я считаю, что мастеру достаточно иметь один-два любимых инструмента, чтобы делать шедевры, а посредственности в свою очередь не хватит и чемодана этих инструментов, ибо за внешним лоском, эффектами и хитринками не будет, не души, не профессионализма.

Хочу также отметить, что я не причисляю себя к мастерам, которые делают шедевры. Данное примечание я делаю для тех злых людей, которые говорят (или скажут после публикации), что я заносчив, что меня занесло под небеса, и тех кто вместо того чтобы работать предпочитает злословить словно ябедник Кийр из моей любимой книги Оскара Лутса «Весна».

С преамбулами покончено перейдем к сути.

Я утверждаю и не беспочвенно, что хороший фон можно и нужно создавать не за неделю, не за пять дней и даже не за три. Чтобы сделать хорошую картинку для казуальной игры, без разницы i-spy это, match-3 или аркада, достаточно 48 часов. Разумеется, при условии того, что человек занимается работой, а не просиживанием штанов.

image



Прошу обратить внимание на иллюстрацию (см. выше). На мой взгляд, неплохой фон для 48 часов работы, не так ли? Теперь перейдем к технологии разработки таких фонов. Меня часто спрашивают «вы это все рисуете?». Я отвечаю – «частично да, частично нет… большая часть этой сцены 3D, но с мощным слоем пост-обработки». В этом случае человек обычно разочарованно протягивает «у-у-у… а я то думал это рисунок».

Давным-давно я огорчался, слыша это – теперь я знаю ответ. Мы делаем свою работу для того чтобы она радовала игрока. Мы делаем свою работу быстро потому, что жизнь коротка и за нее нужно очень многое успеть. Мы делаем свою работу любыми удобными нам способами (не противоречащими этике и законам) вовсе не потому, что у нас есть задача доказать кому-либо что мы можем нарисовать все что угодно. Мы не хотим ничего никому доказывать, кроме того, что мы можем, хотим, и умеем делать игры хорошо. На этом с теорией и вступлениями покончено – займемся, наконец работой.

Освещение и цвета заготовки


Как я уже говорил ранее, мы исходим из того, что читающие эту статью умеют держать в руках мышь и понимают толк в моделировании. Если вдруг случилось так и статью читает художник, который ни черта не смыслит в моделях – причин огорчаться нет. Существуют бесплатные библиотеки моделей (навскидку Turbosquid), из которых можно легко составить следующую сцену.

image

Допустим, вы сделали сцену, но не знаете, как ее осветить. Так же вы помните, что я посредственный технарь и ничего не умею. Знающие люди закидали бы вас настройками рендеров внешних и внутренних, с тысячами настроек и с пеной у рта доказывали бы что предложенный ими рендер – лучший.
Я иду другим путем. Учусь пользоваться теми инструментами которыми пользоваться легче и быстрей всего. В данном случае я предложу вам воспользоваться стандартными средствами 3D Studio Max, а именно двумя типами источников освещения. Это Omni (точечный источник освещения) и SkyLight – имитатор рассеянного освещения.

Необходимое отступление: Давайте добавим к тому, что я посредственный технарь еще и то, что я не буду пичкать вас техническими терминами, в которых и сам мало что понимаю. Как мы знаем умные слова еще не признак ума – так давайте обучаться легко.

Вернемся к нашим источникам. Как до них добраться?

image

При запуске Макса (я уже давно привык называть его по имени) в стандартной конфигурации есть некая панель управления, которая находится справа. Там вы можете выбирать примитивы, кости, модификаторы, черта в ступе, источники све… ба, то что нужно. Источники света.
Обратите внимание на рисунок. По шагам. Кликаем на иконку «лампы», в открывающемся выкидыше (нет, пожалуй нужно как-то осторожнее с терминами) выбираем Standart, и как говориться «не нужны нам никакие слюнявые мамонты» © Ice Age (это я о более сложных источниках света, с которыми мы понятное дело работать не умеем).

С чего начнем? Пожалуй с того что будет полегче. Т.е. со SkyLight. Смело кликайте на его кнопку и затем поместите его в любое место сцены. В этом его и прелесть. Затем… посетите это окошко, чтобы его активировать.

image

В открывшейся вкладке (панель с этими опциями находится наверху, под шапкой Макса) выберете пункт LightTracer и кликните, сразу после него вывалится окно (то что у меня на рисунке справа). Испугались?
А не надо пугаться. Вы уже сделали все что нужно. LightTracer – активен. Можете закрывать окно.

Разобравшись с этим источником освещения можете отрендерить сцену. Она будет выглядеть примерно так.

image

В том случае если вы использовали материал, который Макс назначает моделям по умолчанию когда на них нет текстур. А это, кстати, нам и нужно. Получилась очень пасмурная сценка. Осенний и дождливый денек. Но нам… нужно больше веселья и большей правдоподобности. Так бар выглядит когда все уходят домой.

Теперь нам нужно включить в баре лампы, чтобы посетителям, коли они будут, не было страшно. Любой Omni источник (а я думаю, что вы его уже поставили на сцену, пока я болтал) выставляется на сцену точно также. И с его настройками нам все-таки придется поработать. Выставьте источники света там, где они должны быть по уму, т.е. в зону прихожей, лампы и двух-трех мест чуть выше той зоны, что мы видим и давайте их настраивать.

image

Чтобы иметь возможность настраивать поставленный вами на сцену источник света войдите во вкладку Modify (на рисунке слева и далее слева-направо), выставьте источнику галочку чтобы он отбрасывал тени Shadows, в выкидывающемся окошке выберете Ray Traced Shadows, так как нам для хороших световых и теневых акцентов нужны резкие тени, а затем перебирайтесь в Far Attenuation. Для чего? Для того чтобы настроить зону которую будет покрывать источник света. Если вы не воспользуетесь этой функцией — ваши источники света будут действовать по всему периметру сцены. А нам они нужны лишь в определенных местах.

image

Видите эти два круга вокруг источника света? Давайте назовем то, что находится внутри первого круга зоной максимального света, а то, что находится между первой зоной и вторым кругом – зоной затухания света. И все. Никаких больше умных слов.

В результате вы получите вот такую вот картинку. В том случае, если у вас не включен SkyLight. Страшно?
Нет?
Мне тоже.

image

На вашей сцене есть два типа источников света. Мы разобрали и тот и другой. Вместе они образуют такой вот дуэт.

image

Это ваши Omni и ваш SkyLight. Поздравляю – мы закончили работу со светом. Теперь давайте немного оживим наши серые будни разноцветными материалами.

– Зачем, — спросите вы?
— А вы что собираетесь раскрашивать все это серое царство сами? – отвечу вопросом на вопрос я.

Как ясно можно видеть у нас есть группа моделей, залитая одним цветовым материалом. Нам необходимо разбить ее по цветам, чтобы затем было удобнее работать с текстурами. Как правило, я использую несколько цветов, чтобы разбить сцену по логическим материалам. Например, делаю белым цветом камень, желтым дерево, коричневым дерево другого типа. И т.д. Словом… нет никаких норм и ограничений по цветам. Единственно о чем стоит позаботиться так это о гармонии.

Как мы будем раскрашивать наши модели? Также просто. Никаких текстур – никаких настроек. Нажмите кнопку M или проследуйте во вкладку отображенную на рисунке. Теперь вы в редакторе материалов. Видите эти чудные шарики? Это то что нам нужно.

image

Кликните на диффузный цвет материала и в появившемся окне выберите нужный вам цвет. Нажмите Ok. Настройте таким образом нужное вам количество материалов-шариков, и назначьте на сцене их на модели. Это делается с помощь той маленькой иконки что обведена кружком. Да, совсем забыл, до этого, чтобы что-то получилось нужно хотя бы выбрать модель во вьюпорте.

image

В результате получится примерно такая вот картинка.

image

Уже совсем не плохо, правда? Дальше будет еще проще и еще красивее.

Я не зря говорил о простоте в самом начале. Категорически сопротивляюсь всему новому, я вполне комфортно чувствуя себя в старом. Это как удобная, но затертая до дыр рубашка. Лучшего и комфортного одеяния не придумаешь. Главное чтобы вас в этом тряпье ваша жена не увидела. У женщин несколько другие представления о том, как должен выглядеть мужчина. Собственно как и у нас о женщинах… тоже свои представления. Ничего удивительно. Ни одной Америки не было открыто.

Резюме:

Мои рассуждения о том, что мне нужно от 3D Studio Max сводились к следующему:
• Хочу, чтобы здесь было мягкое рассеянное освещение как в пасмурный день
• Хочу, чтобы здесь было несколько направленных источников света с жесткими тенями, чтобы подчеркнуть акценты.
Для первого случая я использовал SkyLight, для второго несколько источников типа Omni. Т.е. я обошелся стандартными средствами пакета, не прибегая ни к каким ухищрениям. Т.к. ухищрений я не люблю. Все должно быть просто. Дальше, что характерно будет еще проще.

Главное чтобы вы помнили, что одна из самых важных вещей в любой работе это свет и тень. Вторым пунктом пойдет логичность освещения. Ставьте (или рисуйте) его там, где оно уместно. Не надо тыкать источники освещения, где попало. Помните о гармонии. В нашей сцене светильников хоть и не видно, но находятся они в логичных местах не вызывая ощущения дискомфорта.
Это настольная лампа с желтым светом, две лампочки на стенах (значительно выше визуальной части сцены), один источник в дверях (все перечисленные источники света Omni с тенями, и тот самый SkyLight.

Настраивая интенсивность источников освещения, не забывайте о той самой гармонии. Не нужно ядерных взрывов и кислотных цветов. Помните, что на это будут смотреть, и смотреть будете не только вы.

Текстурирование


Теперь, когда мы разобрались со светом нам необходимо покрыть нашу сцену текстурами. «Вот те раз», — воскликнут иные, — «текстурирование… значит не обойтись без UVW-маппинга, разверток и прочих плясок с бубнами».

«Дудки» отвечу я вам. Не нужны никакие модификаторы, и отложите в сторону свои шаманские бубны. Ваше общение с пакетом трехмерного моделирования закончилось еще в прошлой главе. Это правда. Честно. Все остальное будет сделано вашими руками. Итак…

Для начала давайте осознаем тот факт, что с 3D мы уже больше не работаем и переберемся в Photoshop. Перед тем как начать работать я бы рекомендовал запомнить несколько вещей, которые лежат в основе этого способа разработки:

• Ваш рендер находится в самом первом и самом нижнем с точки зрения ориентации слое, все остальные накладываются сверху.
• Все фактуры, работу с тенью вы осуществляете через фильтры Overlay & Multiply – это необходимо для того чтобы ваш рендер был всегда виден, и чтобы в нем «на лету» можно было произвести любые изменения. В этом туториале заложена ситуация когда я «забыл» некие детали и потом за несколько минут интегрировал их в «сцену».
• Рекомендую работать в разрешении превышающем финальную картинку как минимум в два раза. Это позволяет работать с некоторыми вещами более небрежно, чем обычно, но при уменьшении это мало заметно. Т.е. большой размер как не странно – экономит вам время.

Теперь можно приступать. Все что вам нужно уяснить – каждому объекту требуется хорошо подобранная текстура, адекватная его сущности. Не «лепите» на каменные стены металл, а на металл дерево и все будет хорошо. Прошу обратить внимание на следующий рисунок.

image

Помимо картинки на ней присутствует квадрат обведенный белой рамкой. Это наша будущая текстура (разумеется ее накладывают без белой рамки, и да – она уже обработана инструментом Distort). Практически все текстуры накладываются мной в режиме наложения Overlay.
Для того чтобы ориентировать любую фотографию или текстуру так как это сделано у меня — воспользуйтесь инструментом Distort, его можно найти через меню Photoshop ветка которого выглядит следующим образом — Edit/Transform/Distort

режим наложения Overlay в Photoshop

Взглянем теперь на изображение выше. У каждого слоя есть свои режимы наложения. По умолчанию режим слоя выставлен на Normal. Мы меняем его на Overlay. У меня нет желания забивать вам голову пространными, а главное высосанными из пальца объяснениями как работает тот или иной режим наложения. Как говорит один из моих знакомых — не бойтесь экспериментировать.

Все что вам нужно знать, что Overlay перемножает освещенность и цвет, делая объект под ним светлее добавляя при этом к нему свою фактуру. Каково вам объяснение?

Ненаучно? Согласен.
Не технологично и без знания предмета? Съем и это. Суть от этого не изменится.
Чтобы усилить или ослабить тот или иной слой пользуйтесь его прозрачностью. Т.е Opaсity (ползунок уровня прозрачности находится справа от режима наложения, который вы только что выбирали). В случае если вы воспользуетесь уровнем прозрачности 100% — картинка может получиться слишком сочной. А нам нужно чтобы фактура была воздушной. Чтобы пол не отвлекал зрителя от игры света и тени, в тоже время «говоря» ему – смотри я деревянный.

Точно таким же способом вы накладываете все остальные текстуры получая на выходе следующую картинку.

наша предыдущая сцена с бросовыми текстурами

Итак, что мы имеем? Забавно правда? Мы не умеем текстурировать, владеем всего одним инструментом Distort, но по нашей прихоти сцена обзавелась красивыми стенами, полом, барной стойкой и даже шикарными бочками из дубового дерева, и надо сказать… сцена уже выглядит неплохо. А мы, между прочим, еще даже не брались за планшет. Продолжаем детализировать? Уверяю вас – сейчас начнется самое вкусное.

Детализация


Следующим этапом будет мелкая детализация которая так радует глаз геймера. Относитесь к ней внимательно и с юмором. И то и другое игрок оценит в полной мере. Что понимается под детализацией? Обратите внимание на рисунок:

появление мелкой детализации

Что вы видите? Там появились узоры на кресле, роспись по дереву на барной стойке, наклейки на бутылках вина, обложки на книгах, и т.д. Как это делается? Очень просто. Либо интернет в помощь, либо банк собственных фотографий. И то и другое одинаково хорошо. Открываете «Google» и набираете в строке поиска «этикетки на вино».

Переключаетесь на вкладку «картинки», выбираете интересующую вас этикетку и отправляете в ваше рабочее окно через буфер обмена. После этого берете инструмент Distort добраться до которого можно через вкладки Edit/Transform/Distort и с помощью направляющих точек искривляете изображение так чтобы оно адекватно вписывалось в сцену. Накладываете его в любом удобном для вас режиме наложения. Просто? Просто. Тот же самый принцип используется для искажения в нужном направлении текстур которые мы накладывали на пол и на остальные объекты сцены.

Таким нехитрым методом вы оснащаете всю сцену мелкой детализацией. Кажется я еще что-то говорил про юмор? Да. Было дело. В свое время я часто откалывал шутки с целью проверить приемку того или иного заказчика. Что конкретно находилось на той или иной сцене я говорить не буду, попытайтесь найти на этой сцене что-нибудь знакомое самостоятельно.
Могу сказать лишь одно. Практически каждый мой фон или работа наполнены мини-трибьютами и гегами. Это повышает фан в том случае если ваша игра успешна. Вполне известно, что в старых играх до сих пор находят «пасхальные яйца» и, не смотря на прошедшие годы не устают их искать вновь и вновь. В «рамках проекта детализации» нам необходимо обзавестись такой вещью как столы и стулья.

В конце концов кабак это или танцпол? В пакете моделирования у меня были сделаны такие вот заготовки, и теперь пришло время примерить их на нашу сцену.

появление нового объекта на сцене

Столы мы кладем поверх наших слоев текстурирования и объектов, чтобы не ломать проделанную работу. Что мы видим? Наши столы уныло плавают в воздухе. Что мы забыли? Как минимум отекстурить их.

текстурирование объекта изложенным ранее способом для закрепления материала

Все по-прежнему плохо. Почему? Правильно – мы забыли пересчитать свет в сцене. Возвращаемся в редактор моделирования и пересчитываем сцену. Поскольку все последующие слои (текстуры и объекты) накладывались у нас с помощью режимов наложения Overlay или Multiplay подмена самого нижнего слоя с нашим рендером никак не скажется на качестве картинки и нам ничего не придется переделывать. Если не верите, посмотрите на следующий рисунок.

подмена основного рендера не ведет к искажениям сцены обеспечивая модификации последней на лету

Попутно с тенью на полу я прихватил из сцены забытую там дверь и раскрасил ее нашим с вами способом. Текстурами. Через уже столько раз упомянутый режим наложения (Overlay). Однако внимательные читатели заметят разницу во внешнем виде двери. Она со светом и бликами.
Прощу прощения, но я не удержался и почиркал по двери инструментом Dodge. Не увлекайтесь им сильно. Но помните что это быстрый способ «выжечь» любую поверхность. С помощью Dodge очень легко, а главное быстро можно делать бликующий металл.

Правда, я практически не пользуюсь им в своей работе. Разве что на последней стадии, когда все слои слиты в один. Дело в том, что для меня важно чтобы сцена до последнего момента сохраняла свои слои. Вдруг мне захочется подменить что-то внизу, как мы с вами уже проделали с дверью и тенью под столами? В этом случае придется снова махать кисточкой, и снова наносить блики металла Dodge'м.

Инструмент Dodge как средство быстрого создания бликующего метала

Видно что я начал подправлять тень нанося ручные мягкие контуры под нужными мне объектами и что появилось отражение. Неужели опять задействован пакет трехмерного моделирования? Отнюдь. Я просто взял, отрезал стол, воспользовался уже упомянутым инструментом Distort и исказили картинку стола так чтобы он находился под столом реальным, зеркально снизу. Потом наложил этот искореженный стол в режиме Overlay с минимальной едва заметной прозрачностью. Потом подтер резинкой отражение там где оно мне было не нужно.
До сих пор я пользовался тремя инструментами. Это Distort для искажения фрагментов изображения в нужные мне ракурсы, это метод наложения слоев Overlay и Dodge. Ну хорошо, уговорили — была еще и резинка. Согласитесь не слишком масштабный арсенал? Я бы даже сказал простой и очень легкий для освоения. Постараюсь в плане легкости и простоты работы не разочаровывать вас и впредь.

Дополнительное освещение


Давайте зададимся вопросом… чего нам не хватает в этой сцене? Не дожидаясь предположений отвечу сам. Не хватает света. Световых акцентов. Сцена тихая, спокойная. В ней нет никакой живости. Этой живостью мы с вами и займемся… обратив внимания на рис. 9. Что это такое? Это черно белая маска света нарисованная вручную. Поверьте… чем колупаться с рендерами легче нарисовать свет самому. Кроме того этот свет в отличие от рендера всегда может быть отключен в виде слоя. Что если вы задумали сделать грозу на улице? Или проходящего мимо прохожего, который по маске стирает слой света, который затем начинает светить, как ни в чем не бывало?

На рисунке маска изображена черно-белой. Это сделано исключительно для того чтобы вы могли увидеть точную форму белой маски. В реальности черного цвета на маске нет. Только белая или желтоватая.

фейковый свет за счет нарисованных световых масок

Во время наложения этот слой состоит из белого силуэта. Достаем уже знакомый и привычный Distort, и искривляем спрайт так чтобы он идеально вписался под окно. Меняем режим наложения с Normal на Overlay… и вуаля… на пол падает свет. Сцена стала лучше? Стала… но это далеко не предел. Все оставшееся время мы будем играться именно со светом, потому что работу по текстурированию и объектам мы уже давно закончили. Мы продолжаем работать со светом, и наносим кисточкой лучи света из окна. С понятно каким режимом наложения. Наверное, я уже с ним наскучил вам.

фейковый свет за счет нарисованных световых масок 2

Теперь перейдем в нашу предпоследнюю главу. И доведем этот «рисунок» до конца.

Сколы, Эрозия, Элементы старения, Следы Жизни


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

Немного восторженной теории. Никакой рендер не в состоянии заменить чувство меры, цвета и света имеющейся у хорошего художника. Никакой рендер не в состоянии сделать нужные акценты там, где это действительно нужно. Любой рендер на данном этапе развития это бездушный и очень честный парень. Он всегда норовит все сделать честно. А нам не нужно честно. Нам нужно интересно. Эффектно. Сказочно.

Однажды один художник показал мне один прием. «Сколы». Под ним он подразумевал любое старение металла. После этого мои металлы стали значительно лучше. Поскольку меня часто называют «ржавыми маньяком», «фоллаутистом», и многими другими прозвищами вы, наверное, догадаетесь, что я пошел значительно дальше сколов.

Мое мнение относительно дизайна тех или иных вещей в играх простое. Игроку не интересна честная белая стена. Ему интересна стена фактурная. Та, которая может его заинтересовать. Тоже самое относится и к остальным объектам. Они должны быть фактурны, интересны, они должны быть запоминающимися.

Возьмем две игры. Half-life 2 и F.E.A.R. В обоих играх используются normal-карты для создания рельефа и освещения. Только если в последней отключив эти карты мы вообще не увидим больше ничего (кроме уровня из картонок), то отключив тоже самое хозяйство в Half-life 2 мы получим практически туже чудную картинку что и была. Почему? Потому, что в Valve к делу подошли ответственно совместив две технологии, а не положившись на одну. В случае если не работает одна — вторая работает за двоих.

Normal-mapping там используется как вспомогательная технология. А в F.E.A.R. эта технология несущая. Т.е. без нее «картинки» практически нет. В чем преимущество Half-life 2 в данном случае?

В фото-текстурах изрядно обработанных руками, в цвете и свете на уровнях. Т.е. во всем том, что я отмечал особо в самом начале этого туториала.

вся сцена с мелкой эрозионной детализацией

Однако вернемся к нашим сколам. Давайте посмотрим на рисунок чуть выше. Что появилось? Появилось все. Появилась жизнь. Мелкие пылинки кружащиеся в лучах окна, потертый пол, дополнительные засветки на стенах, потертости на дереве, потертости на барной стойке, и т.д. Это я называю «финальным проходом». Когда художник проходит поверх сцены придирчивым взглядом и начинает наносить мелкую световую и эрозийную детализацию. Также это можно назвать «пост-обработкой».

До и После... чем отличаются сцены без обработки от тех где она есть

Вряд ли я кого-то удивлю, если скажу что все эти пятнышки, потертости наносятся белым или приближенным к нему цветом на соответственный слой с режимом наложения Overlay.

Пост-обработка крупным планом


Все-таки хочется коснуться пост-обработки отдельно. Для этого я создал специальный укрупненный пример. На нем явно видно, что я имею в виду под этим емким термином. И давайте наконец закрепим пройденный материал. Обратим наши взоры на рисунок поди последний в этом сезоне.

пост-обработка крупным планом

Пошли… слева-направо:
1. Рендер сцены без каких-либо изменений основанный на разноцветных материалах и типовых источниках освещения.
2. Наложение фактур (Overlay)
3. Наложение сколов, потертостей, и прочего «эха войны» (Overlay)
3B. Белым показаны штрихи, которые наносятся поверх картинки
4. Еще больше потертостей, блики на бутылках, крупные блики на выпуклых частях стола.
5. Узоры нанесенные желтым цветом в режиме наложения Overlay, мелкие детали вроде болтов на полу, дырки в дереве, и аккуратные протертости вокруг них.

Вот и все… как выясняется сделать такой фон проще пареной репы. Все что необходимо, это вера в себя, внимание к мелочам, и практика. Практика, без которой хрен что получиться вообще.

Эпилог


Хочется отметить ряд вещей, которые не стоит забывать не при каких обстоятельствах, и которые собственно и составляют основу этого метода.

• Внимательно подбирайте цветовые схемы будущей работы, так чтобы они услаждали глаз, а не напрягали его.
• Помните о важности света и тени в любой работе. Без них ваша работа будет плоской и скучной.
• Аккуратно подбирайте адекватные для сцены фактуры. Ваша задача создать гармоничную картину, а не показать буйство материалов. Заметьте, на моей сцене фактуры во многих местах имеют достаточно бледный вид.
• Помните о процессах старения и эрозии, которые сопровождают вас вокруг. Чистые и стерильные предметы вы найдете только в больнице. Европейской разумеется.
• Внимательно подмечайте мелочи окружающие вас по жизни и переносите их в свои работы. Любая уместная мелочь делают вашу работу живее.
• Шутите и улыбайтесь, переносите свой юмор в работы. Юмор даже в хоррор проектах остается юмором. С юмором жить веселее.
• Overlay & Multiply – ваши лучшие друзья

Совет 1: Подготавливая фон, к примеру 800х600 лучше работать с исходным полотном большим по размеру хотя бы вдвое больше оригинала, т.е. 1600х1200. Это вызвано тем, что в работе с большим холстом вы можете позволить себе довольно сильные небрежности в штрихах, линиях и формах. Все это уйдет при уменьшении вашей картинки.

Совет 2: После уменьшения картинки во многих местах может возникнуть мыло. Те кто любят изображение четче могут воспользоваться фильтром Unsharp Mask он работает более корректно чем фильтр Sharpen, и имеет больше степеней настройки.

(Я, к примеру, ни одну из своих работ не оставляю без друга Unsharpa'а)

Кроме того помните, что залог успеха – простота. Простота выбранной технологии обеспечивает вам скорость. Простота обеспечивает вам удобство использования разработанного контента. Оставьте в стороне ваш чемодан с тысячей инструментов и поиски one-click плагина, или магического рендера который «сделает вам круто». Возьмите пару инструментов и отточите пользование ими до совершенства. Посмотрим… захочется ли вам после этого открывать свой старый чемодан.

Всем спасибо за внимание. Надеюсь данный туториал был вам полезен.

Дата последней правки в статье: 29 января 2016 года, 5:21.
В связи с поступившем сигналом о «пропаже» изображений из статьи, была проведена работа по их восстановлению. В ближайшее время они будут загружены на Хабр, чтобы в будущем подобные инциденты — не повторялись.
Андрей Ляпичев @Weilard
карма
416,7
рейтинг 0,0
художник, пиксель-артист, моделлер и дизайнер
Реклама помогает поддерживать и развивать наши сервисы

Подробнее
Реклама

Самое читаемое Разработка

Комментарии (101)

  • +47
    Я утверждаю и не беспочвенно, что хороший фон можно и нужно создавать не за неделю, не за пять дней и даже не за три. Чтобы сделать хорошую картинку для казуальной игры, без разницы i-spy это, match-3 или аркада, достаточно 48 часов.

    48 часов / 8-ми часовой рабочий день = 6 дней
    • +56
      Просто вы недостаточно хардкорны.
      • +41
        Ага, спите еще, небось.
    • +5
      Да, это 2 большие разницы:
      — сделать за 2 дня (пусть даже по 16 часов), а с заказчика получить оплату за 48 часов
      — работать 2 суток без сна (48 часов), а оплату получить за 2 дня
      Не огорчайте нас вторым вариантом.
      Конечно, если вы не в одном лице и заказчик и исполнитель
      • +2
        Я делаю такие штучки за 2.4 дня примерно. Утро третьего дня уходит скорее на осмотр сделанного и на мелочужку. Ценник за фон отличается от оплаты работ за 2, 3, 5 и более дней. Потому, что заказчик за два дня получает то, что в конторе делается как минимум неделю. Тут идет плата и за скорость, и за качество.
    • 0
      А по стоимости > $1k.
      Дорого, имхо тут было бы проще классическим способом рисовать, в 20ч уложилось бы.
      • +4
        Я бы не взялся, честно говоря. Классическим способом. Но это кому как удобнее. Иные и за час такой спидпейнт устраивают что диву даешься как это вообще возможно.
  • –21
    При менее агрессивной подаче было бы удобнее читать (повода как бы нет?)… «как это не печально » тут пишется «ни печально», и отбивается запятыми.
  • +10
    brevis
    Видимо я мыслю немножко иначе, но я ни в коем случае не навязываю. С тех пор как я ушел из гейм-дева мне гораздо выгоднее сделать что-то за два дня, чем растягивать на неделю. Да и рабочие дни почему-то превращаются в 16-и часовые, а не в стандартные 8-и, не будучи при том в тягость. Но тут, вы правы, имеется явный арифметический косяк с моей стороны. Часто бывает так, что когда начинаешь жить «криво» начинает казаться что и все остальные живут подобным образом… а это, слава богу, не так.

    akjoler
    Запятые сейчас же поправлю. Спасибо.
    • +7
      Пишите в ответы к комментариям.
      Хабр это умеет )
      • +2
        Спасибо. И вам, и всем тем кто забил тревогу и написал мне личные сообщения. Иначе я бы все комментарии бы забил неверно, а так хоть у части из них удастся сохранить структуру.
  • +5
    Всегда было загадкой, как делают такие красивые фоны и прочую графику. Думал, это сотни часов в фотошопе за сгибанием текстур и ручной подгонкой всего. Статья привела в восторг, спасибо!
    • +2
      На работу фонщиков приятно смотреть. Как-то давно довелось попасть на мероприятие, посвящённое 2Декабря. Ведущим там был Anry. И какой-то парень делал доклад по разработке фонов. Он на ровном месте, в фотошопе, из говна конфетку слепил. Причем все шаги были вот также достаточно просты и примитивны, а в итоге получилась классная сцена.
      • +31
        У меня есть мысль сделать ряд подобных статей посвященных пиксель-арту, простым скетчам (ручным) и скетчам с использованием 3D. Поскольку эта статья воспринята достаточно тепло, чего я, кстати, не ожидал… имхо имеет смысл посидеть и подготовить материалы. Если оно конечно интересно, и если подобных тем на Хабр еще не было, или были но недостаточно раскрытые.
        • +1
          Хотя это не совсем тематика хабра, но, я думаю, для многих это будет очень интересно.
          Буду благодарен, заранее спасибо.
          • +4
            Я постараюсь сделать это в легком и ненавязчивом стиле, не жесткого туториала, но выдвигая вперед базовый тезис о простоте. Говоря словами из анимационного фильма «Рататуй» — «Готовить могут все». Оно по сути так и есть. Не без исключений конечно.
          • +1
            Даже если и написано где-то, что компьютерная графика не относится к тематике хабра, подобные посты намного лучше засилья уроков по css, обзоров китайского железа и переводов аналитических статей.
        • +2
          Буду ждать с нетерпением.
        • +2
          Материалов от профессионалов — всегда не хватает. Наверно потому, что у профессионалов значительно меньше свободного времени и не так остра жажда прославиться, чего не скажешь о новичках. А у многих даже просто нет желания делиться опытом и умения преподнести материал. Так что, не стесняйтесь — с Вашей помощью этот мир станет немного лучше и это уже немало на самом деле.
        • +1
          Делайте обязательно!
        • +3
          Мне, как программисту, для которого дизайн это темный лес, читать было очень интересно. С удовольствием прочитал бы и другие статьи.
        • +3
          С радостью бы почитал статьи по пиксель-арту.

          Заранее спасибо.
          • 0
            И не только по нему.
        • 0
          Хм… А сделайте доклад на следующем CGEvent, если есть такое желание
          • 0
            Гм… не хочу показаться… хотя почему бы не показаться тем кто ты есть? Что такое CGEvent, где он проходит, и какого рода доклады там читают?
            Да и чем собственно будет хорош мой доклад? Боюсь, что с подобными вещами (вроде этой статейки) я буду не особо интересен.
            • 0
              Здесь подробнее про саму конференцию www.cgevent.ru/
              А народ там разный и рассказывают про всё, что связано с компьютерной графикой
              • 0
                Понятно. Спасибо за разъяснения. Почитаю. Правда не думаю, что на такие мероприятия стоит соваться человеку с моим уровнем.
  • +8
    kriokamera
    Нет-нет… если разобраться все предельно просто. Способов существует несколько, от полного 3D до полного 2D, но есть и промежуточные технологии вроде этой. И тут в чем соль, когда имеется туториал все идет как по накатанному. А когда ты сам до этого доходишь — проходят годы.

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

    Рад, что статейка оказалось полезной. Чертовски рад.
    • +5
      Не пользоваться кнопкой «ответить» под сообщением конечно простое решение, но имеет ряд недостатков. Например, комментарии превращаются в несвязную простыню, а человек, которому вы отвечаете, не получает уведомление ;)
      • +7
        Я больше не буду, честное слово. Каюсь. Грешен. Теперь обучен.
  • НЛО прилетело и опубликовало эту надпись здесь
  • 0
    Приятно видеть что столько внимание уделяется казалось бы не важным мелочам, но в итоге, насколько это все сильно меняет всю картину.
    Вот только я понимаю, что все это бралось просто с головы. Никакой методики, никаких шаблонов… что конкретному дизайнеру/художнику пришло в голову применить в конкретном узле, то и стало отличием. И кто знает, как бы это выглядело, если бы эту же работу делал другой человек.
    Вот так и с фильмами, многие шедевры такими стали, потому что, конкретный человек, на мелочах, но поменял всю картину в целом. И никто не знает, чтобы было, если бы роль сыграл другой человек.

    Кстати гифник с переключением варианта в одном слое, очень показательно. Было бы отлично чтобы и дальше вот так примеры наглядно показывали. Так гараздо легче воспринимаются все изменения и детали.
  • 0
    mifki
    Не совсем так. Если сделать рендер ряда объектов в виде отдельных слоев — он и станет маской по которой можно будет выделять объекты.

    Делаешь рендер пола, затем отдельно столов, или стен, сохраняешь в PNG или TGA и вот у тебя готовые маски для выделения. Все что нужно в таком случае нажать Ctrl + LMC на слое. Он сразу же выделит область по контуру.

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

    Точно также рисуются текстуры для игр. Нужна текстура в разрешении 1024x1024 ты ее делаешь в 2048x2048, т.е. в четыре раза больше, и позволяешь себе достаточно небрежные штрихи, которые при уменьшении текстуры «уйдут».
  • 0
    IhorL
    Вот только я понимаю, что все это бралось просто с головы. Никакой методики, никаких шаблонов… что конкретному дизайнеру/художнику пришло в голову применить в конкретном узле, то и стало отличием. И кто знает, как бы это выглядело, если бы эту же работу делал другой человек.


    Если относиться к этому как к технологии, то вы правы, совершенно неизвестно к чему может еще прийти человек и как он ее использует (либо ее фрагменты).

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

    Для меня в этом плане очень показателен Виктор Антонов, который в очередной раз доказал что Half-life 2 не рендер, не движок Source использовавшийся при разработке игры со своей специфической картинкой и шейдерами, но в первую очередь — человек. Это я, конечно же, о Dishonored.
  • 0
    Насколько же все-таки круто выглядит толково нарисованная 2D графика.
    • 0
      Так было всегда. Насколько бы круто не рендерилось 3D и какбы вы не трудились над детализацией… любой рендер 3D это всетаки останется искусветнным для восприятия. Да есть шедевры когда трудно отличить где рендер а где фотография. Но вот только растровая графика и только пиксельная обработка, превращает картинку в чтото больее живое, хоть и сразу видно что ненастоящее. И зритель изначально понимает что оно нарисованное, но в отличиеот самого крутого 3D рендеринга, такая картинка заставляет смотреть и любоваться, воспринимая ее более поживому чем даже фотку.
  • 0
    IhorL
    Вот только я понимаю, что все это бралось просто с головы. Никакой методики, никаких шаблонов…

    Тут как раз и есть методика, которая вырабатывалась приличное время. Совмещения ряда технологических процессов в один, обеспечивающий максимально быстрый результат при умеренно визуальном качестве.
    • 0
      Я имел ввиду не метод постобработки, т.е. оверлей или фильтр и в таком духе. Я имел ввиду, как неживому, придать более живое. Где то блики добавить, где то потертость, где то еще както… т.е. вот такие мелочи которые заранее не заложены, и никто не даст список или ТЗ как и что сделать чтобы было финишем. Тут все зависит от художника, что и как он видит, и как возвращается десятки раз к одному и тому же месту, считая что тут еще что то не хватает подсознательно.
      • +1
        Да… теперь понял. Тут только от человека зависит, ваша правда. От его чувств — меры, цвета, света. Ну и от внутренней искорки. По поводу потертостей и сколов… забавное расскажу. Это был второй год моего присутствия в гейм-деве. И другие художники в то время как Кощеи чахли над своими секретами. Приходилось чуть ли не подкрадываться и подглядывать из-за плеча (смеется).

        И один художник, спасибо ему за это научил меня двум фокусам — потертостям, и еще одному специфическому (который я не разу в жизни так и не использовал толком). С тех пор я так часто использовал этот прием и модифицировал его, что он приобрел новые формы, а народ стал звать меня «ржавым маньяком», прозвище для человека который души не чает в Fallout, более чем лестное.

        Так вот и получалось, здесь посмотришь, там подглядишь. А потом наступила эра туториалов и сеть начала заполняться информацией. Осваивать новое стало легче, и ноу-хау отдельных людей перестали быть таковыми.
        • +1
          Сечас как раз стало еще труднее. С каждым годом, слишком много информации и вариантов. Если раньше тебя заботил итог, а как это сделать, особо и вариантов то небыло много. Теперь же, имея конечную цель — нужно сломать голову, как и чем ее достичь. И не долько в дизайне, но и в программировании. Каждый метод, каждый вариант, каждый фреймворк, несут в себе и свои трудности и проблемы.
          Мне вот раньше было гараздо проще, сейчас вот уже наж каждой задачей бьешся, чем и как ее реализовать из всего хаоса что доступен в интернете сегодня.
          Таже игра, раньше сел и начал писать, решая все проблемы по потуи… сейчас сразу тупик с ходу… flash или html5, тот фреймворк или другой, серверная часть тоже вариантов хватает и т.д., и не дай бог ошибиться с выбором :)
          • 0
            Ох… я и не имел в виду, что либо отличное от арт-направления (дизайн, моделинг и т.д.) По части кода и всего связанного с ним — пусть голову ломает мой партнер. Хотя это и не правильно. По идее я должен мыслить на шаг вперед. Но код и я вещи совершенно не совместимые.

            Просто я считаю, что нужно поставить задачу и найти наиболее простой вариант ее решения. И потом уж гарцевать на этой лошадке сколько позволит ее ресурс жизнестойкости. Просто потому, что за постоянным движением технологий не угнаться. Каждый художник должен в определенный момент сказать себе стоп и заниматься тем для чего он рожден — творчеством. В том случае если это действительно художник, а не технарь. Потому как технарю нужно всегда быть в русле.

            К примеру, я неплохо разбираюсь в 3D и пока что умею его готовить. Но я уже сейчас сдаю позиции тем кто хорошо подкован технологически. Поэтому я выбираю ряд решений и их использую. Все-таки старая гвардия тоже чего-то да стоит. Да и игры люди хотят видеть не только технологически-совершенные. Многие устают от постоянной ВАУ-гонки, и больше обращают внимания на классику.

            Иначе бы не удались эти чудесные сборы денег на Кикстартер в поддержку старых игр, в поддержку возрождения той индустрии которую мы знали когда-то давно. Просто люди устали и хотят простоты. Хотят проверенных и классических решений в замену модных штанов с висящей задницей.
        • +11


          Я конечно не фоньщик, но реальности хочется больше в освещении.
          Есть много разных примудростей. Дорисовкадеталей там где их мало. Имитация освещения от источников, дорисовка рефлексов ну как будто GI включено.
          Свет мне кажется, должен быть там где ему место.
          • +1
            Все зависит от задачи фона. То есть от задачи поставленной мне заказчиком.

            На нем должны быть светлые персонажи в виде 3D-моделей, без теней на самих моделях, без источников освещения на них (т.е. любой персонаж в любой точке сцены должен быть освещен одинаково) + flat shading, что делает невозможным подобное освещение. На нем персонажи в краях экрана будут выглядеть белым пятном.

            Но… все-равно спасибо. Это было бы уместно если бы не было так как есть.
            • +1
              все — понял. Иначе при интеграции объектов будет заметно наложение. Как кстати cinema 4D, не подбирается конкурентно к решениям таких задач?
              • 0
                Мне кажется, что идеология у всех пакетов моделирования единая, и методы они используют одинаковые. Как не крути в пространстве это точки, ребра и образованные плоскости. Поэтому моделировать не важно где, у каждого свой любимый инструмент. И очень хорошо что их много.

                По части света, в каждом пакете найдется альтернатива Ambient Occlusion и точечным источникам освещения, стало быть и тут — годится.

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

                В статье излагаю базовые методы, они слава богу уместны для каждого пакета. Поэтому cinema 4D я думаю вполне подойдет.
                • 0
                  Я скорее имел ввиду как 3D шники владеющими разными пакетами друг с другом работают. Если вы не в курсах то и ладно)
                  Конечно в синеме все есть. Там и врей есть через бридж хитро хитро дорогой плагин.
                  • 0
                    Боюсь, что я совсем не в теме.
  • –4
    Сколько трудов ушло на моделирование этой сцены, золотое 2д какое-то получается
  • +2
    Fited
    Сколько трудов ушло на моделирование этой сцены, золотое 2д какое-то получается

    Смотря как подойти к этому «золотому 3D». Существуют десятки бесплатных библиотек с моделями самого разного качества. Одна из них упомянута в статье. Для того чтобы насытить сцену — текстурированные объекты не нужны. Это резко увеличивает количество найденных free-моделей, и даже в том случае если они среднего качества, или откровенно говоря — фиговые — существует дистанция камеры, выгодный разворот объекта. Т.е. наиболее выгодный его ракурс.

    В результате набивка данной сцены занимает часа 2-3, при ленивых телодвижениях 4-5. Это получается не «золотое 3D», а бюджетное. Экономное я бы сказал. И даже бы добавил — оптимальное.

    И хочу еще раз отметить — «сколько трудов» — не ушло. Эта и еще четыре подобных сцены создавалась в течении полутора-двух недель.
  • 0
    Скажите, а почему не наложить те же текстуры в 3Dmax? И тени, и отражения? Оно и правдоподобнее будет, и менять опять же можно без потерь (например, захотелось изменить форму «окна» -> переделать все маски, наложения и пр.)
    • +4
      savostin
      Скажите, а почему не наложить те же текстуры в 3Dmax? И тени, и отражения?

      Можно. Почему нет? Просто задачи такой не стояло. Задача состояла в том, чтобы данным туториалом мог воспользоваться если не каждый, то по крайней мере каждый третий из индустрии, без более глубокого знания пакетов моделирования. Вне сомнения можно и шейдеры настроить, и материалы, и даже рендер подключить из тех что более реальную картинку делают.

      Оно и правдоподобнее будет, и менять опять же можно без потерь (например, захотелось изменить форму «окна» -> переделать все маски, наложения и пр.)

      Тут оно как… палка о двух концах. Правдоподобнее не значит лучше. К примеру честное отражение от стола в районе пола выглядело бы совсем не так как бы мне хотелось, да и «честная» картинка обеспечиваемая рендером обездушивает изображение. Оно не получиться более рисованным, и более одушевленным. Это возможно только в том случае если поверху идет художник. А когда технология становится во главе угла… очень многое уходит.

      Любое изменение сцены, конечно приведет к некоторым правкам в слоях. Но обычно существует скетчинг локации, ее утверждение и запуск в продакшен. Переделки это признак того, что что-то не было продуманно. И это плохо.

      Тем не менее я не отрицаю, что наличие цельной сцены гораздо удобнее в плане модификаций. Отрицать это было бы просто глупо. Т.к. чем больше операций делается в одном софте, и чем универсальнее создаваемый объект — тем лучше.

      Все то, что я говорю, глубочайшее ИМХО. :)
  • +5
    Низкий поклон, Weilard! В мой, не совсем творческий мозг, не вмещается как можно просто взять, придумать, зайти и сделать такую обстановку… очень приятную обстановку!

    На самом деле, я всегда хотел попробовать свои программистские силы в игроделе. Исключительно для себя, правда.

    Кстати, может подскажешь кто где проще и удобней всего сделать хотя бы чтобы кто-то прыгал? :D
    • +2
      Спасибо за добрые слова.
      По поводу вопроса. Я с удовольствием подскажу ответ на ваш вопрос как только у меня получится его понять. Я несколько раз вчитывался в его текст, но так и не понял чего от меня хотя (улыбнулся).

      Кто прыгал? Где прыгал? Чтобы прыгал куда?
      • 0
        Наверное имеется ввиду 2х-мерная игра и фон к ней.
        • 0
          Просто даже с такой поправкой пока не получается понять суть вопроса. Идет ли речь о клик-менеджере, или о платформере, и если о них, — то в какой плоскости задается вопрос, — с точки зрения арта, или с точки зрения технологии, и не спрашивали ли на самом деле, просто, банально, про ресурс где можно заказать арт для какой-либо игры. Подобный вопрос можно трактовать настолько «трояко» что даже не хочется начинать писать ответы.
          • 0
            Вот кстати да, хороший вопрос — где можно заказать арт для своих целей? И еще бы так, чтобы пообщаться со знающим свое дело человеком, чтобы я как программист сам смог понять, что именно мне нужно от этого человека получить)
            Кстати, Вы на заказ для внешних заказчиков работаете или только для себя (в смысле внутри своей компании)?
            • +2
              Существуют профильные ресурсы, к примеру cghub.com, deviantart.com, gamedev.ru, cgtalk.com (ru), dtf.ru, gamedev.ru где можно найти художников самого разного калибра и взрывной силы. Если вам понравились работы кого-либо из них — вы можете обратиться к ним напрямую, и узнать доступны ли они для удаленной работы.

              При этом вы можете, и наверное стоит это сделать, отследить репутацию данного человека. Сеть очень маленькая и если кто-то из себя что-то представляет у него всегда есть «хвосты», зацепившись за которые вы сможете собрать информацию о нем. К примеру, погуглив обо мне вы можете найти мой блог, где я пишу об игрострое, выяснить что в чем-то я даже очень скандалист, что более всего ратую за качество, и что репутация у меня двоякая. Т.е. с одной стороны я вроде как скандалист, а с другой, что плохо сделанной работы за мной не тащится (для меня это самое главное, а личные качества человека по боку, главное чтобы как спец хорош был)

              Подобрав нужные кандидатуры таким образом вы можете также узнать ценники по индустрии. Потому что многие очень неоправданно задирают цену пользуясь неопытностью заказчика. Это… плохо. Этот заказчик никогда не придет второй раз к ободравшему его как липку.

              По оутсорсу все просто — я работаю на заказ постоянно потому, что это единственная возможность для инди обеспечить средствами собственные игры. Более подкованные в плане коммерции находят дополнительные источники подпитки, но я видимо пока не настолько толков. Делаю что умею.

              Ну и честно скажу, что компания это слишком громкое название для моего детища. Скорее студия. Да и то, студия горстки людей раскиданных по всему свету (улыбнулся).
    • –1
      HighQuality,, Боюсь что не от того человека ты ждешь ответа. Художник тебе тут ничем не поможет. Думаешь так просто, хзахотел и создал игрушк у? вот как раз оформление и наполнение не самое сложное… сами игру придумать нужно. Можно оформить до блеска все что угодно, но играть а нее никто не будет, а можно собрать примитивную казалось бы игру, без лоска и блеска но будет бомба за счет идеи. Нез зря менторы разьезжают по регионам в поиске идей, бо это самое сложное.
      Тебе в пример Майнкрафт, в прототипе был вообще непонятно чем… сама идея… вот что всех поразила. Если етсь идея, собери, а красоту можно потом допилить…
    • 0
      Weilard, 2д платформер с прыгающим квадратиком? :-)
      IhorL, никто не говорит, что это просто и легко, но возможно есть опытные и добрые хабражители, которые подскажут… Наведут на мысль…

      Интернет выдает очень много информации на тему _как сделать игру/платформер_, но какие инструменты применять человеку, которые вроде и называет себя программистом, но…
      В общем одно желание и умение создавать простые сайтики без использования готовых cms.
      • +7
        Ох… батенька. Тут, во-первых Google в помощь, а во вторых — точных рецептов нет. Все это великое таинство именуемое регулярной и каждодневной работой над собой. 12 лет назад я начал делать свою первую игру, и получилась она крайне кособока. Сейчас на нее без смеха смотреть не могу, но тогда я доказал себе что могу хоть что-то.

        Чтобы доказать себе что ты хоть что-то можешь, нужно создать игру без графики. Так поступает каждый кто хочет создать игру. Художник, если он стартует один сидит и рисует наброски локаций, тайлы, персонажей, или что-либо еще. Играет в нее в голове. Сценарист — пишет сценарии, мини-публикации об игре. Программист самый сильный из этих персонажей. Он может сделать игру на кубиках, и в нее даже может быть будет интересно играть. Потому что игра — есть гейм-плей. А гейм-плей не привязывается к графике, звуку и тексту. Это алгоритм. Который программист вполне может разработать самостоятельно.

        И вот ежели эти идеи и наброски кода есть — тогда путь на Gamedev.RU При большом количестве бездельников и школьников, а также людей которые вместо разработки игр занимаются игрой в разработку игр (куда без них), есть настоящие звезды, часть из которых самостоятельно пробилась в Steam, что само по себе уже доказательство их таланта и их умения двигаться.

        В любом случае спрашивать меня о коде — не стоит. Я художник. Гейм-дизайнер. Болтун и писака, но не кодер. Всего связанного с кодом — я боюсь как огня. Даже HTML'я.
        • 0
          Weilard, эгегей! Шикарно!
          Даже не смотря на то, что ты дизайнер — ответ всё равно максимально подходит под мои запросы. :)
          Лучей!
  • 0
    Автор, вам из ВК просили передать.
    Антон Таран
    Здравствуйте! Если это читает автор данного поста, хотелось бы Вас попросить, чтобы Вы дали свой-мейл.Действительно очень бы хотелось пообщаться с Вами на данную тему, но у меня только рид-онли аккаунт.Заранее благодарен.

    • +2
      Доброго времени суток Антон. e-mail'ы имеются lionwood-studios.com/contact.html но я сразу должен предупредить что количество свободного времени, и времени на сетевые диалоги вообще, у меня строго ограничено. Не потому, что я не хотел бы общаться с кем-либо, но потому, что очень сильно загружен НГ'ом, семейством, детками и… своей игрой. Каждый час проведенный в сети я отнимаю у них и мне очень стыдно. :)

      Поскольку пост на Хабре совершенно случайно оказался читаемым… я подумал, что будет полезно потратить час или два на ответы интересующие хабрчан.

      Однако в остальном, большей частью я веду диалоги исключительно на деловые темы. В случае задержек с ответами, — прошу на меня не обижаться и не серчать.
  • +1
    После прочтения статьи и комментариев совет — напишите книгу. Не обязательно о геймдеве.
    • +1
      (засмеялся)
      Мои друзья часто говорят «Ну все! Включил писателя»… это означает что Остапа понесло. Мысли о книжке были, но вряд ли кто-то захочет ее публиковать. Писателей много, и книг много. Никому не нужен еще один фанат пост-апокалиптики (а не на что другое меня не тянет по части искусства). Но тем не менее в свободное от гейм-дева время я пописываю свою первую и очень наивную книжонку. Если никакое издательство ею не заинтересуется — просто выложу в сеть. Быть может кому и понравится.

      Спасибо за добрые слова.
      • 0
        В век интернета книги не обязательно печатать на бумаге. В электронном виде они тоже продаются. А можно подумать и об альтернативных способах монетизации…
        • 0
          Обязательно подумаю об этом. Но по завершении работы. Когда продукт есть — его и пристроить можно. А так… только воду в ступе толочь. Но, признаться, я совершенно не думал о электронных способах продажи, и уж тем более о таинственных альтернативных способах. Век живи — век учись. Фоны, модельки и игры начисто выбивают из головы трезвые мысли. Хорошо что другим людям пока еще удается их до меня доносить. Спасибо.
          • 0
            Тогда в копилку альтернативных способов: создание видеоуроков и создание справочных/учебных сайтов. Видеоуроки в принципе как и книги продаются, а сайты чаще монетизируются за счёт сопутствующей рекламы или продажи ссылок (хотя, лично я, к ней отношусь крайне негативно), реже — как способ продажи собственных услуг.
            • 0
              Есть замечательное правило, не поступай с другими так как не хотел бы чтобы поступили с тобой. Руководствуясь им я не могу себе позволить давить посетителей сайтов и читателей рекламой даже зная что это могло бы принести так необходимые мне средства. По той же причине игры должны покупаться, а не скачиваться с торрентов, по той же причине у меня не хватит совести брать с кого-то деньги за уроки. Видимо это наследие СССР, а именно «Образование должно быть бесплатным».

              Думаю, что в моем случае это будет Donation. Если я окажусь не чилийским лохом (прощу прощения, и в мыслях не было оскорбить жителей Чили, или каких-либо уважаемых лохов), то пользователи меня не оставят в беде. Это гм… конечно наивно, но лучше уж так. Мне спокойнее будет. Вот, к примеру, Тима Шафера поддержали рублем… поддержали. Что мешает сделать мне тоже самое? Видимо то, что в паспорте не значится что я он. Ну значит сам дурак. Есть куда расти. А чудо-Хабр мне в этом поможет.
  • –1
    Плюсы ставить не могу — напишу в комментариях — Bravo!
    Одной тайной (как это делается) в моей голове стало меньше
  • +1
    А не проще ли вместо ручного оверлея изображений использовать чуть более аккуратно поставленный свет/текстуры и использовать рендер с каустиками (чтобы сразу все тени под столиками были как нужно, и так далее)?
    • 0
      А не проще ли вместо ручного оверлея изображений использовать чуть более аккуратно поставленный свет/текстуры и использовать рендер с каустиками (чтобы сразу все тени под столиками были как нужно, и так далее)?


      Все это было уже обсуждено А — в самом туториале (концепция простоты), и Б — в комментариях к статье имеющий подобный вопрос (см. выше). Задача у туториала обратная «рендеру с каустиками». Это пособие для тех кто с 3D имеет очень мало общего. Мне бывает пишут художники с вопросами о том как бы так использовать 3D для ускорения работ, но при этом не сильно напрягаясь. Это ответ и им, и другим из тех, кто может задать подобный вопрос.

      Можно сделать все что угодно, но не все что угодно можно впихнуть в одну небольшую статью посвященную одному конкретному способу.
      • +5
        Вопросы «а не проще ли..?» возникают от того, что в статье изначально в довольно общих чертах описан образ персонажа, которому этот метод адресован.

        Я не знаю, имеется ли у вас классическое художественное образование, но описанный метод создания фона в этапах повторяет классическую живописную технику — создание в 3D Max аналога живописного «подмалёвка» (изображения, содержащего основные пятна распределения цвета и света) с последующей прорисовкой поверх мелких деталей в Photoshop, что требует от выполняющего эту работу определенной (существенной, если сравнивать со средним уровнем их наличия) доли художественных способностей (если надо, я поясню, для чего конкретно они нужны). Так что целевая аудитория описанных методов — люди с некоторыми художественными способностями, поверхностно владеющие 3D Max и неплохо владеющие Photoshop.

        А «рендер с каустиками» — это никак не худший и не более медленный инструмент (как и другие, на которые можно переложить часть решения задачи с Photoshop на 3D Max). Это просто инструмент, которым быстрее и проще пользоваться технарю, который лучше умеет чертить (моделировать), чем рисовать, и который «видит» сцену не в форме комбинации цветовых пятен и т.п., как это делает художник, а в форме совокупности физических эффектов и средств их моделирования. У такого человека куда больше времени уйдет на рисование масок, ручное раскрашивание и рисование рефлексов и царапин, чем на моделирование этого в 3D Max (если, конечно, его умение моделировать равнозначно умению рисовать у человека, который описан в первом примере и в вашей статье).

        Просто поймите, что «простота» у каждого своя.

        P.S. Квотить сообщение, на которое отвечаете, тут не обязательно — тут не Fido и не email — древовидная структура комментариев и нажатие на ссылку «ответить» под сообщением, на которое отвечаете, гарантируют, что будет понятно, на что вы отвечаете.
        • +1
          Квотить сообщение, на которое отвечаете, тут не обязательно — тут не Fido и не email — древовидная структура комментариев и нажатие на ссылку «ответить» под сообщением, на которое отвечаете, гарантируют, что будет понятно, на что вы отвечаете.


          Начну с цитирования. Цитирование в ответе приводится не для того чтобы имитировать FIDO, или общение по e-mail, но для того чтобы читатель, которому адресованы эти слова точно знал к какому абзацу и к какому из вопросов относится последующий текстовый блок. Если в ответе кто-либо спросил о погоде, затем упомянул политическую обстановку в Сибири и присовокупил к ней мысли о состоянии дел на фондовой бирже, то ему удобнее будет увидеть на какой конкретно вопрос из имеющихся производится ответ. Простыми словами, — чтобы не выпасть из контекста. Что я и делаю. Это просто удобно. И для пишущего, и для читающего в первую очередь. Ведь речь идет не о древовидной структуре, а конкретной части сообщения, если оно объемно.

          Так что целевая аудитория описанных методов — люди с некоторыми художественными способностями, поверхностно владеющие 3D Max и неплохо владеющие Photoshop.

          Не соглашусь с этим заявлением. Просто потому, что владение четырьмя или пятью инструментами в фотошоп никак не подходит под определение «неплохо владеющие».

          А «рендер с каустиками» — это никак не худший и не более медленный инструмент (как и другие, на которые можно переложить часть решения задачи с Photoshop на 3D Max). Это просто инструмент, которым быстрее и проще пользоваться технарю, который лучше умеет чертить (моделировать), чем рисовать, и который «видит» сцену не в форме комбинации цветовых пятен и т.п., как это делает художник, а в форме совокупности физических эффектов и средств их моделирования.

          К сожалению в статье сложно учесть все множество градаций людей обладающих самыми разными навыками. В этом случае это получилась бы книга, а не статья. Кроме того в ней очень часто упоминается о целевой аудитории, на примере человека который _не технарь_ Исходя из этого предполагается что именно для них написана эта статья, и именно для них этот метод проще чем скрупулезное изучение пакетов трехмерного моделирования.

          Просто поймите, что «простота» у каждого своя.

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

          Я не знаю, имеется ли у вас классическое художественное образование, но описанный метод создания фона в этапах повторяет классическую живописную технику — создание в 3D Max аналога живописного «подмалёвка»

          Было бы странно предположить, что человек который занимается рисованием приличное количество лет не знает что такое «подмалевок». И даже не потому, что он много рисует, а потому что принцип скетча, или наброска сводится к тому, что создавая размытое общее движется к законченному целому. Но даже если предположить то, что он этого не знает то можно прийти к тому, что это не принцип изобразительного искусства, это принцип создание чего либо вообще. У любых сущностей.
          Потому как создание чего либо начинается с базы. С идеи. С какого-то наброска, даже если это не относится к рисованию. Собирая избу вы в начале оперируете срубом составленным из бревен, затем добавляете остальные мелкие детали к каркасу. И т.д. И т.п.

          Художественного классического образования у меня нет, и слава богу, но это уже совершенно отдельная тема, и отдельная беседа и отдельный взгляд на вещи. Потому как кроме всего прочего «классическое образование» это корень проблем, одной из многих надо сказать, в игровой индустрии. Процент людей самоучек попадающих в игровую индустрию и приносящих там пользу гораздо выше количества людей с художественным образованием, потому как наше художественное образование занимается тем что начисто выбивает из людей их идеи, изюминки заменяя на сухую технику без какой-либо фантазии.
          • 0
            Как-то вы агрессивно приняли мой комментарий…

            Я вас не подозревал, что вы чего-то не знаете или не умеете. Я всего лишь хотел сказать, по какой конкретной причине вам тут технари задают вопросы «а не проще ли… ?». А за одно намекнуть, что когда утверждается простота какого-либо метода, неплохо бы конкретно указать на то, для кого именно это будет просто, а иначе придется вот так отвечать на «а не проще ли… ?».

            Аналогия с подмалёвком и нанесением деталей была также вполне конкретной и узкой — очевидно, что и в моделировании обрастание деталями идет в той же последовательности от общего к мелочи, но то, как именно добавляются эти мелочи, принципиально различается в 3D и 3D+2D.
            • +1
              Нет, что вы, это не агрессия. Скорее четкая позиция. Я технарей встречаю с распростертыми объятиями и по мере сил пытаюсь объяснить почему все изложено так, а не иначе. К сожалению текст комментариев это просто текст, и не всегда можно понять какой мотив и посыл скрывается под ним. Трактую в меру своей испорченности, и базируюсь на предыдущих публикациях в сети. Поэтому конечно могут быть какие-либо недопонимания. Вероятно в моем случае так и получилось. Извините если что не так.

              Мне показалось, что в статье я неоднократно упомянул что предполагаемый персонаж не имеет каких-то особенных навыков, и умеет пользоваться весьма ограниченным набором инструментов. Это в моем понимании и есть простота, когда обладая шилом, топором и стамеской можно сделать что-то приличное. Ее я и обозначил.

  • +1
    Очень понравилась ваша работа.
    Позволю себе немного субъективной критики:
    Вот почему столы стоят так идеально ровно?! По-моему, картинка была бы более живой, если внести небольшой(!!!) «беспорядок» в расстановку столов… хотя бы на несколько пикселей.
    • +1
      Спасибо!

      Вот почему столы стоят так идеально ровно?! По-моему, картинка была бы более живой, если внести небольшой(!!!) «беспорядок» в расстановку столов… хотя бы на несколько пикселей.

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

      И порой… лучше сделать как тебя просят, не объясняя что подвижки в один пиксель будут незаметны и не предлагая изменить положение логических слоев в движке, и уж тем более не предлагая сделать что-то по-своему, так как сделал бы ты если бы делал этот проект сам.
      Заказчики очень разные, очень по разному реагируют на критику, чаще всего, кстати, сходясь в одном — «мы лучше знаем как и что делать» (и не важно что после этого «мы знаем» ты хихикая говоришь — я же предупреждал, — показывая на возникающие тут и там, а главное предсказанные, косяки).
      • 0
        и не важно что после этого «мы знаем» ты хихикая говоришь — я же предупреждал, — показывая на возникающие тут и там, а главное предсказанные, косяки)

        Это так везде)))) Да, исполнитель наперед часто видит в чем ошибется заказчик. Смещение столов, на пиксель чутка поворотов, конечно не испортило бы все равно готовую анимацию никакую. Но хотят тут уж ничего не поделаешь) Знакомо. Хоть убейся но я тебе плачу и я знаю как лучше) Вобщем-то и не поспоришь)
  • 0
    А что за игра? Захотелось поиграть в неё))
    За ранее извиняюсь, если пропустил по тексту, но не нашел.
    • +1
      К сожалению игра до сих пор в разработке. Свою часть я сделал, а уж когда разродится заказчик — мне неизвестно. )
  • 0
    Вы вручную в фотошопе текстуры обрезали? Разве нельзя повесить разноцветный flat shader, и легко и просто выделять нужное в фотошопе. Картинка из интернета по теме
    • 0
      Можно, но в «условие задачи», из которого исходил автор, это не входит. Тут уже спрашивали.
      • 0
        Вы наверно неправильно поняли, что я написал. Ибо я не вижу никакой связи приведенного мной способа быстрого выделения отдельных объектов (текстур) и предложением сразу сделать более проработанный рендер.
        • 0
          Я все правильно понял.
          Вы предлагали использовать flat shader в Максе? Предлагали. С точки зрения автора (пусть он поправит меня, если я ошибся) любое дополнительное действие в Максе само по себе — это усложнение процесса, что справедливо для того, кто Максом владеет крайне поверхностно.
          Мне, как в большей степени технарю, ваше предложение нравится. (Более того — в производстве видео непосредственный рендеринг масок для последующего composing-а, скажем, в After Effects — постоянная практика.) Но я прекрасно представляю себе художника, который будет тыкаться в незнакомые кнопки в Максе и думать «я лучше выделю то же самое вручную».
          • 0
            Если человек умеет накладывать обычный материал (а это было продемонстрировано в этой статье), то я думаю, что наложить точно такой-же материал но «плоский» не составит никого труда.
            • 0
              Поскольку в статье объясняется, как накладывать материал, из этого следует, что человек, которому это адресовано, «не очень умеет» это делать.
              Вы удивитесь, но нередко даже очень опытные люди просто «ездят по накатанной» и любое малейшее отступление от привычной практики (вроде иконки другого цвета на кнопке или, не дай бог, переименованного пункта меню) ставит их в тупик. Просто у них так могут работать мозги. Человеку с техническим взглядом на вещи это чуждо и непонятно, но так бывает.
            • 0
              Маска — это просто ZBuffer, который можно получить за тот же рендер отдельной картинкой (прозрачный фон и градиент по глубине отрендеренного объекта), часто делается одной тычкой в свойствах рендера (получается отдельное изображение).
              • 0
                Использовать ZBuffer для выделения объектов? Ну это разве-что подойдет для ну очень простых сцен и то при определённых обстоятельствах. Если уж приходится такую работу часто, то проще использовать скрипт и делать маску в один клик.
                • 0
                  Еще раз — объекты могут рендериться отдельными пассами с активацией только ZBuffer-а (по крайней мере это без проблем можно сделать в blender3d) — на выходе за один раз получится одна картинка с AO + набор масок отдельных объектов — все одинакового размера. То, что содержится в маске (глубина в грейскейле с нулевой прозрачностью), не играет абсолютно никакой роли — оно нужно только для отделения объекта от прозрачного фона.
    • 0
      У Автодеска для этой задачи кстати есть objectid и materialid пассы, они как раз и сделаюы для этой цели. Включаются одним кликом, и материалов никаких назначать не надо.
    • +1
      Нет. Текстуры обрезались по маскам которыми являются сами рендеры с альфа-каналом отдельных групп объектов разбитых на разные слои. Повесить можно все что угодно, если знаешь об этом. Мне такой способ не был известен и посему я им не пользовался. Если бы пользовался — то без сомнения обязательно рассказал бы.

      Я не претендую на истину последней инстанции. В комментариях люди, к примеру, предлагают полностью переключиться на 3D-пакет, кто-то предлагает еще какие-то варианты. Все они уместны и имеют право на жизнь.
  • +1
    /me подобрал челюсть.
    Ждем новых статей на тему макса и его друга фотошопа.
    • +3
      А я бы хотел больше инфы не по работе с конкретным софтом (по которому и так всего навалом), а по самим принципам дизайна, подходам, хитростям, методикам, техологиям и тп. Ибо мне, например, больше импонирует блендер и его друг гимп… Это дискриминация!
      • 0
        Все, что написано в статье, применимо и к blender3d+gimp. А так — да, хотелось бы еще узнать, как в данную отрисованную фактически от руки картинку «втыкаются» персонажи и метод их изготовления: если рендер, то будет выглядеть плохо; если рисование руками, то как же быть с анимацией, это же самоубийство.
      • +1
        что вы, что вы, никакой дискриминации, первое что пришло на ум.
        надо не забыть, как закончу ковырять ядро на восприимчивость к видео собрать блендер
  • +5
    Это отлично, спасибо за статью и велкам ту хабр.

    Ценный совет: всегда заливайте картинки на habrastorage.org — он выдержит любые нагрузки. А то эти ваши картинки у меня грузятся по 20 минут и то через одну.
    • +1
      Спасибо большое, мне написало много самых разных людей. Один из них настоятельно попросил выкладывать графические ресурсы на habrastorage.org и популярно объяснил мне почему все так, а не так. Этим Хабр кстати очень мне импонирует. Я вроде как на огонек зашел, лавку сломал, в косяке застрял и других косяков наделал.

      Из косяков выбраться помогли, в достаточной мере тепло отнеслись да еще и советов добрых дали. Спасибо! )
  • +5
    Думаю, выскажу мнение большинства: Это шикарнейший пост для песочницы! Поздравляю!
  • +1
    Это очень круто!
  • +1
    Не дизайнер, ни разу, даже не художник. Но от статьи ощущения только «мимими», пусть я не понял половину приемов (таки было же сказано что хотя бы базовые навыки нужны), но основной принцип доступен и главное не уничтожает волшебства картинки. Наоборот, как с фокусами, вроде и показали как сделано, а все равно волшебно.

Только зарегистрированные пользователи могут оставлять комментарии. Войдите, пожалуйста.