Изометрия в пиксель арт. Законы построения в изометрии.

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

Adobe Photoshop

Graphics Gale

Adobe ImageReady

Pixel Editor

Для новичков может сойти и просто Microsoft Paint. Ну в общем редакторов достаточно много и у вас проблем с этим не должно возникнуть. 

Что такое изометрия?

Изометрия-это представление объемного изображения на плоском экране, при котором размеры спроектированных деталей сохраняются по всем трём осям.

При рисовании изометрических объектов создается эффект трехмерности или грубо говоря 3D (без перспективных  искажений). В изометрии объекты не выглядят больше или меньше при приближении или удалении от наблюдателя. Обычные изометрические фигуры строятся под углом  30° к горизонтали, но в силу того что оси x и y не имеют аккуратной ровной линией используется другой угол 26.565°  к горизонтали. Образуется горизонтальная линия шириной в два пикселя и в высотой один пиксель при этом она не искажается при уменьшенном размере.

Виды построений в изометрии

Различается два основных способа построения объектов в изометрии.

Type A: Ближний угол рисуется двумя пикселями.

Type B: Ближний угол рисуется тремя пикселями.

Если вы собираетесь создавать отдельный объект не соединяя его не с чем то лучше использовать вариант «B»(если вы будете соединять то линии будут искажаться) и поэтому для соединений комбинации объектов используют вариант «A»

А какие линии то?

Эти линии довольно часто встречаются в пиксельной изометрии. С них и начинается построение.

Рисование иконок

Значок документа

Создайте новое изображение, атрибуты которого равны 20х20 пикселей. Установите нужный для вас цвет фона. Нажмите сочетание клавиш CTRL +0 для того что увеличить размер изображения на экране. Выберите инструмент «Карандаш» и установите размер рисования в 1 пиксель.

Рисуем, так как показано на рисунке выше. Небольшой совет, если вы будете удерживайте нажатой клавишу Shift, то во время рисования линии, вы будете проводить прямую линию. Теперь просто нарисуйте несколько линий посередине на нашей иконке.

Значок Корзины

Вы можете рисовать в одном и том же стиле как вам только будет удобно.

Иконка письма, дома и лупы

Ну в основном это всё. Обязательно пробуйте, практикуйтесь и придумывайте свои иконки.

Рисуем небольшую иконку женщины

Доброго времени суток читатели блога  IsoPixelGraphics. Сегодня мы будем рисовать иконку женщины. И так мы приступаем.

Для начала мы создадим новый файл, атрибуты которого будут 50 на 50 пикселей. Фон устанавливаем прозрачным и увеличиваем наш будущий рисунок до нужного размера. Для удобства создавайте новый слой, потому что, в дальнейшем, так будет легче редактировать свою работу. Выберите инструмент «Карандаш» и настройте его так, чтобы он рисовал размером в 1 пиксель. Далее рисуем так как показано на рисунке. 

Дублируем, то что мы уже нарисовали ранее.

Мы заполняем часть нашего изображения, любым цветом пожеланию. На рисунке использовали цвет #8F4700.

Создаем новый слой( это можно сделать одновременно нажав Shift,Control,N). После рисуем глаза состоящие из двух черных пикселей и добавляем немного границ для лица. Цвет #FE9E61.

Создайте новый слой и раскрасьте на нем лицо. На рисунке использовали цвет #FDD1A0.

Теперь же нарисуйте пару линий для рта. Здесь использовали цвет #DE1010. И не забудьте изобразить белым цветом лоб.

Создаем новый слой и рисуем линии, которые будут отображать шею. Цвет #CE776D.

Раскрашиваем шею. На рисунке используется цвет #FDD1A0.

Создаем новый слой и там же рисуем линии, которые образуют тело нашей пиксельной леди.

Оставшиеся части тела раскрашиваем цветами: белым(#FFFFFF), темно-оранжевым(#FF3401) и светло-оранжевым (#FF7749). Нижнею часть раскрашиваем цветом #FF3401.

Финальный результат. Пожеланию можно продолжить этот рисунок добавляя детали. Например как показано ниже.

И вот что у нас из этого вышло.