Массовое автоматическое создание инфографики. Онлайн бесплатно без регистрации. Идея и реализация — мои

Идея и реализация - мои. Ссылка на демонстрацию.

Идея

Если открыть Озон или Вайлдберрис, у многих товаров на главной картинке будет какой-то текст. В контексте работы с маркетплейсами это принято называть инфографикой. Думаю, вы поняли, о чем я. Если нет - вот как выглядит главная страница Озона для меня прямо сейчас.

На 7 из 10 картинок есть текст, добавленный поверх изображения.
На 7 из 10 картинок есть текст, добавленный поверх изображения.

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

Похоже, на это тратятся сотни тысяч часов живых людей. А можно ли автоматизировать? В идеале, от нас потребуется только указать картинки и фрагменты текста, которые следует на них разместить, а алгоритм сам все сделает для сотен и тысяч картинок сразу.

Сначала я попросил сделать ChatGPT работу за нас.

Просим ChatGPT поработать
Просим ChatGPT поработать

Вот результат:

Разборчиво, да
Разборчиво, да

Я сделал не одну попытку объяснить, что нужно сделать, и на русском, и на английском, но всегда получалось что-то не то.

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

И даже что-то получилось. Давайте посмотрим на результаты работы программы и оценим вместе. Дальше будет много картинок. Их я надергал с настоящих карточек товара на Озоне, оригиналы не содержат текста. Алгоритм поддерживает некоторую вариативность, поэтому для некоторых картинок будет несколько вариантов. Также будут варианты с меньшим и большим количеством информации.

Примеры

Начнем с простого, предмет на белом фоне.

Надписи неплохо читаются, согласитесь, лучше, чем результат ChatGPT
Надписи неплохо читаются, согласитесь, лучше, чем результат ChatGPT

А если фон не совсем белый, а скажем, серый?

Одна надпись
Одна надпись

А если черный?

Несколько надписей с предметом на черном фоне
Несколько надписей с предметом на черном фоне

Давайте посмотрим теперь на сложный фон.

Сложный фон
Сложный фон

Добавим больше характеристик и перечисление доступных цветов.

Кружочки - это доступные цвета товара
Кружочки - это доступные цвета товара

Посмотрим на еще один пример без перечисления цветов и с перечислением цветов.

Можно носить до -20 градусов по заявлению продавца
Можно носить до -20 градусов по заявлению продавца
Кружочки - это доступные цвета товара
Кружочки - это доступные цвета товара

А если надписей много?

На картинку нужно вместить много читаемых надписей
На картинку нужно вместить много читаемых надписей
И на эту тоже
И на эту тоже
И на эту
И на эту
И сюда
И сюда
И на эту
И на эту

А неудачные варианты? Тоже бывают.

Алгоритм добавлял пространства вокруг модели, и получилась резковатая граница фона
Алгоритм добавлял пространства вокруг модели, и получилась резковатая граница фона
Текст снизу не очень хорошо читается
Текст снизу не очень хорошо читается

А что насчет видео? Теоретически, его тоже можно сгенерировать. Я попробовал запрограммировать какой-нибудь эффект, в принципе, получилось.

Запрограммировал генерацию видео
Тот же эффект на другом изображении

Как использовать?

Переходите по ссылке https://catalog.app/public-opportunities/generate-infographics. Там можно попробовать загрузить изображения по одному и разместить на них надписи. Это для быстрого знакомства с возможностями.

Для массовой обработки фото нужно перейти по ссылке https://catalog.app/public-opportunities/mass-generate-infographics. Там будет пример файла, который можно загрузить на этой же странице, чтобы изображения сгенерировались массово. Если файл загрузить несколько раз, каждый раз результаты будут немного отличаться, можно выбрать лучший из вариантов.

Регистрация не потребуется.

Ограничения такой версии тоже есть, за раз можно не больше 20 картинок обработать. Но количество раз не ограничено.

А заодно, посмотрите и другие воможности, их у нас много, мы целую PIM систему сделали и с маркетплейсами интегрировали.

P.S. Надеюсь на понимание дизайнеров, я называл инфографикой то, что принято называть инфографикой в контексте маркетплейсов, но что в строгом смысле ей не является.

44
9 комментариев

Вы нащупали классную боль - делать такие карточки малому бизнесу непросто. Но здесь важна не только техническая основа решения - важно учесть, что пользователи не будут изнутри знать, как работает ваш алгоритм, и соответсвенно не получат такую же красоту как в статье смогли получить вы. Поэтому перед тем как ваш продукт реально станет незаменимым у селлеров - вам понадобится провести десятки тестов юзабилити, интервью пользователей и тестирование гипотез. Удачи вам в создании этого продукта, начало классное!

1
Ответить

Да, все так. Я старался выложить инструмент в паблик как можно раньше, чтобы как можно раньше получить обратную связь. Спасибо, что не прошли мимо и прокомментировали. Еще многое предстоит доделать.

Что касается примеров, то я не делал ничего особенного, сгенерировал по несколько вариантов таким же способом, который сейчас доступен пользователям, и выбрал лучшие. Но, конечно, вы правы, есть особенности, о которых я знаю а пользователи - нет, и поэтому у меня в среднем получится лучше.

1
Ответить

Пробовал сгенерировать тестово на этой странице
https://catalog.app/public-opportunities/generate-infographics

Не сработало ничего, загружал своё фото просто и текст. Жму "сгенерировать" никакой реакции никаких ошибок, никаких загрузок

1
Ответить

Я понял, из-за того что фото без белого фона видимо загрузил. Но никаких ошибок не выдало мне. Сделайте хотя бы уведомляшку и причину по которой не сработала генерация.

Проект прикольный, но конечно инфографика пока не идеальная. Дизайнеры конечно делают в разы лучше пока-что) Но если говорить про будущее, то думаю 100% оно у вас есть, если доработать алгоритмы и добавить красивые шрифты и элементы.

Ответить