Бесплатный сервис Shotcandy упаковывает сотни интерфейсных скриншотов за пару кликов

Свежий скриншот интерфейса падает на рабочий стол серым прямоугольником с пиксельной кашей, и дизайнер снова открывает Figma, чтобы вручную натянуть тень, скруглить углы и вставить картинку в макет устройства. Браузерный сервис Shotcandy срезает эту рутину до пары нажатий клавиш. Проект с открытым исходным кодом работает прямо на странице shotcandy.app и берет на себя оформление статической графики и экранных видеозаписей. Нас подкупило, что сервис не отправляет файлы на удаленные серверы: вся обработка происходит локально в браузере, а рабочий материал попадает в редактор простым перетаскиванием или через буфер обмена по Ctrl+V.

Инструмент ориентирован на создателей визуального контента, дизайнеров и разработчиков, которым нужно быстро готовить графику для социальных сетей, презентаций и карточек в магазинах мобильных приложений. Shotcandy принимает файлы в форматах PNG, JPEG и WebP для картинок, а также MP4, MOV и WebM для видеозаписей. Сервис полностью бесплатен и не требует регистрации.

Главный плюс архитектуры — скорость потоковой подготовки контента. Пакетный редактор позволяет загрузить и оформить до сотни скриншотов одновременно, избавляя от необходимости собирать однотипные слайды по отдельности. Для мобильных продуктов предусмотрен отдельный генератор витрин для App Store: он автоматически выстраивает серии от трех до десяти экранов с точными пропорциями и аккуратными отступами.

Инструментарий и функциональные модули

Сервис разделен на несколько прикладных направлений:

• Пакетный редактор скриншотов (Batch editor) для одновременной стилизации массивов графики.
• Конструктор макетов (Mockups) с интеграцией рамок реальных устройств.
• Оформление фрагментов программного кода (Code images) для технических постов и документации.
• Инструмент сокрытия данных (Redact), позволяющий быстро маскировать конфиденциальную информацию перед публикацией.
• Сборка наборов скриншотов для витрин App Store с раскладкой от 3 до 10 слайдов строго по требованиям магазина.

Визуальный арсенал платформы опирается на библиотеку из 42 готовых стилей оформления, каждый из которых можно перестроить под свою айдентику или собрать с нуля. Среди шаблонов каталога — Sherbet, Mint, Peek, Grape, Isometric Paper, Midnight, Spotlight, Strawberry и Satin, а для быстрых поисков авторы добавили кнопку случайного перебора вариантов Shuffle.

Настройка окружения и подложек позволяет уйти от скучной заливки. В качестве фона поддерживаются градиенты, градиентная сетка Gradient Mesh, сплошной тон и загрузка собственных пользовательских картинок. Поверх них выстраивается геометрия самого объекта:

• Отступы вокруг макета регулируются по фиксированной сетке размеров S, M, L и XL.
• Скругление углов доступно в двух режимах — мягком Soft и выраженном Round.
• Положение кадра настраивается через смещение, вылет за край (Bleed / Peek, Deep) и наложение внутренней рамки Inset plate.
• Для объемной подачи предусмотрены параметры плоского позиционирования и 3D-наклона (3D tilt & position flat).
• Система теней включает профили None, Soft, Float, Deep, Solid и Glow с регулировкой силы и интенсивности эффекта.
• Над каждым объектом можно разместить аккуратные текстовые заголовки.

Для реалистичной подачи интерфейсов Shotcandy предлагает каталог рамок реальных устройств. В систему зашиты оконные плашки в стилистике macOS с настройкой светлой или темной темы, редактируемыми заголовками и выбором цвета кнопок управления. Помимо настольной операционной системы доступны рамки интернет-браузеров, смартфонов, планшетов, ноутбуков, а также нейтральный режим холста.

Если статики мало, скриншот или видеозапись можно оживить. Блок анимации Motion превращает исходные кадры и ролики в презентационные клипы. Пользователю доступны восемь анимационных эффектов:

• Zoom in — плавное приближение интерфейса к зрителю.
• Float — мягкое парение элемента в пространстве.
• 3D sweep — пространственный разворот по оси.
• Focus — акцентное наведение резкости на рабочей зоне.
• Scroll — имитация прокрутки длинного экрана.
• Draw on — постепенная прорисовка контуров.
• Drift — медленное боковое скольжение.
• Flip in — эффект переворачивания карточки.

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

Пожалуй, именно так и должен выглядеть утилитарный инструмент для креаторов: открыл, вставил из буфера, забрал чистый макет и пошел дальше собирать релиз.