В прошлой статье я рассказал, как можно создать классные обои из паттернов https://dzen.ru/a/aV5_eS4rShKLcAHS
Со времен аналогового мира, когда в детстве окном в другой мир были плакаты и комиксы напечатанные точками утвердилась моя личная любовь к стилю как, к источнику воображения. Смотришь на эти точки, а видишь целый мир. Я не знал тогда, что этот стиль в изобразительном искусстве называется halftone. И не знал до эры ИИ. Но вот пришел ИИ и долго ждать не пришлось, когда я захотел создать изображение в стиле старого-любимого. Пришлось искать правильно слово для токена.
Halftone - полутон.
Первые нейронки не умели делать это красиво. Сейчас другое дело. И я даже не думал никогда о том, чтобы создавать специальный инструмент. Это вышло совершенно случайно и помог в этом другой ИИ.
Другой ИИ
Вы знаете про Perplexity? Отличная ИИ, которая может заменить вам любой поисковик, потому что делает за вас много работы. Если обычно вы что-то "гуглите" то потом результаты поиска анализируете самостоятельно открывая, как правило первые несколько ссылок в результатах. Так вот Perplexity делает это за вас и выдает вам сводную информацию, предоставляя ссылки на источники. Отличный инструмент.
Но также эта ИИ умеет генерировать изображения. И вот ее картинка для ожидания результата генерации и навела на мысль. Только полюбуйтесь:
Это произвело на меня впечатление. Я тогда подумал о том, что можно любое изображение попробовать представить в этом стиле. Просто представить изображение в виде серых точек разной яркости.
Как видите, идея была не совсем про halftone, но удивительное дальше.
В этот раз для написания приложения я использовал ChatGPT:
Промт: Напиши простое SPA приложение в html файле, которое принимает изображение и показывает его стилизовано в собственном исполнении. Собственное исполнение это: на темно-серой канве размещены светло серые точки (кружочки) в форме сетки. При отображении принятого изображения происходит анализ картинки в черно белом варианте и после этого каждая точка на сетке принимает свой размер чтобы отобразить ту область картинги которая географически соответствует тому место где находится точка. Размер точки отвечает за передачу светлых участков картинки. Фон за отражение темных участков.
ChatGPT быстро пишет код. Но мне он не всегда нравится. У него есть негативная черта. Когда вы начнете просить его доработать приложение, готовьтесь к тому, что он из вас душу вынет уточняющими вопросами ни о чем ("Хотите я сразу напишу весь код?" ... "Хотите я предоставлю результат файлом для скачивания или напечатаю код в тексте ответа?" ... "Я все понял, значит вам нужно ... Если я верно вас понял, просто напишите да!" ....), и не даст вам ничего. Вы просто потратите свои токены и он напишет вам "Приходите завтра". Как вам такое издевательство?
Но при первичном запросе он справляется отлично. Вот какой результат я получил:
Как видно на результате, это чистый halftone. Видимо подсознательно я именно к этому и вел ИИ. На скрине видно несколько параметров настройки, которые предложил ИИ. Я был сильно впечатлен и уже этого было достаточно, чтобы перепробовать с десяток своих лучших генераций из архива и взглянуть на них по новому в этом простом приложении.
Доработка
В итоге мне пришло в голову еще несколько идей, а также я попросил ИИ самому предложить несколько функций для этого приложения. И так у нас появились:
1. Изменяемый угол сетки
2. Изменение сетки на спираль, круг, гексагон и т.д.
3. Изменение точки на фигуру: гекс, символ
Это только малая часть всего, что я накрутил в коллаборации с ИИ.
При чем тут фотошоп?
Как будто бы этого было мало. Я смотрел на результаты и думал, что это отличная основа для чего-то большего. Ну на самом деле. У меня есть полноцветный оригинал и halftone версия. Мой внутренний любитель все смешивать просто кричал о том, что нужно соединить эти два изображения.
Я решил далеко не ходить за ответом. Просто попросил DeepSeek рассказать, что можно сделать в Фотошопе с этими двумя картинками. Ответ я получил в виде пошаговой инструкции.
Вот промт:
У меня есть инструмент который делает из изображения крутые стилизации под halftone или гексы вместо точек. Я бы хотел. Чтобы ты предложил мне интересные инструкции для фотошопа как можно использовать исходник и полученный результат для создания стилизованных изображений. Простое наложение через слой умножением я уже пробовал. Хочется что-нибудь еще интересное
Вот ответ:
Вот подборка интересных техник и инструкций для Photoshop, которые позволят вам создавать по-настоящему уникальные изображения...
1. Техника: «Свечение изнутри» (Color Dodge / Screen)
Эта техника создает эффект яркого свечения, где стилизация (особенно с темным фоном) подсвечивает исходное изображение.
Инструкция:
Откройте исходное фото и его стилизованную версию в одном документе (стилизация сверху).
Вариант А (для темного фона): Измените режим наложения верхнего (стилизованного) слоя на Screen или Color Dodge. Color Dodge даст более яркий и контрастный эффект. Исходное фото будет "проглядывать" через светлые участки и точки/гексы.
Вариант Б (для светлого фона): Инвертируйте стилизованный слой (Ctrl+I / Cmd+I). Теперь у вас белый фон и черные точки/гексы. Измените режим наложения на Multiply. Это даст эффект, похожий на простое наложение, но с другой текстурой.
Усиление: Создайте копию стилизованного слоя, попробуйте режимы наложения Overlay или Soft Light и уменьшите Opacity, чтобы добавить текстуру и контраст.
2. Техника: «Динамический дуплекс» (Duotone + Texture)
Здесь мы используем стилизацию как маску для сложного цветового градиента.
Инструкция:
Исходное фото разместите внизу.
Сверху поместите градиентную заливку (Layer > New Fill Layer > Gradient Map). Подберите два-три контрастных цвета (например, оранжевый и голубой, розовый и синий).
Стилизованное изображение (halftone/гексы) поместите поверх градиента.
Создайте обтравочную маску: Наведите курсор между слоем с градиентом и слоем со стилизацией, зажмите Alt (Option на Mac) и кликните. Либо щелкните правой кнопкой по слою с градиентом и выберите Create Clipping Mask.
Теперь градиент будет виден только через точки/гексы вашей стилизации. Поэкспериментируйте с режимами наложения самого градиентного слоя (Overlay, Color, Hard Light).
3. Техника: «Смещение и глубина» (Displacement Map)
Это мощный метод для интеграции текстуры в само изображение, создавая иллюзию, что текстура лежит на поверхности объектов.
Инструкция:
Создайте карту смещения (Displacement Map):
Сделайте копию вашего исходного черно-белого фото (Image > Adjustments > Black & White). Это будет наша карта глубины.
Сохраните этот черно-белый файл как .PSD с названием "displacement_map".
Вернитесь к вашему основному файлу, где у вас исходное фото и сверху стилизация.
Выделите слой со стилизацией и примените фильтр: Filter > Distort > Displace.
Появится окно. Начните с параметров 10 / 10. Нажмите ОК, и вас попросят выбрать файл. Выберите сохраненный "displacement_map.psd".
Фильтр "наложит" вашу стилизацию по форме объектов. Тени и светлые участки исходного фото будут искажать точки/гексы, создавая объем. Поиграйте с непрозрачностью (Opacity) стилизованного слоя после применения смещения.
4. Техника: «Выборочная цветность» (Selective Color)
Эта техника позволяет оставить часть изображения в цвете, а остальное превратить в стилизованную текстуру.
Инструкция:
Поместите стилизованное изображение поверх исходного.
Добавьте к слою со стилизацией слой-маску (кнопка внизу палитры слоев).
Возьмите мягкую кисть (B) черного цвета.
На маске закрашивайте те области, где вы хотите вернуть исходное, цветное фото. Например, на портрете можно оставить цветными только глаза и губы, а все остальное превратить в графическую стилизацию.
5. Техника: «Двойная экспозиция» (Blend If)
Это очень художественный подход, который создает плавное и призрачное слияние двух изображений.
Инструкция:
Исходное фото внизу, стилизация сверху.
Дважды щелкните по слою со стилизацией (откроются Layer Style).
Найдите раздел Blending Options и внутри него – ползунки Blend If.
Вы увидите два ряда ползунков: This Layer (текущий слой) и Underlying Layer (нижний слой). Нас интересует Underlying Layer.
Зажмите Alt (Option) и раздвиньте треугольник ползунка «Белого» канала под Underlying Layer. Вы увидите, что ползунок разделится на две части. Раздвигая его, вы плавно "прячете" белые участки стилизованного слоя в светлых областях исходного фото. Двигайте ползунки, пока не получите гармоничное, призрачное слияние.
6. Техника: «Текстура для текстур» (Custom Pattern & Layer Style)
Превратите свою стилизацию в универсальную текстуру, которую можно накладывать на любые фигуры и текст.
Инструкция:
Возьмите ваше стилизованное изображение (желательно с контрастным черно-белым рисунком).
Идите в Edit > Define Pattern. Дайте имя вашему узору (например, "My_Halftone_Hex").
Создайте новый документ. Нарисуйте какую-нибудь фигуру или напишите текст.
К слою с фигурой/текстом примените Layer Style (двойной клик по слою).
Выберите пункт Pattern Overlay. В списке паттернов найдите только что сохраненный "My_Halftone_Hex".
Поиграйте с режимами наложения внутри стиля слоя (например, поменяйте Blend Mode в Pattern Overlay с Normal на Overlay или Soft Light). Это применит вашу стилизацию только к этой фигуре.
В результате моих экспериментов в ФШ, получись такие изображения:
Итог
На выходе получился довольно продвинутый инструмент, развитие которого далеко еще от границ своего потенциала. А подключение ко всей этой истории ФШ серьезно расширило возможности для творчества.
Согласитесь, намного интереснее, когда процесс творчества - это не запрос-ответ в ИИ, а целое исследование или даже путешествие в мир визуальных экспериментов.
Пробуйте, экспериментируйте, делитесь результатами и идеями. Исходник приложения сможете скачать с нашего Telegram-канала.