Показаны сообщения с ярлыком pixel graphics. Показать все сообщения
Показаны сообщения с ярлыком pixel graphics. Показать все сообщения

пятница, 22 февраля 2013 г.

Сглаживание


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


Основы сглаживания

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




Пример 1 показывает разницу объекта со сглаживанием и без него. (AA-Antialiasing). Обратите внимание, на разницу эти двух кругов. Круг без сглаживания, выглядит плоским, да и в исходном размере ещё будут видны его неровные края. В примере 2 используют сглаживания на линии, чем дальше вы от  черного цвета рисуете, тем ярче цвет вы  будете использовать в дальнейшем. 

Примеры 3 и 4 показывают, как сглаживать линии находящиеся под углом. Линию 2x1, вы должны сглаживать в один пиксель справа и слева от линии. Для линии 4x1, я использовал два пикселя для сглаживания. Существует правило, которое гласит, что нужно использовать столько пикселей для сглаживания, сколько является длина половины исходной линии. Поясняю, у нас на примере исходная линия в четыре пикселя значит, сглаживание будет на два пикселя. В другом примере исходная линия 2 пикселя, сглаживания будет 1 пиксель. В общем, чем меньше будет использовать пикселей, тем лучше. 

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

Сглаживание цветов

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

суббота, 3 ноября 2012 г.

Полезные ссылки

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

среда, 8 августа 2012 г.

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


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

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





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


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





















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





























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








суббота, 28 июля 2012 г.

Учимся рисовать пиксельную иконку. Создание Pixel Icon.


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





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












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







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







Далее мы рисуем ещё одну иконку, увеличиваем её, скрываем предыдущий слой. При помощи инструмента «Карандаш», рисуем некое подобие бумаги.






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





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


Подведем итог о том, что теперь у нас есть, немного опыта, чтобы рисовать иконки размером 32x32.

Учимся рисовать девочку в Пиксель Арт


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

Всегда начинайте с основной формы головы человека. Нарисуйте форму головы и шапку с нужным вам контуром. Следом нарисуйте волосы и шею.




А теперь повторите структуру человеческого тела.
Она может быть худой, толстой, высокой или же низкой…все зависит только от вас.






Сейчас наступило время, чтобы раскрасить ваш рисунок. Выберите основной цвет для тона кожи, который вам понравится. И раскрасьте им лицо, шею и тело. Теперь подберите оттенки темнее основных цветов, чтобы показать места, куда падает тень. А ещё не забудьте, подобрать ей цвет волос.



Давайте раскрасим шапку, одежду и обувь любым основным цветом (Цвета могут быть разными в зависимости от вашего предпочтения). Смотрите, работа выглядит уже лучше, не так ли? Однако слишком простенько, давайте ее детализировать.





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

На этом пока всё. Благодарю за внимание, буду очень признателен если вы добавите статью в какую-нибудь социальную сеть. Это можно сделать, при помощи кнопок находящиеся левее статьи. Также они находятся и внизу. В завершении покажу вам как будет смотреться этот шедевр в исходном размере.

вторник, 17 июля 2012 г.

Как нарисовать дерево в пиксель арт


Нарисуйте круг.
-размером:70px
-цвета:#88bf67






Нарисуйте ещё один круг, однако он должен быть «несовершенным», то есть прорисованным не до конца, чтобы создать эффект тени.
-цвета:#f6d08d






И ещё один «несовершенный» круг.
-цвета:#cddd96








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










Нарисуйте полукруги в нижней части основы так, как показано в этом примере.










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










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










А теперь проделайте тоже самое, и с верхней основой.










Сейчас  нарисуйте в случайном порядке несколько таких пикселей, как эти:

С верхушкой проделайте те же действия.











Добавьте разбитые круги, чтобы заполнить «пустоту».







Напоследок закончите свою работу добавлением нового яркого цвета: -#e1f4a2






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



Как нарисовать сакуру в пиксель арт'е

Для начала рисуем ствол дерева.






Теперь  дорисовываем остальные ветки, которые будут вдалеке и из этого следует, что они будут темнее, чем все остальные.





Далее добавьте листья дереву красно-розоватого оттенка. Нарисуйте один листочек, скопируйте его и вставляйте




Дорисовываем остальные детали, если они потребуются.


В результате у нас получится что-то вроде этого.





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