Рисование большого 2D уровня бокового скроллера


12

Я относительно хороший программист, но теперь, когда дело доходит до добавления некоторых базовых уровней в мою 2D-игру, я немного застрял.

Что я хочу сделать: приемлемый, большой (8000 * 1000 пикселей) тестовый уровень "зеленых холмов" для моей игры.

  • Какой лучший способ для меня это сделать?

Он не должен выглядеть великолепно, он просто не должен выглядеть так, как будто он сделан в MS paint с помощью инструмента линии и заливки.

В основном это должно быть просто грязь с травой на вершине, в форме холмов.

Но как мне нарисовать его, я не могу просто взять инструмент карандаша и начать рисовать его пиксель за пикселем, могу ли я?


2019 год, вопрос по-прежнему актуален :)
Город

Ответы:


20

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

инструкции

  1. Получить немного грязи и текстуры травы. Тот, который я использую в своем примере, взят из этого набора свободных текстур .
  2. Откройте текстуру грязи в фотошопе. Выберите все Ctrl-Aи скопируйте Ctrl-C. Затем выберите Edit > Define Pattern...в меню. Назовите ваш шаблон "Грязь".
  3. Сделайте то же самое для текстуры травы, назовите ее «Трава».
  4. Создайте новый слой в Photoshop и применить Pattern Overlayи Strokeэффект к слою. Выберите рисунок «Грязь» для наложения и рисунок «Трава» для мазка (см. Изображения ниже).
  5. Нарисуйте любой кистью на вашем слое ... вместо того, чтобы иметь скучный единственный цвет, он должен рендериться как пейзаж, благодаря эффектам слоя. Прелесть этого в том, что вы можете свободно добавлять / удалять части вашего ландшафта, используя обычные инструменты рисования, такие как кисть или ластик.
  6. (необязательно) Нарисуйте градиент от темно-синего (вверху) до светло-синего (внизу) на фоновом слое вашего неба (для этого вы также можете использовать эффекты слоя).
  7. (необязательно) Добавьте еще несколько эффектов слоя, таких как градиент и тень, в слой «ландшафт», чтобы улучшить внешний вид.

Картинки

Настройки наложения шаблона

Настройки наложения шаблона Photoshop

Настройки хода

Настройки инсульта в фотошопе

Конечный результат

С еще несколькими эффектами слоя и фоном.

конечное изображение

Вы также можете скачать PSD-файл здесь, чтобы посмотреть его.


1
а у тебя просто одно большое изображение на весь уровень?
Призраки

1
Да, вы можете хранить его для всего уровня; Я бы отделил фон, объекты и т. Д. От реальных холмов. Для обнаружения столкновений вы можете использовать альфа-слой. +1 за удивительное техническое искусство :)
ashes999

4

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

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


2

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

Это поможет?


2

Я настоятельно рекомендую вам взять бесплатную копию Paint.NET , которая в 100 раз лучше, чем MS Paint - в ней есть несколько базовых инструментов, облегчающих создание произведений искусства в том смысле, в котором вы ищете.

Это, например, позволит вам сделать выделение и заполнить все выделение заданным цветом / градиентом, это избавит вас от использования инструмента «Перо» и рисования попиксельно.

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

Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.