Скриншоты для инструкций «Установка и настройка»
Список скриншотов, которые нужно подготовить вместо видео-роликов на время, пока моушен-дизайнер собирает видео. Решение временное: чтобы выкатить инструкции в продакшен, динамические ролики заменяются статичными скриншотами.
Исходный список видео: https://gist.github.com/ivan-hilckov/f1eed175d2995228176f0dadba0ab14e
Для каждой строки нужен один файл:
<base>.png (или .webp) — скриншот.
Там, где видео показывало последовательность действий (меню → диалог → результат, ВКЛ → ВЫКЛ), шаг разбит на несколько скриншотов ключевых состояний.
В колонке «Путь к файлу» указан путь без расширения. Всего 54 скриншота.
#
Шаг
Описание
Путь к файлу
1
Шаг 1 — установка
Страница приложения «Happ» в App Store с кнопкой загрузки
src/assets/images/setup/iphone/step-1
2
Шаг 2 — добавление подписки (deeplink)
Диалог подтверждения добавления подписки в Happ
src/assets/images/setup/iphone/step-2-dialog
3
Шаг 2 — добавление подписки (deeplink)
Подписка появилась в списке Happ
src/assets/images/setup/iphone/step-2-added
4
Шаг 2 — добавление вручную
Экран Happ с полем ручной вставки ключа подписки
src/assets/images/setup/iphone/step-2-manual-paste
5
Шаг 2 — добавление вручную
Подписка добавлена в список
src/assets/images/setup/iphone/step-2-manual-added
6
Готово
Выбран сервер, VPN включён (круглая кнопка в состоянии ВКЛ)
src/assets/images/setup/iphone/step-3-on
7
Готово
VPN выключен (круглая кнопка в состоянии ВЫКЛ)
src/assets/images/setup/iphone/step-3-off
#
Шаг
Описание
Путь к файлу
1
Шаг 2 — вставка ключа
Happ на Android, вставка ключа подписки из буфера
src/assets/images/setup/android/step-paste
2
Шаг 2 — вставка ключа
Подписка добавлена в список
src/assets/images/setup/android/step-paste-added
#
Шаг
Описание
Путь к файлу
1
Шаг 2 — скачивание
Страница Happ в GitHub Releases с выделенным .exe файлом
src/assets/images/setup/windows/happ/step-download
2
Шаг 3 — вставка ключа
Окно Happ, кнопка «Из буфера»
src/assets/images/setup/windows/happ/step-paste
3
Шаг 3 — вставка ключа
Подписка появилась в списке
src/assets/images/setup/windows/happ/step-paste-added
4
Готово
Выбран сервер, VPN включён (круглая кнопка ВКЛ)
src/assets/images/setup/windows/happ/step-done-on
5
Готово
VPN выключен (круглая кнопка ВЫКЛ)
src/assets/images/setup/windows/happ/step-done-off
#
Шаг
Описание
Путь к файлу
1
Шаг 3 — добавление подписки
Меню «Сервер» → «Добавить профиль из буфера обмена»
src/assets/images/setup/windows/nekoray/step-paste-menu
2
Шаг 3 — добавление подписки
Диалог «Как подписку (создать новую группу)»
src/assets/images/setup/windows/nekoray/step-paste-dialog
3
Шаг 3 — добавление подписки
Группа vlv.one появилась в списке
src/assets/images/setup/windows/nekoray/step-paste-done
4
Шаг 4 — Режим TUN
Вкладка vlv.one с установленной галочкой «Режим TUN»
src/assets/images/setup/windows/nekoray/step-tun-check
5
Шаг 4 — Режим TUN
Диалог перезапуска
src/assets/images/setup/windows/nekoray/step-tun-restart
#
Шаг
Описание
Путь к файлу
1
Шаг 3 — запуск от админа
Контекстное меню v2RayTun.exe с пунктом «Свойства»
src/assets/images/setup/windows/v2raytun/step-admin-menu
2
Шаг 3 — запуск от админа
Вкладка «Совместимость», галочка «Запускать от имени администратора»
src/assets/images/setup/windows/v2raytun/step-admin-checkbox
3
Шаг 4 — добавление подписки
Меню «+» с пунктом «Добавить из буфера обмена»
src/assets/images/setup/windows/v2raytun/step-paste-menu
4
Шаг 4 — добавление подписки
Подписка добавлена в список
src/assets/images/setup/windows/v2raytun/step-paste-added
5
Шаг 5 — подключение
Выбрана конфигурация, круглая кнопка «Подключить»
src/assets/images/setup/windows/v2raytun/step-connect-ready
6
Шаг 5 — подключение
Состояние «подключено»
src/assets/images/setup/windows/v2raytun/step-connect-done
7
Готово
Активное подключение
src/assets/images/setup/windows/v2raytun/step-done
8
Готово
Настройки трафика, переключатель «Режим: Туннель» (опционально)
src/assets/images/setup/windows/v2raytun/step-done-tunnel
macOS — Happ (Apple Silicon)
#
Шаг
Описание
Путь к файлу
1
Шаг 3 — вставка ключа
Happ на macOS, вставка ключа из буфера
src/assets/images/setup/macos/happ/step-paste
2
Шаг 3 — вставка ключа
Подписка добавлена в список
src/assets/images/setup/macos/happ/step-paste-added
3
Готово
Выбран сервер, VPN включён (круглая кнопка ВКЛ)
src/assets/images/setup/macos/happ/step-done-on
4
Готово
VPN выключен (круглая кнопка ВЫКЛ)
src/assets/images/setup/macos/happ/step-done-off
#
Шаг
Описание
Путь к файлу
1
Шаг 3 — добавление подписки
Открытый V2Box, импорт подписки из буфера
src/assets/images/setup/macos/v2box/step-paste
2
Шаг 3 — добавление подписки
Подписка появилась в списке
src/assets/images/setup/macos/v2box/step-paste-added
3
Готово
Выбран сервер, VPN включён (круглая кнопка ВКЛ)
src/assets/images/setup/macos/v2box/step-done-on
4
Готово
VPN выключен (круглая кнопка ВЫКЛ)
src/assets/images/setup/macos/v2box/step-done-off
#
Шаг
Описание
Путь к файлу
1
Шаг 3 — добавление подписки
Меню «Сервер» → «Добавить профиль из буфера обмена»
src/assets/images/setup/linux/step-paste-menu
2
Шаг 3 — добавление подписки
Диалог «Как подписку (создать новую группу)»
src/assets/images/setup/linux/step-paste-dialog
3
Шаг 3 — добавление подписки
Группа vlv.one появилась в списке
src/assets/images/setup/linux/step-paste-done
4
Шаг 4 — Режим TUN
Вкладка vlv.one с установленной галочкой «Режим TUN»
src/assets/images/setup/linux/step-tun-check
5
Шаг 4 — Режим TUN
Диалог перезапуска
src/assets/images/setup/linux/step-tun-restart
6
Шаг 5 — подключение
ПКМ по конфигурации → пункт «Запустить»
src/assets/images/setup/linux/step-connect-menu
7
Шаг 5 — подключение
Состояние «подключено»
src/assets/images/setup/linux/step-connect-done
8
Готово
Активное подключение
src/assets/images/setup/linux/step-done
9
Готово
ПКМ по конфигурации → пункт «Остановить»
src/assets/images/setup/linux/step-done-stop
#
Шаг
Описание
Путь к файлу
1
Шаг 3 — QR-импорт
Экран Android TV с QR-кодом
src/assets/images/setup/androidtv/step-qr
2
Шаг 3 — QR-импорт
На TV прилетела подписка/серверы
src/assets/images/setup/androidtv/step-qr-done
3
Шаг 4 — Web Import
Экран tv.happ.su в браузере с заполненными UID и Data
src/assets/images/setup/androidtv/step-web-import
4
Шаг 4 — Web Import
На TV появились подписки/серверы
src/assets/images/setup/androidtv/step-web-import-done
#
Шаг
Описание
Путь к файлу
1
Шаг 4 — QR-импорт
Apple TV показывает QR-код
src/assets/images/setup/appletv/happ/step-qr
2
Шаг 4 — QR-импорт
На Apple TV пришли серверы
src/assets/images/setup/appletv/happ/step-qr-done
3
Шаг 5 — Web Import
Экран tv.happ.su в браузере с заполненными UID и Data
src/assets/images/setup/appletv/happ/step-web-import
4
Шаг 5 — Web Import
Данные пришли на Apple TV
src/assets/images/setup/appletv/happ/step-web-import-done
#
Шаг
Описание
Путь к файлу
1
Шаг 3 — добавление подписки
Shadowrocket: форма «+», Type: Subscribe, поле URL с ключом подписки
src/assets/images/setup/appletv/shadowrocket/step-paste-form
2
Шаг 3 — добавление подписки
Подписка добавлена в список
src/assets/images/setup/appletv/shadowrocket/step-paste-added
Формат : .png (или .webp), без потерь / с высоким качеством.
Соотношение сторон : исходное соотношение экрана устройства (телефон — портрет, ПК/TV — ландшафт).
Разрешение : 2× от плотности отображения (~720p для портрета, ~1080p для ландшафта). Минимум — нативное разрешение экрана/окна без апскейла.
Тема : только светлая (продукт сейчас в светлой теме).
Контент в кадре : реальный UI устройств, без персональных данных (тестовый аккаунт, тестовая подписка).
Чистый кадр : без курсора мыши (для ПК), без системных уведомлений, баннеров и посторонних окон.
Имя файла : совпадает с путём из колонки «Путь к файлу».
Один шаг видео = одна или несколько строк здесь. Где видео показывало flow, скриншоты разбиты на ключевые состояния:
Видео (1 ролик)
Скриншоты
iPhone · Шаг 1 — установка
1
iPhone · Шаг 2 — deeplink
2 (диалог + результат)
iPhone · Шаг 2 — вручную
2 (вставка + результат)
iPhone · Готово
2 (ВКЛ + ВЫКЛ)
Android · вставка ключа
2 (вставка + результат)
Windows · Happ · скачивание
1
Windows · Happ · вставка ключа
2 (буфер + результат)
Windows · Happ · Готово
2 (ВКЛ + ВЫКЛ)
Windows · NekoRay · подписка
3 (меню + диалог + результат)
Windows · NekoRay · Режим TUN
2 (галочка + перезапуск)
Windows · v2RayTun · от админа
2 (меню + галочка)
Windows · v2RayTun · подписка
2 (меню + результат)
Windows · v2RayTun · подключение
2 (готов + подключено)
Windows · v2RayTun · Готово
2 (подключение + туннель)
macOS · Happ · вставка ключа
2 (вставка + результат)
macOS · Happ · Готово
2 (ВКЛ + ВЫКЛ)
macOS · V2Box · подписка
2 (импорт + результат)
macOS · V2Box · Готово
2 (ВКЛ + ВЫКЛ)
Linux · NekoRay · подписка
3 (меню + диалог + результат)
Linux · NekoRay · Режим TUN
2 (галочка + перезапуск)
Linux · NekoRay · подключение
2 (меню + подключено)
Linux · NekoRay · Готово
2 (подключение + остановка)
Android TV · QR-импорт
2 (QR + результат)
Android TV · Web Import
2 (форма + результат)
Apple TV · Happ · QR-импорт
2 (QR + результат)
Apple TV · Happ · Web Import
2 (форма + результат)
Apple TV · Shadowrocket · подписка
2 (форма + результат)
Итого : 27 видео-роликов → 54 скриншота.