Автор Тема: Shader Forge - Новое слово в конструировании шейдеров!  (Прочитано 8551 раз)

0 Пользователей и 1 Гость просматривают эту тему.

Март 29, 2014, 19:09:56 pm
Прочитано 8551 раз

Mimi Neko

  • Администратор
  • Старожил форума

  • Оффлайн
  • *****

  • 2454
  • Репутация:
    153
    • Просмотр профиля
Недавно появился замечательный встраиваемый в Юнити, визуальный редактор шейдеров - Shader Forge
Редактор этот пока ещё практически не распространён, как не удивительно, и по нему очень мало описаний и информации.

http://forum.unity3d.com/threads/191595-Shader-Forge-A-visual-node-based-shader-editor
http://acegikmo.com/shaderforge
http://www.polycount.com/forum/showthread.php?t=123439

Демонстирируемые эффекты на его шейдерах, впечатляют:







 

   
« Последнее редактирование: Март 29, 2014, 20:03:39 pm от Mimi Neko »

Март 29, 2014, 19:17:36 pm
Ответ #1

Mimi Neko

  • Администратор
  • Старожил форума

  • Оффлайн
  • *****

  • 2454
  • Репутация:
    153
    • Просмотр профиля
Сегодня я его проверил - хм, действительно работает!
Причём, в отличии от своих предшественников, этот редактор не глючит и не тормозит,
и к тому же, весьма прост в использовании, и к тому же, создаёт шейдеры в виде исходников, которые потом можно изучать и дорабатывать вручную! (что весьма полезно)

Вот некоторые видеоуроки по этому редактору:
<a href="http://www.youtube.com/watch?v=x72znBFLsZs" target="_blank">http://www.youtube.com/watch?v=x72znBFLsZs</a>

<a href="http://www.youtube.com/watch?v=2ZNJ_KytrE4" target="_blank">http://www.youtube.com/watch?v=2ZNJ_KytrE4</a>

<a href="http://www.youtube.com/watch?v=EjCXwV0YYdU" target="_blank">http://www.youtube.com/watch?v=EjCXwV0YYdU</a>

<a href="http://www.youtube.com/watch?v=3tHI2J9_c9k" target="_blank">http://www.youtube.com/watch?v=3tHI2J9_c9k</a>

<a href="http://www.youtube.com/watch?v=QtUb53jboAI" target="_blank">http://www.youtube.com/watch?v=QtUb53jboAI</a>

 - Вот собственно и все туториалы, на данный момент. Не густо конечно, но разбираться самим с ним стоит!
Сегодня малость повозившись, сделал в нём эффекты, который никак не мог осилить в написании через код, и нигде не мог найти ничего рпо их написание, или сами такие шейдеры.
« Последнее редактирование: Март 29, 2014, 19:55:53 pm от Mimi Neko »

Март 29, 2014, 20:06:40 pm
Ответ #2

Mimi Neko

  • Администратор
  • Старожил форума

  • Оффлайн
  • *****

  • 2454
  • Репутация:
    153
    • Просмотр профиля

Тут ещё есть видеомануал о первых шагах в Shader Forge:

http://www.twitch.tv/rogdolos/c/3536891

Март 30, 2014, 13:19:37 pm
Ответ #3

LiGuB

  • Пользователь

  • Оффлайн
  • **

  • 61
  • Репутация:
    5
    • Просмотр профиля
80$ на асетсторе ) не хило! но думаю стоит того

Март 30, 2014, 13:27:55 pm
Ответ #4

Mimi Neko

  • Администратор
  • Старожил форума

  • Оффлайн
  • *****

  • 2454
  • Репутация:
    153
    • Просмотр профиля
80$ на асетсторе ) не хило! но думаю стоит того
Конечно стоит! Для коммерческих проектов, это вообще копейки, подарок практически.
Ну для пробы, можно и бесплатно найти.

Апрель 07, 2014, 17:00:28 pm
Ответ #5

Alcatraz

  • Администратор
  • Старожил форума

  • Оффлайн
  • *****

  • 1851
  • Репутация:
    123
    • Просмотр профиля
    • Flight Dream Studio
Да, отличная вещь. Я вот жду 5.0 с PBS, на стори уже есть пару паков за 120-150 $, дорого, однако.  :)

Июль 15, 2014, 06:48:30 am
Ответ #6

Mimi Neko

  • Администратор
  • Старожил форума

  • Оффлайн
  • *****

  • 2454
  • Репутация:
    153
    • Просмотр профиля
Урок по созданию шейдера персонажа:
<a href="http://www.youtube.com/watch?v=kSfHFApl6PI" target="_blank">http://www.youtube.com/watch?v=kSfHFApl6PI</a>

Декабрь 04, 2014, 17:19:55 pm
Ответ #7

Mimi Neko

  • Администратор
  • Старожил форума

  • Оффлайн
  • *****

  • 2454
  • Репутация:
    153
    • Просмотр профиля
Shader Forge. Продвинутые шейдеры. (перепечатка статьи)

Всем доброго времени суток. Основа по использованию шейдеров и материалов у нас уже есть. Осталось только научиться делать более умные шейдеры со всякими плюшками. В Asset Store сейчас есть немало редакторов для этих целей. Например, Strumpy Shader Editor. Им не пользовался, но видел примерную структуру – логика там немного непонятна с первого взора. Но по нему в интернете уже достаточно уроков, так что мы попытаем счастье в Shader Forge.

<a href="http://www.youtube.com/watch?v=U9aRn0BE-co" target="_blank">http://www.youtube.com/watch?v=U9aRn0BE-co</a>

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

Итак, после импорта Shader Forge (файл с расширением .unitypackage, можно просто открыть как документ, unity импортирует его в активный проект). Затем через окно Window откроем Shader Forge. Две большие кнопки предложат создать новый шейдер или редактировать старый, но редактировать, конечно же, тот, что сделан в Shader Forge. Создаем новый шейдер и вот, что мы видим:



Слева вверху у нас превью. Заветная кнопка Compile Shader компилирует шейдер, а галочка Auto компилирует его вне зависимости от нашего желания при каждой поправке узлов (aka нод). Вырубим эту галочку, она добавляет много дискомфорта, т.к. при сборке шейдера компьютер чуток залипает.

Немного ниже ряд свойств, вот кое-что оттуда:

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

В Blending -> Face Culling включение Double Sided создает двухсторонний материал, т.е. избегает проблемы с единственным направлением нормалей.

Остальные свойства потом рассмотрим, а то будет слишком много теории.

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

Ну и справа все существующие узлы. Самый важный список – Properties – свойства, которые мы сможем менять из материалов:

Color – цвет. Просто цвет. Он как Бонд. Джеймс Бонд.

Cubemap – уже известная текстура, как правило нужная для отражений, но оригинальность нашего ума неистребима.

Slider – слайдер или ползунок, можно установить значения от min до max.

Texture2D – текстура.

Texture Asset – тоже текстура, используется для того, чтобы создать один узел с текстурой, а затем ее отправлять в разные Texture2D через вход Tex.

Value – числовое значение.

Vector4 – то, что вы пока не будете использовать. Вектор, хранит информацию о векторе (направление + скаляр). Эстеты могут в нем хранить значение цвета (RGBA)

Декабрь 04, 2014, 17:23:28 pm
Ответ #8

Mimi Neko

  • Администратор
  • Старожил форума

  • Оффлайн
  • *****

  • 2454
  • Репутация:
    153
    • Просмотр профиля


[Под конец статьи вспомнил, что не объяснил, какие кнопочки нажимать. ЛКМ – линии рисовать, перемещать ноды. Alt+ЛКМ выделение прямоугольником. Alt+ПКМ – разрыв связи (нажать прямо у основания линии).]

Обращаю ваше внимание на имена нод, их можно изменять как для структурирования узлов, так и для использования имени _PropName в скриптах. Например, методе SetTexture().

Так, все очень скучно, нужно что-нибудь уже сделать.

Поработаем над Color. У него нет входов, только выходы: RGB – цвет, по сути; или отдельно каждый канал.

В графике, как вам известно, из трех цветов можно получить миллионы других путем их смешивания в определенных пропорциях. При этом пропорции есть отношения частей каждого цвета в общей группе RGB, таких частей может быть от 0 до 255. В Color Picker вы можете увидеть эти величины + еще и Alpha канал (в данном свойстве он несет лишь информационный смысл для других узлов). Внизу этого узла каждая составляющая представлена числом от 0 до 1. Оно может быть и больше, но при компиляции урезается в 1.

Соединив RGB цвета или текстуры с Diffuse, получите “хоть что-то”, но так не интересно. Давайте сделаем отражающий материал, но вот беда: Cubemap-то есть, а вот куда бы его приспособить – никто не в курсе.

[Лирическое отступление. Опять]

Работали в PS? Там есть режимы наложения – своеобразное смешение цветов. Вероятно, в Unity это работает иначе, но схема такая:

1. У нас есть цвет.

2. У цвета есть 3 канала R, G, B.

3. Каждый принимает значение 0..1.

4. Если сложить два цвета, то значения их каналов складываются соответственно.

Возьмем например 2 ноды с цветом (0.5, 0.5, 0.5, 1). При сложении получим (1,1,1,1). Брависсимо!


Кстати говоря, этот нод находится во вкладке Ariphmetic, а хот-кей A+ЛКМ. Принимает 2+ параметров, выдает один, ну и превьюшку.

Аналогично с умножением (хот-кей M+ЛКМ), делением (D), вычитанием (S).


А теперь смешаем диффузный цвет и Cubemap с помощью Add (практика поможет вам понимать, где нужно умножать, а где складывать).


Декабрь 04, 2014, 17:24:12 pm
Ответ #9

Mimi Neko

  • Администратор
  • Старожил форума

  • Оффлайн
  • *****

  • 2454
  • Репутация:
    153
    • Просмотр профиля

Но вот беда: хотелось бы погасить отражение, у нас же может быть не абсолютное зеркало. Вот тут в ход вступает Multiply. Ведь если мы умножим все на черный цвет (0,0,0,1), то получим (0,0,0,x)!, то есть RGB канал прекратит свое влияние.  Действуем:


Декабрь 04, 2014, 17:32:32 pm
Ответ #10

Mimi Neko

  • Администратор
  • Старожил форума

  • Оффлайн
  • *****

  • 2454
  • Репутация:
    153
    • Просмотр профиля

Конечно, мы можем перемножать не только что-то цветное, а, например число и цвет, числа, как ни странно.

Хот-кей 1+ЛКМ создает Value (число, только оно не является свойством, а используется непосредственно внутри шейдера).


Ну и напоследок сделаем что-нибудь крутое. Предлагаю мигающий объект. Все дружно прикинули, как это реализовать. Тяжело будет лишь тем, кто не учил никогда матан или еще не дошел до синуса и косинуса. Итак, да, используем закон синуса (можно косинуса). Alpha принимает значения от 0 до 1, синус выдает от -1 до 1. Проблема раз. Проблема 2: синус высчитывается от какого-то аргумента, изменяющегося при этом. Второй диссонанс нашего прекрасного мира решается просто:  на вкладке External Data есть нод Time – получает системное время. Как поместить синусоиду между 0 и 1? Ее область значений занимает 2 единицы, а нужна 1 – значит умножаем функцию на 0,5. Тогда синус лежит в пределах от -0,5 до 0,5. Не беда, поднимем его на 0,5 вверх. Получили простейшее чудо математики ;)  {Если хотите, то запишу видео типа “Матан для геймдева”. Но учтите, что пока могу вам поведать лишь продвинутый школьный курс, зато будет интересно.}

Потом еще поделим значение аргумента, чтобы мигало пореже.

Вот так выглядит наша функция на листе:


А вот реализация:


Осталось лишь создать материал и применить к нему шейдер. Путь к шейдеру (тот, что выбираете в списке у материала) прописывается в меню Shader Settings прямо под превью.

Про текстуры лень еще текст писать, но принцип тот же.

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

До встречи!

Источник

А также много интересных материалов по теме шейдеров и Юнити: Уроки по компьютерной графике и созданию игр


Февраль 01, 2015, 13:55:58 pm
Ответ #11

SERG__ZV

  • Пользователь

  • Оффлайн
  • **

  • 49
  • Репутация:
    0
    • Просмотр профиля