Как экспортировать четкие значки Android в Photoshop/Illustrator?

И Photoshop (формы слоев), и Illustrator (векторы) ужасно справляются с созданием четких ресурсов Android, когда я их сохраняю. Может ли кто-нибудь помочь, как сделать хрустящие изделия разных размеров, не делая это вручную? Вот методы, которые я пробовал:

  1. Использование XXXHDPI в Illustrator, Save for Webвплоть до всех остальных небольших размеров. (много размытых пикселей)
  2. Использование XXXHDPI в Photoshop, пакетный эффект изменения размера изображений (еще меньше размытия)
  3. Использование XXXHDPI в Photoshop, ручное сохранение для Интернета с выбранной бикубической резкостью (лучший метод, но не работает в пакетном эффекте).

Ответы (2)

Любой метод, использующий масштабирование на основе растровых изображений, будет выглядеть ужасно для векторных рисунков, особенно для небольших глифов. Хорошей новостью является то, что в настоящее время для Android действительно требуется только 2×, 3× и 4× ресурсов (может быть, 1,5×, если вы хотите ориентироваться на более старые устройства. iOS аналогична, требуется 1× (iPad Mini и более старые устройства), 2× и 3 раза (iPhone 6 Plus).

  • 1× = Android mdpi = iOS без Retina
  • 1,5× = hdpi для Android
  • 2× = Android xhdpi = iOS Retina
  • 3× = Android xxhdpi = iOS Retina HD (только для iPhone 6 Plus)
  • 4× = Android xxxhdpi

Вы заметите, что iOS и Android в наши дни имеют одинаковую сложность с точки зрения масштабов активов.

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

Если вы работаете с размером 1×, идеальным будет масштабирование в точном целочисленном кратном размере. Это означает, что ваши 2×, 3× и 4× изображения будут выглядеть великолепно.

Введение в генератор:

Вот мой рабочий процесс, включая много информации об использовании листов срезов и экспорте для Android и iOS.

Другой вариант, если активы достаточно просты, — использовать новые векторные рисунки Android:

Если вы используете векторные рисунки, вам нужно будет создать SVG, поэтому Illustrator может быть лучшим выбором (обратите внимание, что генератор Photoshop также может создавать ресурсы SVG).

Я также выступил с докладом на Adobe MAX, в котором затронул тему:

И, наконец, если вам действительно нужны 1,5-кратные активы, я бы порекомендовал настроить их вручную — если вы выполняете большую часть работы в 1-кратном масштабе, то 1,5-кратные активы будут иметь размытые края из-за масштаба. вовлеченные факторы. Вы мало что можете с этим поделать.

Этот пост может быть встречен ответами типа «Ты работаешь в 1×?! Вы ненормальный?". Я делаю большую часть своей работы в 1×, да. Но очень легко переключаться между масштабами, если вам нужно увидеть детали, или просто подтолкнуть полпикселя, где это уместно.

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

Насколько я знаю, следующее решение работает только в Photoshop:

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

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

(Или, если вам нужны простые формы и значки, попробуйте преобразовать их в шрифт, например Font Awesomeвот один из многих руководств о том, как это сделать (опять же, единственный, который я знаю). Таким образом, вам не придется измените их размер для всех плотностей, и они всегда будут довольно четкими, независимо от того, на каком устройстве вы их отображаете).