Как я могу создать текстуру фруктов?

Я хочу создать текстуру фруктов, особенно лимона, в виде текстурированного изображения, которое в остальном прозрачно. Это потому, что я хочу иметь возможность использовать его в качестве слоя наложения на элементы в моем браузере.

Вот пример типа текстуры, которую я пытаюсь создать, без желтого цвета.

Мне удалось найти, как создать текстурированный текст , состоящий из изображений фруктов , но мне нужно наложение, потому что мой контент более динамичен.

Я также изучил фильтры Photoshop, а именно Plastic Wrap , потому что он был похож на текстуру, которую я пытаюсь создать, но я не смог применить фильтр к прозрачному изображению.

Может ли кто-нибудь дать представление о том, как я могу создать прозрачное текстурированное изображение, похожее на кожуру лимона?


Используя подход Blue1086, я смог создать следующее, и это здорово, но есть ли способ удалить больше серого? Как вы можете видеть в моем проекте , он делает лимон наверху немного более серым, чем мне хотелось бы.

Чтобы хорошо смешать его, вам нужно использовать режим наложения фона CSS. Они еще не полностью поддерживаются во всех браузерах, но они там есть.

Ответы (4)

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

  1. Создайте полностью цветной лимон (или просто используйте изображение)
  2. Перейдите в « Изображение» > «Коррекция» > «Обесцветить изображение ».
  3. Перейдите в меню « Правка» > « Определить шаблон ».
  4. Создайте пустой новый слой над изображением, на которое хотите поместить текстуру.
  5. Перейдите в меню « Редактирование» > « Заливка » (убедитесь, что в разделе « Смешивание » установлен режим « Нормальный », а непрозрачность установлена ​​на 100 % ).
  6. Нажмите ОК
  7. Установите режим наложения слоя на Overlay .

Это сработало?

РЕДАКТИРОВАТЬ: Хорошо, теперь я вижу, что вы хотите.

  1. Создаем прозрачный слой в фотошопе .
  2. Вставьте свое изображение
  3. Перейдите в « Изображение» > «Коррекция» > «Обесцветить изображение ».
  4. Измените непрозрачность примерно до 50%
  5. Выберите « Файл» > «Сохранить как».
  6. Установите формат PNG (или другой прозрачный формат)
  7. Нажмите Сохранить
Это круто! Но есть ли способ удалить серый цвет дальше? Я уменьшил непрозрачность до 20%, чтобы лучше подогнать изображение, но было бы здорово удалить больше серого, если это возможно.
Помогает ли переход в Image > Adjustments > Hue/Saturation , а затем увеличение Lightness ?
к сожалению нет
Последнее, что я могу придумать, это «Изображение» > «Коррекция» > « Заменить цвет » . Нажмите пипетку с помощью «+» и выберите сероватые части, которые вы хотите сделать «менее серыми», затем измените окончательный цвет на что-то вроде белого или светло-серого. Может помочь отметка локализованных цветовых кластеров. Вы можете поиграть с этим, пока не получите желаемый результат.

По какой-то причине этот вопрос возник через 5 лет после публикации. Тогда, очевидно, у веб-дизайнеров не было режимов наложения, таких как жесткий свет, умножение и т. Д. У них была только прозрачность для смешивания слоев.

Это не помешало попыткам получить что-то, хотя частично прозрачная текстура серого цвета сделала цвета тусклыми, как мы видим в старых ответах и ​​их комментариях. С режимами наложения Photoshop потребовалась бы фотография текстуры, которая в среднем имеет 50% серого цвета и имеет режим наложения жесткого света. Результат был бы и все равно было бы ок.

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

Только белая текстура не может быть правильной, но ее все же можно использовать. Пример:

введите описание изображения здесь

Слева не очень хорошо нарисованный лимон с простой радиальной градиентной окраской. Справа есть образец текстуры, который содержит только 60% непрозрачных белых случайных точек. Есть маска слоя, чтобы ограничить затронутую область. На следующем изображении слой с текстурой полностью непрозрачен, без маски и на темном фоне:

введите описание изображения здесь

Текстура сделана из ЧБ шума:

введите описание изображения здесь

Шум был размыт с помощью размытия по Гауссу 1 пиксель, и в результате получился фильтр Stylize > Emboss:

введите описание изображения здесь

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

введите описание изображения здесь

С помощью волшебной палочки можно выбрать желтый цвет (= образец всех слоев) и этим выделением удалить серые области между белыми в текстуре. Результат с режимом наложения normal дает тот же результат, что и предыдущий с режимом наложения Lighter color:

введите описание изображения здесь

Результатом является использованная конечная текстура, удалите только желтый тестовый слой и экспортируйте в формате PNG.

Если допускается некоторая серость , можно сделать перевернутую копию белой текстуры и сдвинуть ее на пару пикселей. Это создает что-то вроде тиснения:

введите описание изображения здесь

В Photoshop смешивание «более светлого цвета» оставляет черный цвет только по краям. Слияние текстур и поднятие черного до 50% серого с помощью Кривых создает текстуру, которая более правдоподобна, чем только белый цвет, потому что она делает поверхность более неровной. Здесь это применяется к «лимону»:

введите описание изображения здесь

Этот ответ, возможно, не самый лучший, но вы можете попробовать выполнить следующие шаги:

  • Перейти на вкладку каналы
  • Ctrl+щелчок, значок слоя канала, который лучше всего представляет текстуру, и Ctrl+C его
  • Вернитесь к слоям и снимите выделение (если выбрано).
  • создайте новый слой и вставьте (Ctrl+V)

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

Вот как выглядит мой тест, но я скопировал все 3 канала, а затем объединил их:

введите описание изображения здесь

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

Проблема в том, что мне нужно было экспортировать текстуру как слой для использования в браузере (чтобы его можно было динамически добавлять к другим вещам), а не влиять на что-то в самом Photoshop. Спасибо за ваш вклад!