05.03.2010 20:20
[Туториалы (Tutorials)]
Туториал - Иконка в меню
Почему используются плоские иконки, а не настоящие 3D модели?
В таком безграничном инвентаре, который можно видеть в Ризен, в конце концов, сталкиваешься с ограничениями наглядности. Так как в ходе игры в инвентаре набирается до сотни объектов, важно, чтобы эти предметы были легко узнаваемы и все в целом выглядели нагляднее.
Так как преимущественно в РПГ бывает много предметов в одинаковой категории (например, оружие подразделяется на луки и мечи ), они должны соответственно отличаться друг от друга. При уменьшенном изображении в 3D при котором виден весь объект, очень часто происходит путаница, так как один лук очень похож на другой.
Поэтому мы решили изображать предметы в виде 2D значков-иконок и сфокусироваться на типичных признаках. Это может быть уникальная рукоятка меча или различные цвета зелий. Дополнительно у значков в отдельных категориях предметов должен быть фон определенного цвета. Например, инструменты изображены на сером фоне, а растения — на зеленом.
Создание значка, который размером всего 40х40 пикселей, разумеется, сопряжено с некоторыми проблемами. Слишком мало места, чтобы наглядно показать всю важную информацию. И если нужный значок не обладает действительно бросающимися в глаза признаками, нужно по крайней мере убедиться, что его легко распознать по его форме и цвету.
Время, которое необходимо для создания определенных значков, может сильно варьироваться. Так я например потратил на простую иконку метлы в Ризен почти столько же времени, как на всю категорию колец. Но особенно сложно бывает с довольно абстрактными значками. Как, например, изобразить заклинание «Шутка»?
В основном в Ризен используются два способа работы над значками.
Объекты, которые уже существуют как 3D модели, рендерятся с простым освещением. К этой группе относятся, прежде всего, оружие и броня. Другие значки, напротив, рисуются вручную. Возьмем, к примеру, значок малого целебного зелья: на нем хорошо демонстрируется первый способ.
1. Сперва нужно обдумать основные формы сосуда с зельем. Как можно видеть на рис 1., они сильно отличаются уже в самом начале, и к тому же отрендерены под разными углами. Но, прежде всего, следует обратить внимание на то, чтобы в модели не было слишком много деталей, так как по причине малых размеров конечного изображения эти детали в любом случае будут утеряны.
2. Картинка масштабируется до желаемого размера значка. Все, что выходит за поля, впоследствии отсекается.
3. Так как в Ризен у нас есть зелья разных цветов и форм, можно немного упростить себе работу и соответственно перекрасить сосуды. Это происходит в 2D редакторе, путем изменения баланса цвета. Так как пробка цвет не меняет, ее предварительно вырезают.
4. И вот вы видите раскрашенный значок с присоединенной пробкой.
Чтобы объемно выделить детали и элементы на фоне, рекомендуется добавить различные слои тени.
5. Чтобы изобразить отражения на стекле и одновременно еще сильнее выделить символ на фоне, добавляются слои бликов. Кроме того на рисунке видно, как затем подрисовывается светлая окантовка.
6. Теперь идут дальнейшие детали, такие как дополнительные блики, чтобы стекло выглядело еще более объемным. Вместе с этим мы достигаем эффекта, при котором иконка немного «светится». Наконец добавляем несколько пузырьков, чтобы подчеркнуть, что речь идет о (бурлящей ) жидкости.
7. Теперь значок обрезается и снабжается рамкой. Готово.
Другие примеры:
8. Ром.
В принципе это тоже «бутылка», но тут нужны дополнительные детали. Например, ее можно распознать по этикетке. На ней видна крошечная пальма. В идеале эта маленькая деталь связана с формой и цветом бутылки и позволяет ее легко отыскать в инвентаре.
9. Подкрадывание.
Это пример «абстрактного» значка. Первое что приходит на ум - показать изображение крадущихся ног. Но так как этот символ было запланировано использовать для способности «Спринт», я решил изобразить «прислушивающуюся\сидящую в засаде фигуру». Эту фигуру, как и сосуд для зелья, я сперва очень грубо смоделировал и затем отрендерил. В результате получилась уникальная иконка, которую можно всегда приписать способности.
10. Варить зелья.
Наконец еще один пример трудоемкой иконки, которая состоит из достаточно большого количества слоев.
Надеюсь, этот маленький туториал(Making-Of) был интересен и понравился вам.
С наилучшими пожеланиями, Андре Тиль.
В таком безграничном инвентаре, который можно видеть в Ризен, в конце концов, сталкиваешься с ограничениями наглядности. Так как в ходе игры в инвентаре набирается до сотни объектов, важно, чтобы эти предметы были легко узнаваемы и все в целом выглядели нагляднее.
Так как преимущественно в РПГ бывает много предметов в одинаковой категории (например, оружие подразделяется на луки и мечи ), они должны соответственно отличаться друг от друга. При уменьшенном изображении в 3D при котором виден весь объект, очень часто происходит путаница, так как один лук очень похож на другой.
Поэтому мы решили изображать предметы в виде 2D значков-иконок и сфокусироваться на типичных признаках. Это может быть уникальная рукоятка меча или различные цвета зелий. Дополнительно у значков в отдельных категориях предметов должен быть фон определенного цвета. Например, инструменты изображены на сером фоне, а растения — на зеленом.
Создание значка, который размером всего 40х40 пикселей, разумеется, сопряжено с некоторыми проблемами. Слишком мало места, чтобы наглядно показать всю важную информацию. И если нужный значок не обладает действительно бросающимися в глаза признаками, нужно по крайней мере убедиться, что его легко распознать по его форме и цвету.
Время, которое необходимо для создания определенных значков, может сильно варьироваться. Так я например потратил на простую иконку метлы в Ризен почти столько же времени, как на всю категорию колец. Но особенно сложно бывает с довольно абстрактными значками. Как, например, изобразить заклинание «Шутка»?
В основном в Ризен используются два способа работы над значками.
Объекты, которые уже существуют как 3D модели, рендерятся с простым освещением. К этой группе относятся, прежде всего, оружие и броня. Другие значки, напротив, рисуются вручную. Возьмем, к примеру, значок малого целебного зелья: на нем хорошо демонстрируется первый способ.
1. Сперва нужно обдумать основные формы сосуда с зельем. Как можно видеть на рис 1., они сильно отличаются уже в самом начале, и к тому же отрендерены под разными углами. Но, прежде всего, следует обратить внимание на то, чтобы в модели не было слишком много деталей, так как по причине малых размеров конечного изображения эти детали в любом случае будут утеряны.
2. Картинка масштабируется до желаемого размера значка. Все, что выходит за поля, впоследствии отсекается.
3. Так как в Ризен у нас есть зелья разных цветов и форм, можно немного упростить себе работу и соответственно перекрасить сосуды. Это происходит в 2D редакторе, путем изменения баланса цвета. Так как пробка цвет не меняет, ее предварительно вырезают.
4. И вот вы видите раскрашенный значок с присоединенной пробкой.
Чтобы объемно выделить детали и элементы на фоне, рекомендуется добавить различные слои тени.
5. Чтобы изобразить отражения на стекле и одновременно еще сильнее выделить символ на фоне, добавляются слои бликов. Кроме того на рисунке видно, как затем подрисовывается светлая окантовка.
6. Теперь идут дальнейшие детали, такие как дополнительные блики, чтобы стекло выглядело еще более объемным. Вместе с этим мы достигаем эффекта, при котором иконка немного «светится». Наконец добавляем несколько пузырьков, чтобы подчеркнуть, что речь идет о (бурлящей ) жидкости.
7. Теперь значок обрезается и снабжается рамкой. Готово.
Другие примеры:
8. Ром.
В принципе это тоже «бутылка», но тут нужны дополнительные детали. Например, ее можно распознать по этикетке. На ней видна крошечная пальма. В идеале эта маленькая деталь связана с формой и цветом бутылки и позволяет ее легко отыскать в инвентаре.
9. Подкрадывание.
Это пример «абстрактного» значка. Первое что приходит на ум - показать изображение крадущихся ног. Но так как этот символ было запланировано использовать для способности «Спринт», я решил изобразить «прислушивающуюся\сидящую в засаде фигуру». Эту фигуру, как и сосуд для зелья, я сперва очень грубо смоделировал и затем отрендерил. В результате получилась уникальная иконка, которую можно всегда приписать способности.
10. Варить зелья.
Наконец еще один пример трудоемкой иконки, которая состоит из достаточно большого количества слоев.
Надеюсь, этот маленький туториал(Making-Of) был интересен и понравился вам.
С наилучшими пожеланиями, Андре Тиль.
