Unredacter

Показывает, почему вам никогда-никогда-никогда не следует использовать пикселизацию в качестве метода редактирования. Более подробное описание того, как это работает, читайте в моём блоге здесь.

Как попробовать

Установите зависимости:

npm install

Затем запустите с помощью

npm start

Вот и всё.

Как расшифровать собственное пикселизированное изображение

Это довольно ручной процесс и совсем не автоматизированный. Думаю, вы поймёте почему. Если кто-то захочет попробовать встроить этот процесс в само приложение — я весь внимание. По-вашему, я похож на разработчика Electron? Но да, вот как это делается:

1. Обрежьте изображение так, чтобы осталась только пикселизированная область. Никаких рамок, никакого другого текста. Замените secret.png на это. Рекомендую делать это в GiMP.

2. Запомните размер блока (это просто размер каждого пикселизированного блока). Замените blockSize в коде на это значение.

3. Настройте CSS как следует. Это самая сложная и трудоёмкая часть. Попробуйте ввести его в test.html и открыть в Chrome. Подгоняйте, пока не сможете воспроизвести какой-нибудь образец текста как можно точнее. Уделите особое внимание межсловному и межбуквенному интервалу. Если он сместится, то всё испортится. Также важна насыщенность шрифта (font-weight), иначе всё будет слишком светлым или тёмным. Не могу переоценить важность этого шага, ведь всё зависит от возможности точно воспроизвести редактируемые символы.

4. Определите, какой набор символов вы хотите попробовать. Он находится в начале preload.ts.

5. Нажмите кнопку запуска и посмотрите, работает ли это!