Создание высококачественных иконок с несколькими разрешениями

Предисловие:

Мне нужно было создать несколько (может быть, 30 или около того) иконок для приложения, которое я разрабатываю. Сначала мысль о разработке всех этих иконок для разных разрешений была для меня действительно пугающей (и до сих пор), особенно учитывая, что мне нужно разработать несколько тем. Поэтому я решил создать векторные иконки, чтобы один раз сделать дизайн и несколько раз изменить размер без потери качества. Но, как оказалось, я был мертв НЕПРАВИЛЬНО . Когда я экспортирую svg в png, особенно для низких разрешений, качество ужасное, и оно даже близко не к хорошему. Я бы сказал, что сглаживание отсутствует.

Вопрос:

Как мне приступить к разработке тем значков с разными разрешениями?

  • Должен ли я разрабатывать каждую резолюцию независимо??
  • Я делаю что-то неправильно при экспорте SVG в PNG?
  • или что?

КСТАТИ: я использую InkScape для разработки svg

Большое спасибо

РЕДАКТИРОВАТЬ

Разрешение выходного файла не стандартное, так как я создаю изображение спрайта. Но можно сказать, что размеры иконок почти 32х32 48х48 72х72 96х96...

А вот иконы:Иконки как изображение спрайта

РЕДАКТИРОВАТЬ 2

Честно говоря, я начинаю думать, что задаю неправильный вопрос (не в том месте :-D). Когда я загрузил изображение выше, я начал думать, что это не так уж и плохо. или даже если это плохо, это не так плохо, как конечный продукт. Поэтому я начал играть с иконкой в ​​GIMP, добавляя разные фоны. ЭТО НЕ ТАК ПЛОХО.

Поэтому я должен добавить, что мне нужны значки для приложения для Android. Возможно, за этот беспорядок отвечает андроид, мой код или даже измененный размер ImageView.

Каковы ваши целевые разрешения?
Я бы предположил, что это не имеет значения. Смотрите мою правку.
При достаточно небольшом размере это становится актуальным. При разработке значка размером 16px² учитываются другие аспекты дизайна, чем у значка размером 128px².
Это совершенно правильно. Спасибо за комментарий.

Ответы (1)

Должен ли я разрабатывать каждое разрешение отдельно??

Это зависит от значка.

Плоские, жирные штриховые рисунки, вероятно, могут быть разработаны как SVG и просто масштабироваться по мере необходимости в приложении / на веб-сайте. Вот как работают шрифты значков... это просто векторные значки, размер которых изменяется по мере необходимости.

С другой стороны, если это фотореалистичная иконка с мелкими деталями, то обычно процесс выглядит следующим образом:

  • дизайн большой
  • уменьшить для каждого размера
  • ручная настройка каждого конкретного размера на уровне пикселей

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

Я делаю что-то неправильно при экспорте SVG в PNG?

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

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

Спасибо за ответ. На самом деле, я думаю, когда я уменьшаю масштаб в InkScape, я не вижу этой потери качества. Но если я использую снимок экрана, фон будет непрозрачным. можно ли убрать фон без остатка??
Наиболее очевидная возможность плохого качества или отсутствия сглаживания — это необработанные размеры пикселей для меньших значков, вероятно, просто не хватает пикселей для игры. Настройка является ответом.
Как оказалось, где-то в приложении есть масштабирование. Так что проблема не в графике. Тем не менее, я приму ответ, так как из него я узнал несколько вещей, касающихся дизайна иконок. Спасибо брат
При экспорте из Inkscape не будет масштабирования, если вы оставите экспортное значение dpi равным 90 по умолчанию. Большинство устанавливают это значение равным 72, а затем задаются вопросом, что происходит со странными размерами их экспорта в пикселях.
Создание высококачественных иконок с несколькими разрешениями
СпросиСетьПолитика конфиденциальности1y, 0v