- Design tool
- Web
- Свой продукт
От пяти ручных шагов к одному
Разработал инструмент, который подбирает мокап смартфона по скриншоту интерфейса и собирает готовую композицию. Вся обработка выполняется прямо в браузере.
glowy - инструмент для автоматического подбора мокапов устройств по скриншоту интерфейса. Проект появился как решение моей собственной проблемы: при оформлении кейсов и презентаций я регулярно тратил много времени на поиск подходящего мокапа устройства. Пора это заканчивать.
Обычно подбор мокапа выглядит так:
-
определить модель устройства;
-
найти подходящий PSD или PNG;
-
проверить, совпадают ли пропорции;
-
вручную вставить изображение;
-
экспортировать финальную сцену.
Даже при наличии готовой библиотеки мокапов этот процесс занимает несколько минут и постоянно повторяется.
Технический подход
Одним из принципов проекта стала полностью локальная обработка данных.
Вся логика от анализа изображения до генерации финальной сцены - выполняется прямо в браузере. Скриншоты не загружаются на сервер, благодаря чему сервис:
-
работает практически мгновенно;
-
не требует серверной инфраструктуры для обработки;
-
обеспечивает полную конфиденциальность пользовательских данных;
-
может масштабироваться без затрат на вычислительные ресурсы.
Решение
Я разработал веб-приложение, которое:
-
анализирует загруженный скриншот;
-
определяет наиболее подходящую модель смартфона;
-
автоматически подбирает соответствующий мокап;
-
генерирует готовую композицию для презентации интерфейса.