Vladyslav Didyk

Pixel — диагностика экрана

Приложение, которое тестирует экран телефона и помогает починить залипшие пиксели.

Pixel — диагностика экрана

Pixel — это приложение для телефона, которое проверяет экран на неисправности и запускает пять режимов восстановления залипших пикселей. Я проектирую и пишу его один, на Expo и React Native.

Pixel — это приложение для телефона, которое заботится об экране. В нём пять анимаций для восстановления залипших пикселей, пять тестов экрана, фонарик более чем с 30 цветами и небольшой сервер, который смотрит на фото экрана и находит проблемные места. Сделано одним человеком на Expo и React Native.

Роль
Один — дизайн и код
Сроки
В разработке
Стек
Expo SDK 54 · React Native 0.81 · React 19 · TypeScript (strict) · Reanimated v4 · Express 5 · PostgreSQL · Drizzle ORM · sharp · React Compiler + New Architecture

Идея

Залипший пиксель часто можно починить — правильным световым шоу.

Наука.

Иногда одна крошечная точка на экране залипает на одном цвете. Если достаточно быстро и долго мигать на неё яркими цветами, она часто снова оживает. Для разных проблем нужен разный свет: быстрые вспышки, медленные цветовые волны или случайный шум. Одного режима восстановления мало, поэтому в приложении их пять.

Что это за приложение.

Pixel — это полный набор инструментов для экрана, построенный вокруг этой идеи. В нём пять анимаций восстановления, пять тестов экрана, фонарик более чем с 30 цветами и сервер, который проверяет фото экрана и указывает на пиксели, которым нужна помощь. Одно приложение, две задачи: найти проблему, а потом починить её.

Главная функция

Пять режимов — пять способов починить пиксель.

Каждый режим мигает экраном по-своему.

  • Color-Cycle — Красные, зелёные и синие вспышки в случайном порядке. Универсальный режим, который работает, когда непонятно, что именно не так.
  • Fast-Flash — Чистые чёрный и белый цвета, 60 вспышек в секунду. Самый сильный сигнал — для сильно залипших пикселей.
  • Random-Pixel — Тысяча крошечных точек, как телевизионный шум, перерисовывается каждый кадр. Этот узор помогает полностью мёртвому пикселю.
  • Pulse-Wave — Медленные цветовые волны с мягкими изменениями яркости. Щадящий режим — для следов от картинок, которые слишком долго оставались на экране.
  • Gradient-Sweep — Радуга скользит по экрану, пиксель за пикселем. Находит тусклые пятна, которые не замечает вспышка на весь экран.

Находить проблемы, а не только чинить их

Полная проверка экрана внутри инструмента для восстановления.

Пять тестов подряд.

Тест экрана проводит вас через пять небольших тестов: мёртвые пиксели, равномерность яркости, плавные переходы цвета, скорость отклика и точность цветов. Можно пройти всю проверку за один раз или сразу перейти к нужному тесту.

И ещё четыре рядом.

Есть также тест касаний (чувствует ли палец каждая часть экрана?), калибровка экрана по яркости и цвету, полноцветный Pixel Test для поиска мёртвых пикселей на глаз и итоговый экран. Всего девять экранов проверки в одном приложении.

Сервер

Бэкенд, который действительно смотрит на ваши пиксели.

Как это работает.

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

Из чего сделан сервер.

  • Express 5 — Небольшой веб-сервер с одной задачей: принять фото и быстро ответить.
  • sharp для анализа — Инструмент для работы с фото, который измеряет картинку пиксель за пикселем — быстро и точно.
  • PostgreSQL + Drizzle — База данных. У приложения и сервера один общий набор типов данных, поэтому они всегда говорят на одном языке.
  • Поставка одним файлом — Сервер упаковывается в один небольшой файл с одной командой запуска — его легко запустить где угодно.

Бонус

Фонарик, спрятанный в приложении для восстановления.

Более 30 цветов, яркость одним жестом.

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

Мастерство

Мелкие детали, на которых всё держится.

Что под капотом.

  • Размеры, которые подстраиваются — Текст и кнопки масштабируются под размер телефона, поэтому на большом телефоне каждая подпись не превращается в заголовок.
  • Один файл темы — Все цвета, отступы и стили текста лежат в одном файле. Измените его один раз, и всё приложение подстроится.
  • Значки под каждую платформу — Значки в стиле Apple на iPhone и подходящие значки на Android — каждая платформа выглядит родной.
  • Новейший движок React — Приложение работает на последнем движке React Native, поэтому даже тяжёлые анимации остаются плавными.

Следующий проект: Sprout — аффирмации о деньгах