Правильная работа с атласами иконок

[Hrust 21]

Правильная работа с атласами иконок

 

Приветствую, на связи товарищ Hrusteckiy — UI-программист, чьи плоды работы можно видеть в New Project, Last Fallout Overhaul, Забвение, Hike, и многих других, также сделавший 100x100 иконки для оригинальной игры.

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

Скрытый текст

 

Начнём с софта.

Первым делом - используем Photoshop CS5/CS6 или CC(я использую 2019).

Второе - забудьте про Stalker Icon Editor(2023 год на дворе всё-таки).

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

 

Далее, нужно работать с исходником - tga идеальный буферный формат для двух этих программ, сохраняем в 32-битном формате. 

 

Спойлер

 

Для добавления новых иконок, используем PaintDotNet. Делаем новый слой, на него вставляем нужную нам картинку и подгоняем под размер(билинейный метод), выделяем область, вырезаем и вставляем на основной слой, тем самым затерев предыдущую иконку, если таковая имеется. Сохраняем и переходим в Photoshop. Здесь включаем сетку (Ctrl+Э), её размеры настраиваются здесь, по умолчанию она 50 пикселей.

 

Спойлер

  

 

 

ВАЖНО!!! НЕ ИСПОЛЬЗУЙТЕ КРАЙНИЕ ПРАВЫЕ И КРАЙНИЕ НИЖНИЕ КЛЕТКИ, ОНИ НЕ ЯВЛЯЮТСЯ ЦЕЛЫМИ И МЕНЬШЕ ОСТАЛЬНЫХ НА НЕСКОЛЬКО ПИКСЕЛЕЙ.

 

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

Далее, переходим в "слои" и разблокируем слой - это нам открывает информацию в свойствах о выделенном элементе и его позиции. Именно здесь будем узнавать координаты, для 50x50 придётся пользоваться калькулятором, а для 100x100 всего лишь отсекаем по два нуля.

UPD: в CS5/CS6 получать координаты можно на F8(в новых версиях облегчили доступ и оно на вкладке свойств), при этом позицию выделения смотреть можно лишь от курсора, что не очень удобно.

 

Вот здесь позиция о иксу 950, разделим на 50 и получаем 19 - именно это число пишется в inv_grid_x. Аналогичная история с игреком. Ш - Ширина 50, делим на 50, получаем inv_grid_width равной единице. Так же и с высотой. ПОСЛЕ РАЗБЛОКИРОВКИ СЛОЯ НЕ СОХРАНЯЕМ АТЛАС, А ПРОСТО ЗАКРЫВАЕМ!

Открываем атлас в PaintDotNet или в Photoshop (нужен плагин dds).

 

Спойлер

 

Спойлер

 

 

Закрываем атлас и радуемся.

 

 

P.S. прилагаю свои атласы иконок ЧН, ЗП (названия кликабельны и содержат файлы).
P.P.S. https://youtu.be/5sU-B57OKRc записал ролик по рендерингу и добавлению новых иконок, blender-файл прилагается.

 

Изменено 31 Марта 2023 пользователем Hrust
Обновил атласы.

[Купер 2 919]

@Adm-RAL ,
 

Скрытый текст

да я к тому, что момент, вообще-то важный, не озвучен напрочь, а не за пикировки ради.

 

[nasar75 3 868]

4 часа назад, Hrust сказал:

забудьте про Stalker Icon Editor

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

 

И не надо высчитывать -- скопировал->вставил...

Да и пайт.нет для иконок не нужен - всё делается в фотошопе...

 

А вот статью о рендере стволов для иконок я бы почитал...

[Adm-RAL 2 306]

@Купер, так ведь и топик не о конкретных иконках, а о том как с ними вообще работать...
А уже конкретная работа с конкретными иконками, это следующая песня... Вот, я например для броньки делал... И если начну рассказывать всё, то это надолго... 
https://www.youtube.com/playlist?list=PLq9qd8SB9d58wCLcfmKgxMNRgUnTSl2SM

[Купер 2 919]

@Adm-RAL ,

3 минуты назад, Adm-RAL сказал:

так ведь и топик не о конкретных иконках, а о том как с ними вообще работать...

Пост выше.  @nasar75 . В качестве примера.

[Adm-RAL 2 306]

16 минут назад, nasar75 сказал:

А вот статью о рендере стволов для иконок я бы почитал...

Я лично всё из игры делаю. Там лучший рендер.
А если владеешь 3D-редактором, то можно от-туда... Но, придётся импортировать модель, прописывать текстуры и т.д. Хотя, не, если просто текстуры из игры, тогда только путь к ним надо будет прописать изначально. Ну и будет у тебя в итоге чёй-то такое...
https://drive.google.com/file/d/1XXDlAuzhpE20iM7A2lXOn-fKenWPyILI/view?usp=sharing
https://drive.google.com/file/d/17oMPFZd6oVrWWO86sp13wdAHwX6Dd9EM/view?usp=sharing
А потом ручками в ФШ правильно вырезать и в игру...

[Купер 2 919]

Интересно, кто-то заморачивался соизмерением масштабов, чтобы бутылка водки по размеру соответствовало размеру стандартного СИБЗа, например?

@Decadent , да быстрее самому сделать, один нюанс - на стандарте всё размещается на одном полотне, у OGSR-вариаций разнесено на несколько обычно.

[Zander_driver 10 334]

4 минуты назад, Купер сказал:

кто-то заморачивался соизмерением масштабов, чтобы бутылка водки по размеру соответствовало размеру

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

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

30 минут назад, Adm-RAL сказал:

Я лично всё из игры делаю. Там лучший рендер.

С некоторых пор (OGSR ) Да...

[Adm-RAL 2 306]

8 минут назад, Zander_driver сказал:

С некоторых пор

Ну, не принципиально на самом то деле... Объём от бампов работает в Сталкере с самого начала. Остаётся лишь выбрать правильное место, где свет хорошо ляжет на айтем. Да и в ФШ можно тоненько подогнать всегда... Так-что, ОГСР конечно ШАГ в мире Сталкера, но иконок это не сильно касается.
А, кстати, да, даже ведь вроде вид от третьего и демо_рекорд всегда в Сталкере работал! И, кстати, демо_рекорд очень хороший помощник для создания скринов айтемов, лежащих в правильном месте под правильным освещением...

[Купер 2 919]

@Zander_driver , интереснее прежде всего "правильное снятие рендера" в 3D-редакторе для последующей обработки. В СЗ, боюсь ошибиться, в качестве исходников (для оружейки, по крайней мере) использовались изображения реальных образцов.

[Adm-RAL 2 306]

3 минуты назад, Купер сказал:

"правильное снятие рендера" в 3D-редакторе для последующей обработки

А вот тут, кстати, ещё придётся как-то научить редактор подключать нормали (бампы) и задействовать их в рендере. Я лично в Блендере напрямую такого не увидел пока. Просто не надо было... Да и не будет надо, думаю... Бампы я и так делаю и подключаю отдельно от редактора. Да и нормалей то у нас нет, у нас бампы, а бампы понимает токма Сталкер и его рендер!  А если переводить бамп в нормаль и только потом юзать её в редакторе, то не, ну нафиг такой геморрой!

Изменено 21 Марта 2023 пользователем Adm-RAL

[Zander_driver 10 334]

2 минуты назад, Купер сказал:

В СЗ, в качестве исходников (для оружейки, по крайней мере) использовались изображения реальных образцов.

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

Но в итоге по целому ряду позиций оказалось что модель имеющаяся в игре, и фото реального образца с которого сделана иконка, имеют разные версии/комплектацию и т.п., что привело к вопросам игроков из разряда "А почему у этого ствола на иконке вот это есть, а в игре нету". А фото реальных образцов, таких чтоб они один-в-один совпали с моделями в игре, оказывается довольно часто - нереально найти. (Иногда их просто нет).

6 минут назад, Купер сказал:

"правильное снятие рендера" в 3D-редакторе

А что такое "правильное" ? Я думаю у каждого кто прикасался к теме, найдется свое мнение по данному вопросу. Как надо, и как не надо, и почему...

Мне то проще, т.к. СЗ своего рода, сама-себе-3D редактор. Подошел к определенному НПС, две кнопочки нажал, и вот у меня на экране достаточно правильный (нмв), рендер абсолютно любого итема. Именно игровой модели, в игровом рендере, с правильным освещением и на черном фоне... А чего еще для иконки надо? Не знаю. Так что для себя я этот вопрос закрыл.

12 минут назад, Adm-RAL сказал:

Так-что, ОГСР конечно ШАГ в мире Сталкера, но иконок это не сильно касается.

Ну при участии СЗ - уже точно касается.

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

[Adm-RAL 2 306]

1 минуту назад, Zander_driver сказал:

Ну при участии СЗ - уже точно касается.

Меня то может и да.  Но тема то ВООБЩЕ про иконки...  Я ж и ДО СЗ иконки делал, например для БЗ, где у меня каждая модель НПС была бронёй для ГГ и соответственно ей нужна была иконка.  Тогда, кстати, я иконки на полотне располагал (делал то понятно в ФШ) с помощью той специальной проги, и всё хорошо получалось.  А сейчас просто лень иметь несколько инструментов, поэтому ФШ пыхтит абсолютно над любыми текстурными работами... 

[Купер 2 919]

@Zander_driver , в качестве примера (первое попавшееся на глаза):

Скрытый текст

Вот вроде как - да, соответствует игровой модели... и... при этом жуть до полной неиграбельности.

[Zander_driver 10 334]

10 минут назад, Adm-RAL сказал:

тема то ВООБЩЕ про иконки...

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

10 минут назад, Adm-RAL сказал:

сейчас просто лень иметь несколько инструментов, поэтому ФШ пыхтит абсолютно над любыми текстурными работами...

Аналогично кстати. ФШ CS6, и вообще нету ощущения что "мне чего-то не хватает".

4 минуты назад, Купер сказал:

и... при этом жуть до полной неиграбельности.

А это откуда? И, исходное разрешение иконки какое? вижу. 100 х 250. пикселей. Ну а чего ж вы хотели. Из дерьма пули не делают.

Хороший способ повысить визуальное качество текстур (любых. И иконок тоже) - повысить разрешение. Иконки оригинальной сетки х50 пикселов, на современных мониторах смотрятся ужасно. У себя сделал сетку х100 пикс. - пока всем нравится вроде... (Но иконки расползаются на три полотна...)

Изменено 21 Марта 2023 пользователем Zander_driver

[Купер 2 919]

@Zander_driver, да просто первый попавшийся на глаза "стандарт 50х50" из более-менее современных. Понятно, что увеличение "масштаба" даст большую детализацию, это очевидно.
Интересны прежде всего общие приёмы, которые используются знающими в процессе получения исходной "фактуры" для обработки, чтобы вот такое "счастье" не получать.

[Adm-RAL 2 306]

9 минут назад, Zander_driver сказал:

Хороший способ повысить визуальное качество текстур (любых. И иконок тоже) - повысить разрешение.

Ну, да, кстати... Я когда пересел на новую пекарню и игру в 4К, то качество иконок стало иметь большее значение. Ближе к концу - https://youtu.be/ZsmreEWezO8
Конкретно огромные иконки СЗ в 4К держатся! А так-как 8К войдёт в обиход ещё очень не скоро, то стоит увеличивать разрешение иконок в модах! В принципе ведь даже в чистом ТЧ можно задать большой масштаб по клеткам, так-что это актуально. А если-бы были где-нибудь ещё выложены иконки в хорошем качестве, то вообще б было хорошо!

[Zander_driver 10 334]

12 минут назад, Купер сказал:

Вот вроде как - да, соответствует игровой модели... и... при этом жуть до полной неиграбельности.

Скрытый текст

А так?)
(Кстати еще один удобный плюс ФШ - он позволяет делать к иконкам комментарии, не отображая их в альфа-канале. И в игре они будут не видны. В частности позволяет подписать стволы "ху из ху" - а то эт далеко не всегда очевидно)

Красивее в основном благодаря именно разрешению. Тут 550 х 150. Красота требует жертв, обойти это правило еще никому не удавалось)

3 минуты назад, Купер сказал:

Интересны прежде всего общие приёмы

Использовать возможный минимум трансформаций текстуры. Если у нас исходно большая текстура (фото / скриншот) - то все нужные трансформации желательно делать ДО масштабирования, с большой текстурой.
Масштабирование до размера конечной иконки должно быть самой последней операцией, после которой иконка неприкосновенна.

4 минуты назад, Adm-RAL сказал:

А если-бы были где-нибудь ещё выложены иконки в хорошем качестве

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

[Hrust 21]

2 часа назад, nasar75 сказал:

Да и пайт.нет для иконок не нужен - всё делается в фотошопе...

 

А вот статью о рендере стволов для иконок я бы почитал...

В общем-то, будет видеогайд, и по рендеру, и по добавлению НОВЫХ иконок. PaintDotNet применим как раз в данном случае.

 

@Adm-RAL @Zander_driver прошу прощения, в CS5/CS6 я попросту не смог найти информацию о выделении, пообщался со знающими людьми, те и показали эти фокусы. 

Изменено 21 Марта 2023 пользователем Hrust

[Adm-RAL 2 306]

1 час назад, Hrust сказал:

в CS5/CS6 я попросту не смог найти информацию о выделении

Там просто много релизных версий и во всех абсолютно разные настройки окон и инструментов. Я последний Фотошоп решил попробовать, и удалил почти сразу, потому-что нифига не понять с наскока. Да ещё эта современная псевдо-эргономика, тьфу-ты, спаси и сохрани!  
Поэтому и разговор о том, что привычки имеют большое значение! Главное хотя-бы какую-то версию хорошо изучить и можно работать в ней вечно с нормальными результатами.  

[Hrust 21]

@Adm-RAL @Zander_driver @nasar75 как выяснилось, на вкладке "инфо" нет возможности получения координат, только размеры выделения. Ролик прикрепил.
P.S. всё-таки можно узнавать позицию для иконки, но это костыль - выделяем область до начала нужной нам иконки. 

Изменено 21 Марта 2023 пользователем Hrust