Photoshop против Illustrator для разработки иконок

Мой клиент запрашивает файлы SVG (сохранение в формате SVG потребует от меня создания значка в Illustrator), но я всегда создавал значки в Photoshop (импорт векторной графики из Illustrator и размещение в виде смарт-объекта + применение стилей слоев) — я обнаружил, что Photoshop обеспечивает большую гибкость в эффектах наложения (для теней, градиентов… для рельефного вида).

Кто-нибудь имел опыт создания иконок в Illustrator и создания такого же эффекта, как в Photoshop?

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

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

Ответы (4)

Если SVG является желаемым результатом, я бы посоветовал попробовать InkScape. Это открытый кислый. Хотя пользовательский интерфейс не так совершенен, как AI, он достаточно надежен, а собственный формат файла — SVG, поэтому он идеально подходит для работы с SVG.

Что касается «эффектов», вы можете эмулировать растровые эффекты с помощью векторных файлов и наоборот. Это может быть обманчиво в зависимости от типа эффекта, но, безусловно, выполнимо.

У меня все еще возникают проблемы с созданием эффектов того же стиля в AI (даже если я могу, эффекты на самом деле не переводятся в экспорт> SVG). Я скачал Inkscpae среди (Acorn, Sketch, Opacity и т. д.) — безрезультатно. Не находите ни один из них очень интуитивным, и если бы я использовал один, он должен был бы импортировать EPS и иметь возможность экспортировать как SVG. Я также попытался загрузить плагин экспорта SVG в Fireworks, но он не импортируется как встроенный файл (создает несколько файлов) + загружены обновленные плагины CS5 для дополнительной поддержки SVG (для обновлений HTML5)… так что я в растерянности к решению SVG…
Inkscape — лучший вариант для чистой работы с SVG. Как и в любом программном обеспечении, требуется некоторое время, чтобы привыкнуть к пользовательскому интерфейсу... это не произойдет за час. Но сделано достаточно хорошо. Я приравниваю его больше к Macromedia Freehand, чем к Adobe Illustrator. Тем не менее, я надеюсь, что ИИ станет лучше поддерживать SVG. Поскольку Flash уходит в прошлое, Adobe приходится возвращаться к SVG и тому подобному.

Это во многом зависит от искусства и вашего уровня владения Illustrator.

В Illustrator есть тени, градиенты, свечение и т. д. Так что все это можно сделать в Illustrator. Это просто вопрос мастерства.

SVG предлагает намного больше, чем любой формат Photoshop. SVG можно масштабировать на лету и сохранять внешний вид... png/gif/etc. не мочь.

Прошло много времени с тех пор, как я использовал Illustrator, поэтому, возможно, сейчас все по-другому, но в прошлом такие вещи, как тени, были растровыми, поэтому не уверен, будут ли они работать в SVG или нет.
@ DA01 Они растрируются, а затем встраиваются в SVG. Что противоречит цели SVG, но это можно сделать. <image xlink:href="data:image/png;base64,{bytes}">. Я не уверен, какие другие программы используют SVG, но я считаю, что это поддерживается всеми основными браузерами.
Я полагаю, что если SVG будут использоваться только одного размера, это сработает. Но, как вы указываете, такой вид побеждает смысл использования SVG с самого начала.
@ DA01: То есть, то нет. SVG всегда был разработан для поддержки встраивания растровых изображений. Но это по-прежнему позволяет вам использовать векторы, когда это возможно. Если вы сохраните возможности редактирования в Illustrator, вы всегда сможете повторно визуализировать тени и т. д. с более высоким разрешением. В качестве альтернативы, для большинства простых эффектов, таких как размытие и тени, вы можете просто использовать фильтры из меню фильтров SVG.

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

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

Когда вы довольны растрированным результатом, конвертируйте в .svg с помощью Inkscape (да, в нем есть функция для трассировки растрового изображения!) или Vectormagic . И вы получите хороший .svg, чтобы сделать вашего клиента счастливым.

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

Позже вы можете использовать Illustrator или Inkscape для тонкой настройки вашего .svg.

Дайте мне знать, возможно ли это решение для вас. Всего наилучшего.

это может работать в зависимости от стиля иллюстрации, но обратите внимание, что автоматическая трассировка редко дает качественные результаты... особенно при запуске с растровым файлом такого низкого разрешения.
Правда, в зависимости от художественного произведения и его сложности. Картина Рембрандта определенно выходит за рамки автотрассировки ^_^
IME, автоматическая трассировка может работать нормально, если вы начинаете с чего-то вроде сканирования черно-белого рисунка с высоким разрешением, но я действительно не ожидаю получить что-то полезное от трассировки растрового изображения 256 x 256 пикселей. с цветами и сложными градиентами. Конечно, это во многом зависит от используемой вами программы; На первый взгляд Vector Magic выглядит довольно хорошо, но кажется, что большинство образцов изображений на их веб-сайте по-прежнему состоят из сплошных цветных фигур с простыми очертаниями.

Здесь уже много отличных ответов. Я бы порекомендовал ознакомиться с Icon Handbook Джона Хикса http://iconhandbook.co.uk/ для дальнейшего чтения. Лично я бы использовал иллюстратор, если бы не делал фавикон размером 16x16.