В данной статье будут собраны все мои предыдущие руководства.
Все проверялось на CS:GO, но должно работать и в других играх на движке source.

[1] Руководство по декалям/спрайтам

1.1 Здравствуйте, сегодня я научу вас создавать спрайты и их анимированные версии и проверять все в одиночной игре.
(Это понадобиться тем, кто хочет проверить свои "каракульки" прежде чем загружать их на сервер и по 100 раз переименовывать.)

Список программ, которые нам понадобятся для работы:
VTFEdit
(Для просмотра и создания текстур): VTFEdit

1) Создание изображения.
Для начала нам нужны сами изображения. Создавайте их через любой графический редактор или используйте уже готовые.
Для создания анимированного изображения берете видео или gif и делаете раскадровку (покадровое отображение видео файла).
Для раскадровки вы можете использовать данный сайт: Конвертер
Я конвертирую в jpg из-за меньшего веса (если используете прозрачный фон, то конвертируйте в png).

Посмотреть вложение 68641

Посмотреть вложение 68642

Посмотреть вложение 68643

2) Создание текстуры.

Запускаем VTFEdit. Жмем File; Import.
Выбираем одно изображение и жмем ОК, если используем статичную картинку.
Выделяем несколько изображений и жмем ОК, если нужно анимированное изображение.

Посмотреть вложение 68644

Далее в появившемся окне выбираем размер нашего изображения (мы можем выставить либо квадратное, либо прямоугольное изображение)
Смотрите по вашей исходной картинке что для вас лучше. Если вам не понравиться, всегда можно повторить предыдущие действия.
Так же советую выставлять большие параметры (это даст нам четкости). Потом можно будет уменьшить размер через VMT файл.

Посмотреть вложение 68650

Пример:

Изображение 256x128 "$decalscale" "1.0" Мыльное изображение

Посмотреть вложение 68651

Изображение 1024x512 "$decalscale" "0.25" Четкое изображение

Выставить галки:
No Mipmap
No Level of detail


Посмотреть вложение 68653

Жмем File; Save As... И выбираем место куда сохранить файл.

Посмотреть вложение 68654

Далее нам нужно создать VMT файл. Жмем Tools; Create VMT File. В появившемся окне жмем Create. Файл должен быть с таким же именем!

Посмотреть вложение 68655

Далее заходим в VMT файл для его редактирования.
В нем удаляем все строки и пишем:

Если у вас статичная картинка:

C++:
"LightMappedGeneric"
{
    "$baseTexture" "custom/2"
    "$translucent" "1"
    "$decal" "1"
    "$decalscale" "0.5"
}

"$baseTexture" "custom/название вашего файла без .vtf" -- Путь до вашего изображения (custom/2) без указания папки materials
"$decalscale" "0.5" -- Размер изображения 1.0 стандарт; 10.0 увеличенное в 10 раз; 0.1 уменьшенное в 10 раз.

Если у вас анимированная картинка:

C-подобный:
"LightMappedGeneric"
{
    "$baseTexture" "custom/2"
    "$translucent" "1"
    "$decal" "1"
    "$decalscale" "0.5"
    "Proxies"
    {
        "AnimatedTexture"
        {
            "animatedTextureVar" "$basetexture"
            "animatedTextureFrameNumVar" "$frame"
            "animatedTextureFrameRate" "10"
        }
    }
}

"animatedTextureFrameRate" "10" -- Кадры в "секунду" больше- быстрее; меньше- медленнее.

Дальше жмем File; Save. Закрываем. Вы всегда можете поменять название файлов и их путь. Главное не забывайте менять его в VMT файле.
Далее я перекидываю все (VTF; VMT) в созданную мной папку custom. А ее я кидаю по этому пути steamapps\common\Counter-Strike Global Offensive\csgo\materials

3) Осмотр изображений в одиночной игре.


Заходим на любую карту и целимся на стену (при вводе команд не передвигайте прицел).
В консоль пишем:

C++:
sv_cheats 1
ent_create infodecal
ent_teleport  infodecal
ent_fire infodecal addoutput "texture custom/2" 
ent_fire infodecal activate

Путь берем из VMT В моем случае это "$baseTexture" "custom/2" (Путь самого VMT относительно папки materials/)

Наслаждаемся вашими картинками.

P.S. Так же вы можете использовать анимации при создании скайбоксов, но нужно брать максимальное разрешение.

1.2 Проверка оверлеев в одиночной игре:

C++:
sv_cheats 1
give env_screenoverlay
ent_fire env_screenoverlay addoutput "overlayname1 decals/mememe"
ent_fire env_screenoverlay startoverlays
Путь берем из VMT В моем случае это "$baseTexture" "decals/mememe" (Путь самого VMT относительно папки materials/)

Посмотреть вложение 69135

Для смены оверлея:

C++:
ent_fire env_screenoverlay stopoverlays
ent_fire env_screenoverlay addoutput "overlayname1 decals/body"
ent_fire env_screenoverlay startoverlays

1.3 Создание переливающегося спрея (decals):

Список программ, которые нам понадобятся для работы:

VTFEdit
(Для просмотра и создания текстур): VTFEdit
VIDE (Для редактирования mipmap): VIDE

Создание декали:


1) Полностью повторяем 2 пункт из начала статьи.
(Эта картинка будет отображаться при отдалении)
Главное чтобы при создании стояла галка в пункте Mipmaps

Посмотреть вложение 74713


2) Запускаем VIDE
В панели меню выбираем Tools; VTF editor

Посмотреть вложение 74716

Откроется еще одно окно с заголовком VTF Editor. В нём выбираем File; Open и открываем файл текстуры, который мы создали на предыдущем этапе.
Должно появиться что-то такое.

Посмотреть вложение 74717

Теперь давайте заменим изображение при приближении к декали.
Для этого откроем самый большой размер (в моем случае это 512x256)
Я использую анимированную декаль. Поэтому у меня есть кадры.

Посмотреть вложение 74718

Жмем ПКМ; From file... на кадры поочередно и заменяем их на кадры другого изображения . Формат JPEG почему то программа не хочет открывать. Так что используйте PNG.
(В настройках ничего менять не нужно, просто жмем ОК)

Посмотреть вложение 74719


Я использую только два gif изображения. Вы можете сделать больше. Например третье gif вы вставляете в следующий формат 256x128 и тд.
Не забывайте соблюдать при этом пропорции при замене кадров!
Далее жмем File; Save.

Мой результат.


Посмотреть вложение 74720

[2] Руководство по моделям

2.1 Список программ, которые нам понадобятся для работы:
Paint.net
и плагин для создания VTF файлов (содержимое архива с плагином закинуть в папку paint.net\FileTypes): paint.net
CS:GO SDK (Нужен для просмотра готовой модели): Находиться в библиотеке Steam (инструменты).
VTFEdit (Для просмотра текстур): VTFEdit
Модель, которую я взял для примера (можно использовать модели игроков): Scarab Carabine 17

1) Нахождение нужной нам текстуры:

Для начала нам нужно найти сами текстуры.
Мой путь таков: D:\Steam\steamapps\common\Counter-Strike Global Offensive\csgo\materials\models\weapons\v_models\rif_scar17
Нам нужны файлы формата VTF
Открывать их нужно с помощью VTFEdit (В свойствах можно выбрать приложение через которое будут открываться данные файлы)

Посмотреть вложение 68211

Открыв данный файл сразу и не понять что здесь нарисовано...

Посмотреть вложение 68212

Так что идем в CS:GO SDK и сопоставляем нашу модель с ее разверткой (текстурой):

Посмотреть вложение 68213

Стало немного понятнее какой кусок текстуры за какую часть модели отвечает.

2) Изменение цвета всего скина:

Откроем нашу текстуру с помощью Paint.net
Выберем пункт Коррекция; Оттенок и насыщенность...
Редактируем цвет, какой мы хотим.

Посмотреть вложение 68216

Я решил взять синий:

Посмотреть вложение 68217

Жмем ОК и сохраняем.
Результат можно посмотреть в CS:GO SDK (не забудьте его перезапустить):

Посмотреть вложение 68218

3) Создание надписей и рисунков на текстуре:

Для нашей работы текстура будет слишком прозрачной, так что продублируем слои (дублируйте столько раз, пока вам не будет удобно работать):
ВАЖНО!!! Мы работаем только с 1 слоем. Не забудьте удалить добавленные слои после завершения редактирования!

Посмотреть вложение 68220

Ну думаю вы умеете рисовать и писать в пейнте,
Добавлять свои картинки тоже (путем перетаскивания на рабочую зону, Добавить слой).
ВАЖНО!!! Если добавляете картинки, то после редактирования объединяйте слои (Свой на котором вы рисуете или пишите и слои с картинками).
Вот что у меня получилось:

Посмотреть вложение 68223

Посмотреть вложение 68224

Результат:

Посмотреть вложение 68226

Посмотреть вложение 68227

Для выделения отдельной части для покраски используйте "Волшебную палочку"

До:______________________________________________________После:_________________________________________________

Посмотреть вложение 68306Посмотреть вложение 68310

Посмотреть вложение 68307Посмотреть вложение 68311

Посмотреть вложение 68308Посмотреть вложение 68309

До:_______________________________________________________После:____________________________________________________

Посмотреть вложение 68317Посмотреть вложение 68318


Посмотреть вложение 68320Посмотреть вложение 68319

Посмотреть вложение 68321Посмотреть вложение 68322

2.2 Изменение размера текстур:

Переходим во вкладку Изображение; Изменить размер...
Выставляем в Процентах!

Посмотреть вложение 68419

Посмотреть вложение 68420

Посмотреть вложение 68421

Было:

Посмотреть вложение 68422

Стало:

Посмотреть вложение 68423

До:_________________________________________________________После:_________________________________________________

Посмотреть вложение 68415Посмотреть вложение 68416

Посмотреть вложение 68417Посмотреть вложение 68418

2.3 Создание эффекта моргания глаз:

Находим текстуру глаза:

Посмотреть вложение 80296

Открываем ее с помощью Paint.net и сохраняем в png
Находим текстуру кожи, открываем в Paint.net

Посмотреть вложение 80297

Вырезаем кожу и накидываем постепенно на текстуру глаза (чем больше кадров вы сделаете, тем плавнее будет моргание)
Я использую 2 кадра:

Посмотреть вложение 80298 Посмотреть вложение 80299

А теперь расставим кадры по порядку (можете использовать другое кол-во кадров):

Посмотреть вложение 80300

Подберем подходящую скорость смены кадров (подбирайте значение под себя):
C++:
    "Proxies"
    {
        "AnimatedTexture"
        {
            "animatedTextureVar" "$basetexture"
            "animatedTextureFrameNumVar" "$frame"
            "animatedTextureFrameRate" "5"
        }
    }
Такие же эффекты можно применять и к моделям оружий.

Посмотреть вложение 80304

2.4 Изменение яркости:

Выбираем нужную нам текстуру:

Посмотреть вложение 80301

Открываем ее с помощью Paint.net и сохраняем в png
Выберем пункт Коррекция; Оттенок и насыщенность...
Изменяем насыщенность на 5 делений (можете использовать другое значение) и сохраняем несколько изображений. (чем больше кадров вы сделаете, тем будет плавнее)
Расставляем кадры по порядку (можете использовать другое кол-во кадров):

Посмотреть вложение 80302

Подберем подходящую скорость смены кадров (подбирайте значение под себя):
C++:
    "Proxies"
    {
        "AnimatedTexture"
        {
            "animatedTextureVar" "$basetexture"
            "animatedTextureFrameNumVar" "$frame"
            "animatedTextureFrameRate" "10"
        }
    }
Такие же эффекты можно применять и к моделям оружий.

2.5 Смены цвета с расстоянием:

Открываем кадры в Paint.net
Выберем пункт Коррекция; Оттенок и насыщенность...
Изменяем оттенок всех кадров на одинаковое значение и сохраняем в png (можете использовать другое кол-во кадров):

Посмотреть вложение 80303

Подберем подходящую скорость смены кадров (подбирайте значение под себя):
C++:
    "Proxies"
    {
        "AnimatedTexture"
        {
            "animatedTextureVar" "$basetexture"
            "animatedTextureFrameNumVar" "$frame"
            "animatedTextureFrameRate" "10"
        }
    }
Такие же эффекты можно применять и к моделям оружий.

Посмотреть вложение 80305

2.6 Создание текстуры из скайбокса.
Можно накладывать текстуры Skybox'a на любые модели: оружие, скины игроков и т.д.
Список программ, которые нам понадобятся для работы:
VTFEdit
(Для просмотра и создания текстур): VTFEdit
Paint.net и плагин для создания VTF файлов (содержимое архива с плагином закинуть в папку paint.net\FileTypes): paint.net
Готовый скайбокс
(6 vtf текстур)

1) Объединение 6 VTF файлов в один:

Названия заканчиваются на: bk; dn; ft; lf; rt; up.

Открываем их в Paint.net и сохраняем в формате PNG.
Далее меняем у них название и разворачиваем на определенный угол (это можно сделать сразу в Paint.net):
bk=2 90°
dn=6 180°
ft=1 -90°
lf=3 180°
rt=4
up=5


Открываем VTFEdit
Жмем File; Import.
Выбираем наши шесть PNG картинок.
В настройках выставляем так как на скриншоте.

Посмотреть вложение 83760

В Advenced выбираем версию 7.5
Как только загрузится выставляем 3 галки в поле для Флагов


Посмотреть вложение 83761

После жмем File; Save As... И выбираем место куда сохранить файл (Ваше название).

2) Создание цвета, который будет поверх нашей текстуры скайбокса:

Создаете квадрат размером с вашу текстуру в любом редакторе и заливаете его любым цветом
(Представьте что вы смотрите на объект через цветное стекло. Каким цветом будет квадрат, таким оттенком будет ваша текстура.
Советую делать белого= будет прозрачный цвет).
Делаете из него VTF файл. (для примера назовем white)

3) Наложение текстуры:

Выбираем нужную нам модель и смотрим какие у нее есть текстуры (VTF файлы).
Перекидываем туда вашу VTF текстуру skybox'а и VTF white.
Находим текстуру, которую хотим заменить на skybox.
VTF файл можно удалить, нам нужен только VMT. (Название VMT файла менять нельзя как и его расположение!)
Открываем его и пишем:
C++:
unlittwotexture
{
    "$moondome"   "1"
    "$basetexture" "models\weapons\папки до текстур вашей модели\white"
    "$basetexturetransform" "center .5 .5 scale 0.1 0.1 rotate 0 translate 0 0"
    "$cubeparallax" "0.00005"
    "$texture2"    "models\weapons\папки до текстур вашей модели\ваше название VTF skybox'а"
}

Поздравляю! Вы сделали модель с текстурой скайбокса!

Посмотреть вложение 83769

Если что то не понятно, то можете скачать мою модель и на ее примере понять как все устроено: CS:GO - Chakram V2 By Neru

Пример на волосах модели:

Посмотреть вложение 110361
  • Мне нравится
Реакции: Palonez, Kult и xidi