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

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

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

Размеры иконки для приложения windows

И как сделать ICO файл с несколькими изображениями
Спрашивали, как надо правильно делать иконку для своего Windows-приложения.

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

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

То же самое касается и иконки для формы приложения, хотя на самой форме корректно будет отображаться и маленькая иконка 16×16 пикселей, при переключении по Alt+Tab уже будет заметно и некрасиво.

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

Еще момент — изображение должно, очевидно, быть квадратным.

Стандартные размеры иконок приложения

Нарисовали, теперь нужно получить несколько изображений стандартных размеров:

— 16×16
— 32×32
— 48×48
— 256×256

Где-то читал рекомендацию, что нужен значок еще 128×128, но на практике пока не заметил, чтобы его наличие было критично.
Для Windows 7 и выше обязательно нужен значок 48×48
Обратите внимание, что размер значка рабочего стола по умолчанию в XP был 32×32, а в Windows 7 — 48×48

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

Сборка нескольких изображений в одну иконку

Известно, что в одном файле ICO могут храниться несколько изображений разных размеров. Для сборки есть много приложений и онлайн-сервисов, но мы пользуемся простой бесплатной программкой icon sushi Копия

Пользоваться очень просто.
1. Открываем все нужные изображения
2. Выделяем их в окне программы:

3. Сохраняем иконку (File — Save as Multiple Icon)

ЗЫ. Чтоб два раза не вставать.
Кто-то просил картинки-кнопочки от XuliOrganizzer’а
Так Леша выложил картинки на Github

Размер иконок в режиме вида «Таблица»

Очень удобен вид отображения папок «Таблица», кратко содержащий основную информацию, но для людей с плохим зрением иконки слишком мелкие. С помощью какой программы можно поменять размер иконок, оставляя прежний режим просмотра папок «таблица»?

Масштабирование поможет:
1. Штатными средствами — Win+i → Персонализация → Система → Изменение параметров текста и других элементов выставить 125%. Недостаточно если, то на этой же страничке (Изменение параметров текста и других элементов выставить) нажать «Дополнительные изменения размера текста и других элементов», в открывшемся окне кликать «установить настраиваемый уровень масштабирования», «Масштаб от обычного размера» выставить 125%. Не исключено, цифра уже будет стоять. Тогда пробуйте больше. Но изменение масштабирования более 125% мне лично не понравился (тоже имею плохое зрение, но деньги считать могу).
2. Программа для масштабирования приведена на ветке форума: Размытость окон некоторых приложений в Windows 10. Называется Windows 10 DPI Fix, на данный момент версия 2.1, скачал на всякий случай, не тестил, масштабирование штатными средствами Windows устраивает.

Был ли этот ответ полезным?

К сожалению, это не помогло.

Отлично! Благодарим за отзыв.

Насколько Вы удовлетворены этим ответом?

Благодарим за отзыв, он поможет улучшить наш сайт.

Полное (я надеюсь) руководство по созданию набора плоских иконок

Для ботанов, которые прочли мою статью по визуальному весу и оптическому выравниванию. Минимум слов, максимум картинок.

(Мы продолжаем переводить цикл статей по визуальному дизайну. Полную подборку советов можно найти в коллекции « Основы дизайна»)

1. Пользуйтесь оптической сеткой

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

Интересуетесь свежими статьями по дизайну? Вступайте в группу на Facebook.

Ищите системное погружение в тему? Загляните в блог для дизайнеров.

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

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

Не становитесь рабом собственной сетки. Она должна помогать, а не ограничивать. Если какие-то элементы торчат и иконка при этом выглядит круто — то пусть себе торчат!

2. Помните о пиксельной сетке

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

Если использовать границу шириной в 1 пиксель, ее нужно выровнять либо по внутренней стороне, либо по внешней — но не по центру.

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

Устанавливайте начальные и конечные точки диагоналей в соответствии с сеткой. Диагонали с углами 45°, 30° и 60° выглядят четче, чем диагонали в нестандартными углами (к примеру, 13.7° или 81°).

3. Придерживайтесь определенной детализации

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

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

4. Следите за размерами промежутков

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

Для контурных иконок, минимальный размер промежутка должен равняться толщине линии. Линии нужно либо явно отделить, либо аккуратно соединить — почти соединенных линий быть не должно.

5. Уберите повторяющиеся детали

В наборах иконок часто бывают повторяющиеся детали. Лучше их убрать, чтобы сделать упор не на сходства, а на различия иконок. Это как сокращение дробей. Чем меньше графического шума — тем проще понять суть.

Если целевой пользователь понимает, с чем он или она имеет дело, не нужно повторять это снова и снова. К примеру, в почтовом приложении не нужно постоянно использовать иконку письма.

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

6. Выберите единый стиль и придерживайтесь его

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

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

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

7. Используйте размеры, кратные двум

В большинстве интерфейсов используется 8-пиксельная сетка и 12-колоночный лейаут, поскольку они более гибкие, чем те, что построены на десятичных размерах. 12 можно разделить на 2,3,4 и 6. Поэтому 24-х и 48-пиксельные размеры иконок уже стали стандартом. Такие иконки при необходимости легко можно масштабировать.

8. Следите за точностью и чистотой силуэтов

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

Та же история с бесящими размерами: “8.999 px” или “100.001 px”. Если расставить опорные точки правильно, края иконки будут четкими. Если впоследствии вам придется объединять фигуры, у вас не будет лишних опорных точек и пробелов.

9. Очищайте SVG-файлы от мусора

Многие редакторы (например, Sketch) сохраняют SVG-файлы с артефактами — ненужными группами, цветовыми слоями и масками. Давайте посмотрим. В Sketch все выглядит хорошо:

Открываем SVG в другом редакторе (например, в Adobe Illustrator) и видим пустые слои, ненужные группы и даже маски. Из-за этих лишних штук может быть куча проблем — например, при создании шрифтовых иконок или при добавлении SVG на веб-страницу.

Весь этот мусор нужно удалить.

Вы увидите, что у SVG из Sketch ( picture.svg) и SVG, отредактированной в иллюстраторе ( picture_new.svg), будут разные превьюшки в файловом менеджере.

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

Если вам понравилась статья и перевод, дайте нам знать — нажмите 👏 (можно “хлопать” несколько раз!)

А если у вас есть на примете какая-нибудь классная статья по UX и не только — скиньте нам ссылку, и мы будем рады над ней поработать.

Мобильное приложение «Заметки о психике» | Mental Notes

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

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

Видеокурсы и практика по дизайну интерактивных систем: ux/ui, веб-дизайн и бренд-дизайн

Вас ждет плотная проектная практика по анимации интерфейсов, дизайну сайтов, а также мобильных и веб-приложений. Под руководством наставников в стиле «смотри и повторяй»!

Breezzly — это среда для тренировки digital-навыков. Здесь вы встретите комплекты видеокурсов в актуальных инструментах интерактивного дизайна, среди них Figma, Principle и Invision Studio. А каждый проект — это живой кейс с историей, собранной по горячим следам!

Вам также может понравиться

Windows или Linux: Что лучше выбрать?

Есть много причин выбирать между Windows и Linux, но

Файл владелец изменить linux

Команда Chown в Linux Chown Command in Linux (File

Установка шлюза по умолчанию linux

Настройка сети вручную Содержание Краткое описание

Чем разбить диск для linux

ИТ База знаний Курс по Asterisk Полезно — Узнать IP —