Как рисовать фоны для игр и мультиков

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

Чтобы не повторяться, поделюсь теоретической информацией про  фоны для мультиков. Фоны не менее важны в мультике, чем  сами персонажи. Они  очень многое  могут рассказать о персонаже, об истории в целом.

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

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

 

Продолжение. В принципе, то же самое, что и на первом рисунке: избегайте рисовать в одной плоскости, используйте ассиметрию. Также следите за четким силуетом, чтобы по форме можно  было легко опознать объект (4) .

 

(Автор рисунков - Sherm Cohen)

 

Чтобы нарисовать удачный фон для мультика,  в первую очередь, нужно научиться работать с перспективой.

По закону перспективы, параллельные линии сходятся в одной точке на линии горизонта. Существует три вида перспективы:

1-но точечная (One Point Perspective)

 

2-х точечная (Two Point Perspective)

 

3-х точечная (Tree Point Perspective)

 

Как научится работать с перспективой?

В этом помогут книги и уроки, которых в интернете очень много. Например,

1. Теория перспективы, основы -  http://www.khulsey.com/perspective-drawing-basics.html

2. 2-х точечная перспектива - http://www.khulsey.com/drawing-2-point-perspective.html

3. 3-х точечная перспектива - http://www.khulsey.com/drawing-3-point-perspective.html

При желании все эти материалы можно найти на русском языке.

Примеры использования перспективы в рисовании фонов я взяла из книжки про Симпсонов - «The-Simpsons-Handbook».

Этот мультик был сделан не во флеше, а в программе Toon Boom. Но  это не столь важно, рисунки фонов отлично иллюстрируют все выше сказанное. И да, перевод мой, поэтому не идеален:)

1. Кухня Симпсонов

 

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

 2. Кухня(2)

 

Обратите внимание, как детали фона  рассказывают нам о персонажах. Блокнотик с отрывными листиками на холодильнике указывает, что Мардж и Гомер – великолепные родители, а стульчик в углу напоминает о том, что там случай от случая  отдыхает Барт (видимо, он там в наказание сидит:) Трещина на стенке подтверждает, что Гомер тратит куда больше времени на телевизор, чем на ремонт дома.

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

3. Гостиная

Обратите внимание, что линии перспективы на этом фоне сходятся  в одной  точке под картиной. Это пример 1-но точечной перспективы (one-point perspective). Как зрителя, эта перспектива концентрирует наш взгляд в центре комнаты. Все объекты в этой комнате построены на основе 1-но точечной перспективы.

4.Таверна Мо

 

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

5. Магазинчик комиксов

 

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

Этот фон интересен тем, что линии перспективы сходится в точке на полу.

6. Супермаркет

 

Фон супермаркета нарисован с использованием 2-х точечной перспективы. Когда мы смотрим на этот рисунок, то наш взгляд опускается на пол.  Линия горизонта находится на уровне машины для шейков. Обратите внимание, как линии пола, ящиков с журналами, кассы и пр. сходяться на линии горизонта.

7. Супермаркет (2)

 

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

8. Класс Барта

 

Редкий пример 3-х точечной перспективы. Мы смотрим на помещение с высоты сверху вниз, так как линия горизонта находится за пределами рисунка. Использование 3-х точечной перспективы позволяет создать вид с высоты птичего полета. Можно проследить по горизонтальным линиям от двери класса, книжних полок, окон до вершини рисунка. Там находится первая точка, где сходяться линии перспективы. 2-я точка – от обратной стороны доски справа. 3-я точка находится за пределами нижней линии рисунка.

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

9. Рабочее место Гомера.

 

 Сложность и детальность изображения прибора только усиливает  комичность  идеи, что здесь действительно работает Гомер:)

Комментарии
Аватар пользователя multik

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

Аватар пользователя Game maker

Поддерживаю. Важнее копнуть глубже.

Аватар пользователя Zarkua
Аватар пользователя Anyoneelselikeyou

Спасибо, очень классно.
То, что долго и нудно объясняли в школе, коледже и универе можно так кратенько и увлекательно повторить, и плюс картинки потрясающие (никогда бы не подумала как много внимания они уделяют деталям - вроде трещины на стене!)

Аватар пользователя Oksana

я тоже думала, что графика в симпсонах примитивна) а оказалось, что фоны очень детализированы и продуманы

Аватар пользователя Ярослав

Oksana пишет:
я тоже думала, что графика в симпсонах примитивна) а оказалось, что фоны очень детализированы и продуманы

Но иногда перспектива в мультике перекручена, наверное из-за нехватки времени.

Аватар пользователя Андрей

Как раз то что в данный момент искал и познавал, только в картинках))) Спасибо, как всегда оказываете неоценимую помощь! =)

Аватар пользователя Oksana

значит, следующий пост вас также заинтересует)