yt-shortmaker

Формат JSON шаблонов (Plano) для YT ShortMaker

“Planos” - это JSON-файлы, определяющие визуальную структуру ваших Shorts. Они позволяют размещать оригинальное видео, добавлять наложения, эффекты и анимированные фоны.

Базовая структура

Шаблон представляет собой массив (список) объектов. Порядок важен: первые объекты отрисовываются на заднем плане, последние - на переднем (слои).

[
  { "type": "shader", ... }, // Фон (Слой 0)
  { "type": "clip", ... },   // Середина (Слой 1)
  { "type": "image", ... }   // Передний план (Слой 2)
]

Общие свойства: Позиция и Размер

Почти все объекты имеют свойство position с полями x, y, width и height.

Значения могут быть:

• Целые числа: Точные пиксели (например: 1080, 1920).
• Ключевые слова:
  • "center" (для x или y): Центрирует объект.
  • "full" (для width или height): Заполняет все доступное пространство (1080x1920).
  • Проценты: Строки, заканчивающиеся на % (например: "50%").

"position": {
  "x": "center",
  "y": 0,
  "width": "100%",
  "height": "50%"
}

Типы объектов

1. Клип (clip)

Представляет исходное видео, которое вы обрабатываете. Можно использовать несколько раз.

• type: “clip”
• position: (Необязательно) Позиция видео. По умолчанию: full.
• crop: (Необязательно) Обрезка исходного видео.
  • Определяет окно обрезки в пикселях на исходном видео.
  • x_from: Начальный пиксель слева (например, 0).
  • x_to: Конечный пиксель справа (например, 1920). Если больше x_from, обрезает ширину.
  • y_from: Начальный пиксель сверху (например, 0).
  • y_to: Конечный пиксель снизу (например, 1080). Если больше y_from, обрезает высоту.
  • Обрезка применяется до масштабирования или позиционирования.
  • Пример: Чтобы обрезать видео 1920x1080 до центрального квадрата 1080x1080:

    "crop": {
      "x_from": 420,  // (1920 - 1080) / 2 = 420
      "x_to": 1500    // 420 + 1080 = 1500
    }
    

• fit: (Необязательно) Режим подгонки. Значения: "stretch" (по умолчанию, растягивание), "cover" (обрезка), "contain" (черные полосы).
• comment: (Необязательно) Заметка для пользователя.

2. Изображение (image)

Накладывает статичное изображение (png, jpg). Идеально для рамок, логотипов или водяных знаков.

• type: “image”
• path: Путь к файлу изображения (абсолютный или относительный к json).
• position: Позиция и размер.
• opacity: Прозрачность от 0.0 до 1.0 (По умолчанию: 1.0).

3. Видео (video)

Фоновое или наложенное видео (например, геймплей на фоне, эффекты частиц).

• type: “video”
• path: Путь к файлу видео.
• position: Позиция и размер.
• loop_video (необязательно, bool): Если true, видео зацикливается. По умолчанию true.
• keep_last_frame (необязательно, bool): Если loop_video равно false, последний кадр замораживается до конца. По умолчанию false.
• opacity (необязательно, float): Прозрачность видео (0.0 до 1.0). По умолчанию 1.0.
• fit: (Необязательно) Режим подгонки. Значения: "stretch" (по умолчанию), "cover", "contain".

4. Шейдер (shader)

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

• type: “shader”
• effect: Объект конфигурации эффекта.
  • type: “blur”
  • intensity: Интенсивность размытия (например: 20).
• position: Область применения эффекта.

Полный пример

[
  // 1. Размытый фон (Растянутое исходное видео + Размытие)
  {
    "type": "clip",
    "position": { "x": 0, "y": 0, "width": "full", "height": "full" },
    "comment": "Базовый размытый фон"
  },
  {
    "type": "shader",
    "effect": { "type": "blur", "intensity": 30 },
    "position": { "x": 0, "y": 0, "width": "full", "height": "full" }
  },

  // 2. Основное видео по центру
  {
    "type": "clip",
    "position": { "x": "center", "y": "center", "width": "100%", "height": "auto" }
  },

  // 3. Водяной знак
  {
    "type": "image",
    "path": "./logo.png",
    "position": { "x": "center", "y": 1700, "width": 200, "height": "auto" },
    "opacity": 0.8
  }
]

Частые случаи использования и примеры

Вот несколько практических примеров. Скопируйте и вставьте JSON-код в ваш файл шаблона .json.

1. Простой размытый фон (По умолчанию)

Оригинальное видео используется в качестве фона (растянутое и размытое), а также как основной элемент по центру.

[
  {
    "type": "clip",
    "position": {
      "width": "full",
      "height": "full"
    },
    "fit": "stretch",
    "comment": "Растянутый фон"
  },
  {
    "type": "shader",
    "effect": {
      "type": "blur",
      "intensity": 20
    },
    "position": {
      "width": "full",
      "height": "full"
    }
  },
  {
    "type": "clip",
    "position": {
      "x": "center",
      "y": "center",
      "width": "100%",
      "height": "40%"
    },
    "comment": "Основное видео"
  }
]

2. Геймплей на фоне (Внешнее видео)

Видео с “геймплеем” (например, Minecraft, GTA) зациклено на фоне, а оригинальное видео по центру.

[
  {
    "type": "video",
    "path": "./media/gameplay_background.mp4",
    "position": { "width": "full", "height": "full" },
    "loop_video": true,
    "fit": "stretch",
    "opacity": 1.0,
    "comment": "Зацикленное фоновое видео"
  },
  {
    "type": "clip",
    "position": { "x": "center", "y": "center", "width": "100%", "height": "auto" },
    "comment": "Основной клип поверх геймплея"
  }
]

3. Разделенный экран (Split Screen)

Два видео, расположенных вертикально друг над другом. Полезно для сравнений или видео-реакций. (Здесь мы используем один и тот же клип дважды, но вы можете использовать video для второго).

[
  {
    "type": "clip",
    "position": {
      "x": 0,
      "y": 0,
      "height": "50%"
    },
    "crop": {
      "x_from": 420,
      "x_to": 1500
    },
    "comment": "Верхняя часть"
  },
  {
    "type": "clip",
    "position": {
      "x": 0,
      "y": "50%",
      "width": "100%",
      "height": "50%"
    },
    "crop": {
      "x_from": 1300,
      "x_to": 1920,
      "y_from": 500,
      "y_to": 1080
    },
    "comment": "Нижняя часть"
  }
]

4. Рамка / Наложение (Overlay)

Видео с наложенным прозрачным PNG-изображением (рамка, статистика, брендинг).

[
  {
    "type": "clip",
    "position": { "width": "full", "height": "full" },
    "fit": "cover"
  },
  {
    "type": "image",
    "path": "./media/frame_overlay.png",
    "position": { "x": 0, "y": 0, "width": "full", "height": "full" },
    "opacity": 1.0,
    "comment": "PNG изображение с прозрачностью"
  }
]

This site is open source. Improve this page.