2024личный проект

На главную

Screen Translator

Фоновое приложение для macOS: нажал сочетание клавиш, увидел перевод на том месте, где стоит слово, не переключая окна.

  • Electron
  • FastAPI
  • Tesseract
  • Argos
  • SQLite

Задачазачем это вообще

Почему я за это взялся

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

Архитектура4 слоя, сверху вниз

Как устроено

Клиент

  • Electron в menu bar
  • глобальный хоткей

снимок экрана

Overlay

  • React
  • кликабельные области по координатам

изображение по HTTP

Сервер

  • FastAPI
  • SQLite

распознавание и перевод

Офлайн-движки

  • Tesseract OCR
  • Argos Translate

Разборрешения и грабли

Разбор

Решения

Перевод остаётся на месте слова

Обычный переводчик забирает текст к себе в окно, и читатель теряет контекст. Tesseract отдаёт не только строки, но и координаты каждого слова — из них собирается прозрачный слой поверх снимка экрана, где каждое слово превращается в кликабельную область на своём месте.

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

Перевод офлайн, на своём сервере

Argos Translate работает без интернета и без внешнего API. Это медленнее облачного перевода на десятки миллисекунд, но снимает три вещи сразу: оплату по символам, лимиты и отправку наружу всего, что оказалось на экране, — включая рабочие интерфейсы, которые туда попадать не должны.

Renderer ничего не умеет сам

Захват экрана и сетевые вызовы остаются в main process, а renderer получает только типизированный IPC-мостик через preload. Это не формальность: overlay рисуется поверх всего, что есть на экране, и давать этому окну прямой доступ к системным API было бы неаккуратно.

Что оказалось сложным

macOS выдаёт разрешение на запись экрана один раз и молча отказывает, если его не дали, — без внятной ошибки, просто чёрный кадр. Пришлось отдельно отлавливать это состояние и объяснять пользователю, куда идти в системных настройках.

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

Экраны3 снимка

Как это выглядит

  • Overlay поверх экрана — распознанные слова обведены рамками и доступны для нажатия

    Overlay поверх экрана — распознанные слова обведены рамками и доступны для нажатия

  • Перевод одного слова во всплывающей подсказке рядом с оригиналом

    Перевод одного слова во всплывающей подсказке рядом с оригиналом

  • Личный словарь сохранённых слов с переводами

    Личный словарь сохранённых слов с переводами

Ссылкипосмотреть вживую