Рубрика «графика»

Как правильно вставлять SVG - 1

Как правильно вставлять SVG?

Читать полностью »

В коде id Software порой встречаются бесподобные жемчужины. Самая знаменитая — это, конечно, 0x5f3759df, удостоившаяся даже комикса на xkcd. Здесь же речь пойдёт о заливке экрана: пиксели закрашиваются по одному в случайном порядке, без повторов. Как это сделано?

Попиксельная заливка экрана в Wolfenstein 3D - 1 Читать полностью »

image

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

Читать полностью »

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

image

FotoFast: убираем обводку

FotoFast — небольшой фотосалон из Петербурга. Они обратились к нам, чтобы мы подсказали приемы, для улучшения для их логотипа. Прикидываем, что можно сделать:
image
Убираем тяжелую, черную обводку и подбираем контрастные цвета — белый и зеленый. Теперь необходимость в обводке отпала, цвета делают работу за нее. Мы бы предложили “FotoFast” использовать такой прием, как динамическая айдентика:
Читать полностью »

И снова всем привет! Спешу поделиться, у меня были отличные выходные! Полтора дня я обдумывал вариант подачи материала, пилил макет и вообще всячески старался сделать хорошо. Что такое хорошо в контексте обучающего материала? На мой взгляд это «интересность», краткость, корректность и наглядность. Для меня лично написать такую статью — это подвиг. А вот серию статей — просто емкая и ответственная задача. Изучать Scene2d мы будем в процессе написания игры с нуля! Процесс нашего творчества растянется на долгие десять-двенадцать дней. Мне хочется верить что периодичность материалов будет примерно раз в день. Для меня лично это очень амбициозная задача, ведь требуется не столько запрограммировать, но и описать в статьях с детальным разбором. Я не сторонник бросаться в бушующий океан, в надежде научиться плавать. Мы прыгнем у лужу и будем последовательно ее углублять и расширять. Итак начинаем.

Разработку любой программы я настоятельно советую начинать с составления карточки продукта. Из обязательного — цели. Я составляю карточку продукта в Google Docs и вот как карточка выглядит в нашем случае Читать полностью »

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

Графика, это первое что бросается в глаза пользователю, запустившему ваше приложение. И хотя в Google Play есть несколько игр чисто текстовых, это исключение из правил. И в разработке подобных игр без сомнения полно своих подводных камней. Что же следует сделать инди-разработчику, чтобы не провалить то самое первое впечатление? В первую очередь следует на первых этапах разработки определиться с основным интерфейсом. Есть несколько практик как сделать это быстро и дешево:
Читать полностью »

GraphicsJS – графическая JavaScript библиотека - 1

Перевод статьи. Англоязычный оригинал опубликован на SitePoint – "Introducing GraphicsJS, a Powerful Lightweight Graphics Library".

HTML5 – основа основ современного веба. И сегодня, когда встает задача создать интерактивную графику, выбор чаще всего падает на такие технологии, как SVG и Canvas. Flash позабыт, Silverlight – редкая птица, обитающая на задворках веба, и почти никто не помнит сторонние ActiveX и Java-плагины.

Плюсы и минусы SVG и Canvas хорошо известны – в целом все сводится к тому, что для создания интерактивных элементов и работы с ними больше подходит SVG. Это векторный формат, основанный на XML, и, когда изображение загружается на страницу с использованием тега <svg>, каждый его внутренний элемент становится доступен в SVG DOM.

В данной статье я хочу рассказать о GraphicsJS. Это мощная графическая JavaScript-библиотека с открытым исходным кодом, основанная на технологии SVG (VML для старых версий IE). Начну с краткого введения в основы GraphicsJS, а затем проиллюстрирую возможности библиотеки двумя небольшими, но наглядными примерами. Первый из них посвящен изобразительному искусству. Второй покажет, как менее чем за 50 строк кода сделать простую арт-игру в жанре таймкиллера.Читать полностью »

Пост-эффекты в мобильных играх - 1

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

Что касается пост-обработки — её волшебное действие на фотографии было открыто задолго до появления первых компьютеров, а её математический и алгоритмический базис, созданный для цифровой обработки изображений, удачно вписался в программируемый конвейер GPU.

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

imageАвтор материала знакомит нас со своим коллегой Крисом — @Malakhor9000

Крис работает в офисе, где есть целая куча сотрудников, которым нравится «лепить» его лицо фотошопом на самые разные фотки, и постить все это в Slack-канале компании.

Однако постоянно открывать редактор и «копипастить» вырезки лица — дело нудное, особенно когда Крис пытается отвлечь коллег рассказами о своих геройствах в Smite. И вот после многих ночей, проведенных в фотошопе на протяжении нескольких недель, автор материала решительно захотел найти более удобный способ. Так на свет появилась идея написания @Chrisbot. Подробности этой истории ниже.

Изначально, когда я обдумывал идею, я знал, что в проекте будет три главных компонента:

  1. Простая обработка изображения.
  2. Интеграция со Slack.
  3. Распознавание лиц.

image
Читать полностью »

image

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

Читать полностью »