Какой формат у иконок

Какой формат у иконок

Термины

gif-формат, 256-цветная картинка — формат с использованием максимум 256-цветной палитры, прозрачность имеет 2 варианта: прозрачный и непрозрачный

png-формат, 32-битная картинка — 32-битный формат (24 бита на цвет и 8 бит на альфа-канал прозрачности), прозрачность имеет 256 ступеней.

ico-формат — ico файл, включающий несколько размеров и разрешений. Обычно ico для Windows XP содержат 16*16*256цв,32*32*256цв,48*48*256цв,16*16*32бит,32*32*32бит,48*48*32бит форматы. Ico файлы приложений для Windows Vista/7/8 содержат дополнительно 256*256 размеры. Подробнее: XP Icons, Vista Icons. Иконки для Windows Vista/7 также называются иконками в стиле Aero.

Требования к иконкам

Иконки должны иметь четкие и понятные очертания, прозрачный фон. Более крупные иконки должны иметь большую детализацию, чем мелкие. Не следует пытаться сделать в 3d сложные иконки с размерами менее 24*24.

Освещение обычно направлено слева сверху.

Избегайте линий с небольшим наклоном. На них могут образоваться ступеньки.

Иконки должны хорошо смотреться на черном, белом, светло-сером фоне.

Далее на примерах показаны основные ошибки.

Четкость. Если высокодетализированный объект не получается отобразить в мелких масштабах — нужно отбросить детали.

Сглаживание. PNG формат должен иметь гладкие контуры.

Четкие линии. Вертикали, горизонтали обычно делаются без сглаживания.

Насыщенные цвета. Иконки не должны быть блеклыми.

Краевые эффекты. При уменьшение окружностей, касающихся края иконки, могут возникнут дефекты.

Оборванная тень. Тень должна помещаться в иконку целиком.

Цвет тени. Тень не должна быть белесой, она должна иметь черный оттенок. Должна постепенно исчезать.

Gif-файлы не должны иметь белесых пикселов на контуре

Ditheriring при создании gif файлов. Актуально для размеров крупнее 32*32.

Для создания gif-файлов крупнее 32*32 в фотошопе нужно использовать опции:

Программы.

Для объединения gif и png файлов в ico-файлы, для доводки иконок, для работы с icc-коллекциями файлов использовать программу IconLover. Либо программу Студия Иконок в случае проблем с английским языком.

Примеры иконок

Другой пример:

Статьи. Как делать иконки.

Copyright (C) 2000-2022 Aha-Soft.

Студия Иконок — русская версия популярного редактора иконок для Windows. Поддерживает множество графических форматов, работает с библиотеками иконок. Включает русский, английский, украинский и другие интерфейсы.

IconLover — эта программа для создания иконок позволяет редактировать все виды растровой графики, необходимые в цикле разработки программного обеспечения, включая иконки для Windows Vista и XP, кнопки, курсоры, тулбары, значки. Всё в одном приложении.

ArtCursors позволяет создавать, изменять, конвертировать курсоры и собирать их в библиотеки. Поддерживает статические и анимированные курсоры.

Icon to Any конвер- тирует иконки и курсоры в BMP, JPG, PNG, GIF, ICO, CUR и другие форматы. Этот мастер найдет вам иконки и сделает из них GIF изображения для использования на Web странице.

О формате ICO

Графический формат ICO применяется в Windows для системных значков, которыми тот или иной файл или формат файла обозначается в графическом интерфейсе. Обозначение ICO – сокращение от Icon (иконка, значок).

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

Формат ICO включает в себя не один файл значка, а целый набор. Дело в том, что в разных видах отображения показываются разные размерные варианты значка. Уменьшенный автоматически большой вариант может оказаться неразборчивым, а увеличенный маленький – размытым. Поэтому ICO – это файл, включающий в себя несколько размеров иконки.

Даже если размещать иконку на рабочем столе, при разном разрешении монитора одни и те же иконки могут казаться очень большими или недопустимо маленькими. При выборе оптимального стиля изображения Windows выбирает подходящие иконки из библиотеки.

Стандартная иконка имеет «квадратное» соотношение сторон. В файле ICO предполагаются следующие размеры: 16х16, 32х32 и 48х48 пикселей. Существуют и менее употребительные варианты, со стороной от 24 до 128 пикселей. Теоретически предельное допустимое значение стороны квадрата – 256 пикселей, однако на практике такие иконки употребляются редко. Некоторые файловые менеджеры способны масштабировать иконки (например, Total Commander). Пользователь компьютера обычно довольствуется стандартными иконками, которые поставляются с каждой программой. Но можно и украсить свой компьютер и упростить нахождение нужных файлов и папок, если сопоставить им отличающиеся иконки. Часто в файловых менеджерах есть собственный набор стандартных иконок, но можно и создать собственные.

Существует такая разновидность файла ICO, как Favicon. Она отображается в браузере как «иконка» веб-сайта. Для favicon установлен стандартный минимальный размер – 16х16 пикселей. Более подробно о иконке для сайта читайте в статье «Иконка сайта».

Конвертация

Бесплатный онлайн-конвертер поможет вам создать многовариантные иконки на основании ваших графических файлов. Убедитесь, что в вашем исходном файле выдерживается «квадратное» соотношение сторон. Если нет, его можно обрезать до нужного стандарта, размер изображения в этом случае не обязательно должен совпадать с размером желаемой иконки. Онлайн конвертер сам изменит размер по указанным настройкам.

Исходный файл может иметь практически любой формат (список поддерживаемых форматов). Рекомендуем позаботиться о том, чтобы исходный файл был максимально качественным. Это могут быть PSD, TIFF и другие файлы. Если ваша иконка – результат дизайнерских усилий в профессиональном графическом редакторе, рекомендуем использовать в качестве исходного файла непосредственно файл «родного» формата редактора.

Установите максимальное значение стороны иконки. Если вы её не установите, конвертер автоматически уменьшит файл до максимально допустимого значения – 256х256 пикселей.

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

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

Как создать иконки для приложений на Android и iOS

Приложения для Android разрабатываются с учетом размера устройства и разрешения экрана.

Графика и разметка в приложениях измеряются в единицах — DPI (количество точек на дюйм).

2. Категории DPI

• Low DPI (LDPI) = 120DPI
• Medium DPI (MDPI) = 160DPI
• High DPI (HDPI) = 240DPI (Nexus S, SGS2)
• Extra High DPI (XHDPI) = 320DPI (Galaxy Nexus, Nexus 4, SGS3)
• Extra Extra High DPI (XXHDPI) = 480DPI (HTC One и SGS4)

Размер и формат иконок запуска приложения (launcher icon) для Android

Иконка приложения должна разрабатываться специально для Android. Используйте инструкции по разработке иконок от Android в стиле Material Design, не подражайте визуальным элементам и стилям других платформ.

Иконка запуска приложения должна быть 32-битной, в формате PNGs с альфа-каналом (с прозрачным фоном).

Базовый размер — 48dp, с краями 1dp — для низкого разрешения. Чем выше плотность пикселей экрана (DPI), тем больше отображается деталей. Для остальных разрешений нужно увеличить масштаб на 400% 192 x 192 dp (с краями 4dp).

Хотите идеальную иконку для любого разрешения и не ищете легких путей? Сделайте несколько иконок разных размеров для всех вариантов разрешений, воспользовавшись таблицей ниже. Можно включить дополнительные значения для последовательного увеличения размеров. Например, иконки 96 x 96 пикселей xhdpi могут содержать промежуточный размер 88 x 88 пикселей с отступами в 4 пикселя с каждой стороны. Отступы образуют легкую тень и гарантируют четкость иконки на любом фоне.

Вы, конечно, помните: любое масштабирование должно сохранять пропорции изображения.

Иконки приложения для публикации на Google Play

Иконка приложения для публикации в Google Play должна быть 512 x 512 пикселей, с высоким разрешением.

Эта иконка используется только для Google Play и не заменяет иконку запуска приложения (launcher icon). Иконка публикации на Google Play должна содержать тот же контент, что и иконка запуска приложения, за исключением некоторых идентификационных знаков.

Раздел “Рекомендуемые”

В разделе «Рекомендуемые» можно продемонстрировать потенциальным пользователям графические возможности приложения.

Требования к иконке в разделе «Рекомендуемые» :

• JPEG или 24-битный PNG (без альфа-канала)
• 1024 х 500 пикселей

Расположение

Картинка для раздела «Рекомендуемые» располагается над сведениями о приложении в Play Маркете. Если загружен проморолик, поверх нее будет расположена кнопка «Воспроизвести».

• Не размещайте важную информацию по краям, особенно в нижней трети рамки.
• Логотип поместите по центру, выровняйте по горизонтали и вертикали.
• Для текста используйте крупный шрифт.
• Помните, что картинка может показываться отдельно, без иконки приложения.

Цели иконки приложения

У иконки приложения есть 3 основных цели:

1. Продвижение бренда, рассказ о цели приложения.
2. Помощь пользователю в поиске приложения в Google Play.
3. Функция запуска.

Продвижение бренда

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

Образцы иконок приложений.

Помогите пользователю найти приложение в Google Play

Иконка должна привлекать внимание пользователя во время скроллинга. Качественный дизайн иконки — однозначный сигнал, о том, что Ваше приложение такого же высокого качества.

Для разработки иконки приложения лучше обратиться к дизайнеру.

Правила дизайна иконки для Android

• Смотрится детально и четко в небольшом размере.
• Сочетается с любым фоном.
• Освещается верхней подсветкой.
• Может быть уникальной формы.
• Не является обрезанным вариантом большего изображения.
• Имеет одинаковый вес с другими иконками.

• Перспектива не противоречит другим иконкам.
• Располагается ее по ходу движения.
• Имеет небольшую глубину.

Слишком растянутые в длину иконки, занимающие мало пространства, не привлекают внимания пользователей и плохо сочетаются с различными фонами.

Правильно и неправильно

Детали слишком сложного значка плохо различаются в маленьком размере.

Обрезанный и глянцевый значок проигрывает такому же матовому и целому значку. Изображение не должно быть обрезанным, лучше использовать целое изображение уникальной формы. Избегайте глянца, если представленный объект сделан не из глянцевого материала.

Значок со слишком тонким контуром плохо выделяется среди других значков.

Создавайте иконки с альфа-каналом, иконки не должны занимать все пространство рамки. Тонкая визуальная обработка выделит иконку среди других.

Иконка для приложения на iOS

Размеры

У каждого приложения должна быть маленькая и большая иконка. Маленькая иконка используется на домашнем экране и в системе после установки. Большая иконка нужна для App Store.

Устройство или контекст

Размер иконки

iPhone 6s Plus и выше, iPhone 6 Plus и выше

180x180px

iPhone 6s и выше, iPhone 6 и выше, iPhone SE и выше

120x120px

iPad Pro

167x167px

iPad, iPad mini

152x152px

App Store

1024x1024px

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

Также маленькие иконки нужны для показа:

• в поиске Spotlight,
• в приложении настроек смартфона.

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

Устройство

Размер иконок в поиске Spotlight

Размер иконки настроек

iPhone 6s Plus и выше, iPhone 6 Plus и выше

120x120px

87x87px

iPhone 6s и выше, iPhone 6 и выше, iPhone SE и выше

80x80px

58x58px

iPad Pro, iPad, iPad mini

80x80px

58x58px

не добавляйте к иконке настроек наложение или границу. iOS автоматически добавляет отступ на 1 пиксель ко всем иконкам, чтобы они хорошо смотрелись на белом фоне в параметрах настройки.

Правила дизайна иконки для iOS:

Подкупающая простота

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

Четкий фокус

Создайте иконку с четким фокусом, который привлекает внимание и идентифицирует приложение.

Узнаваемость

Никто не будет анализировать иконку, чтобы понять ее значение.

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

Без прозрачности, простой фон

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

Без надписей

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

Без фото, скриншотов и элементов интерфейса

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

Без точных копий продуктов Apple

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

Не помещайте повсюду в интерфейсе иконку приложения

Пользователя может сбить с толку иконка приложения, встречающаяся повсюду в интерфейсе. Просто используйте цветовую схему иконки в интерфейсе. См. Цвет.

Протестируйте иконку на разных обоях

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

Сохраняйте углы иконки квадратными

Система округляет углы иконки автоматически.

Вот и все! Желаем удачи и много красивых иконок для ваших приложений.

какой формат картинок ярлыков на рабочем столе

Расширение ICO – формат изображения, используемый для хранения иконок в
программах Windows, файлах и папках; содержит два растровых изображения:
1) AND bitmap – маску изображения (которое определяет, какая часть
иконки прозрачная) и 2) XOR bitmap – содержит иконку, которая
накладывается на маску изображения, файлы ICO можно менять, чтобы
создавать собственные иконки. Иконки могут быть различных размеров
(16×16, 32×32, 64×64 пикселей и т. д. ) и содержать различное количество
цветов (16 цветов, 32, 64, 128, 256, 16-битный и т. д.)