Как я могу экспортировать изображение из изображения Illustrator в нескольких размерах?

Я новичок в Adobe Illustrator, и у меня есть изображение логотипа, которое мне нужно использовать в 5 или 6 разных размерах. Изображение логотипа было создано в Adobe Illustrator, но когда я пытаюсь сохранить изображение в PNG или JPEG, то, что должно было быть просто, оказывается очень сложным.

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

Однако для многих веб-приложений пользователь уже знает необходимые выходные размеры в пикселях. Есть ли способ просто указать необходимую ширину или высоту сохраненного изображения в пикселях?

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

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

Ответы (5)

«Файл» > «Сохранить для Интернета», а затем введите размеры в пикселях, щелкнув Image Sizeвкладку справа от окна «Сохранить для Интернета».

Или я вас не правильно понимаю?

Отлично, спасибо. Я только что потратил около 15 минут на функцию «экспорт», но поскольку она отказывается использовать менее 72 пикселей на дюйм, мне пришлось масштабировать иллюстрацию и монтажную область для очень небольшого экспорта, что, вероятно, сделал и спрашивающий.
Поскольку это «принятый» ответ, позвольте мне поднять его почти на десятилетие. Современные версии ИИ (в 2021 году) будут считать функцию «Сохранить для Интернета» устаревшей , предлагая дополнительную (новую) функцию экспорта. Здесь вы можете установить флажок «Включить обрез» (при условии, что ваш артборд указывает правильные размеры), а затем выбрать любые размеры и форматы файлов, которые вы хотите (JPEG, PNG, SVG, PDF). ИИ будет пакетно сохранять их всех во всех размерах.

Использование File → Save for Webи ввод размеров сделает то, что вам нужно. Кроме того, Illustrator использует векторное масштабирование, поэтому результаты лучше, чем если бы вы попробовали то же самое в Photoshop — ввод размеров, не соответствующих документу в Photoshop, означает, что изображение будет масштабировано в растровом формате.

Обратите внимание, что вы должны нажать «Применить» после изменения размеров, если вы используете версию Illustrator до CS6.

Сохранить для Интернета в Illustrator

О, и есть очень хороший шанс, что вы захотите Convert to sRGBего отключить — он деструктивно преобразует ваше изображение из текущего цветового пространства в sRGB, вызывая сдвиг цветов.

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

В CS6 нет кнопки «Применить»… и я не согласен с «Преобразовать в RGB», вы хотите, чтобы эта кнопка была включена для изображений, предназначенных для Интернета.
Спасибо за совет по CS6. Оставить Convert to sRGB включенным — абсолютно неправильный подход для работы в Интернете и пользовательском интерфейсе. Вот целая статья о том, почему: bjango.com/articles/photoshop (Соревнуйтесь со мной в этом на свой страх и риск!)
Ссылаться на свою собственную статью так, как будто она заслуживает большего доверия, чем ваше мнение здесь, немного нелепо. ЛЮБОЙ может создать веб-страницу, поддерживающую ЛЮБОЕ мнение, правильное или неправильное. Черт возьми, я видел целые подробные веб-сайты, посвященные объяснению совершенно неподходящих методов управления цветом. 25+ лет практики значат для меня больше. Это наряду с прямыми обсуждениями с такими людьми, как Эндрю Родни, Брюс Фрейзер и Крис Кокс. Если вы не можете полностью контролировать цветовые профили на КАЖДОМ мониторе, на котором будет отображаться ваша работа, вам нужен sRGB. Мы должны согласиться, чтобы не согласиться.
Вы вообще статью читали? Когда вы работаете с веб-сайтами и пользовательским интерфейсом, точные значения цвета ДОЛЖНЫ поддерживаться на протяжении всего процесса. Если вы введете #FF0010 в качестве цвета, он ДОЛЖЕН быть выведен в файле как #FF0010, если вы намерены сопоставить цвет в коде. Это означает, что Преобразование в sRGB ДОЛЖНО быть отключено. У меня такое ощущение, что вы не занимаетесь такой работой и не понимаете, в чем тут дело.
Скотт, пожалуйста, не принимайте это как личную атаку, но я думаю, что из подобных обсуждений вы, возможно, усвоили некоторые ошибочные представления о представлении цветов RGB. См. также graphicdesign.stackexchange.com/questions/7815/… .
Эти комментарии неуместны e100. Вы были немного придирчивы к цифрам, которые я использовал, хотя я много раз заявлял, что просто обобщаю. И, конечно же, я не читал вашу статью, Марк. Думаете вы все об этом или нет. Я действительно знаю некоторые вещи, о которых я пишу. Я не какой-то 25-летний дизайнер, только что окончивший школу. Опять же .. мы должны согласиться не соглашаться. Есть ПРИЧИНА, по которой команда Save for Web внедрила опцию Convert to sRGB. Его изначально не было.
Да, чтобы FF0010 соответствовал изображению, содержащему FF0100, вы можете получить лучшие результаты на своем мониторе , если ваш монитор плохо откалиброван, отключив преобразование в sRGB. Однако, как я уже писал, если вы не можете контролировать калибровку цвета каждого отдельного монитора в мире, который будет видеть вашу работу, вам нужно преобразовать его в sRGB. Это гарантирует, что плохо откалиброванные мониторы или браузеры без управления цветом также будут соответствовать цветам. Это легко, если все, что вы делаете, предназначено для пользовательских интерфейсов и iDevices, поскольку все это управляется цветом. Не так просто для веб-дизайна.
В конце концов, я рад, что то, что вы все используете, работает для вас. Так что продолжайте использовать его. То, что я использую, работает для меня и работает десятилетиями. Так что мое мнение не изменится. Я больше всего доверяю своему опыту. Как я уже писал, нам просто нужно согласиться или не согласиться .
Преобразование в sRGB — неправильный выбор почти во всех мыслимых ситуациях при работе в Интернете. «Есть ПРИЧИНА, по которой команда «Сохранить для Интернета» реализовала параметр «Преобразовать в sRGB» — пора это исправить. Feedback.photoshop.com/photoshop_family/topics/…

Когда мне нужно поддерживать несколько размеров пикселей, я дублирую и масштабирую искусство в одном и том же AI-файле. Каждый размер помещается на отдельный артборд правильного размера. Я добавляю имя доски в формат экспортируемого файла. Затем я запускаю jsx, который экспортирует каждую монтажную область и выбирает формат файла из имени, используя последние настройки, которые я ввел для этого формата в этом файле. Это все в CS5.

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

Пожалуйста, не могли бы вы поделиться .jsx?
@kelin Боюсь, я не могу. Прошло много времени с тех пор, как я заморачивался с продуктами Adobe.
Не проблема, я нашел отличный скрипт здесь: stackoverflow.com/a/28067227/3050403

Вы также можете создать документ соответствующего размера в Photoshop (или выделить область с направляющими), а затем «Файл» > «Поместить векторную графику».

Вы можете масштабировать размер фигуры до ее рендеринга. Очевидно, что масштабирование после этого снизит его качество.

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

Дополнением к этой теме, которое я нашел интересным для разработчиков мобильных приложений, является этот скрипт , который создает активы Retina для iOS и Android в 1 клик.