Приложения иконка: Бесплатные векторные иконки — скачивайте 179,800 иконок (SVG, PNG)

Разное 

Содержание

Значок для приложения: как создать, технические характеристики, аспекты дизайна

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

  1. Что такое значок приложения
  2. Технические характеристики иконок для Android и iOS
  3. Топ-пять аспектов дизайна иконок
  4. Три способа создать иконку
  5. Заключение

Что такое значок приложения

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

По статистике 70% мобильных приложений загружаются после поиска в App Store или Google Play (остальные — в результате рекламных кампаний, промо в соцсетях, обзоров и т. д.). Поэтому ваша задача — создать дизайн, который мгновенно привлечет внимание и вызовет желание узнать, что стоит за визуальным образом.

Технические характеристики иконок для Android и iOS

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


Google Play Store (Android)
App Store (iOS

Размер
512 px × 512 px

  • iPhone: 180px × 180px (60pt × 60pt @3x), 120px × 120px (60pt × 60pt @2x)

  • iPad Pro: 167px × 167px (83,5pt × 83,5pt @2x)

  • iPad, iPad mini: 152px × 152px (76pt × 76pt @2x)

  • App Store: 1024px × 1024px (1024pt × 1024pt @1x)

Формат
32-разрядный PNG
PNG

Цветовое пространство
sRGB
sRGB или P3

Форма
Полный квадрат. Google Play автоматически скругляет углы (радиус скругления — 20% от размера) и добавляет тени
Квадрат без закругленных углов и теней

Топ-пять аспектов дизайна иконок

21% миллениалов удаляют мобильное приложение, если им не нравится, как иконка выглядит на экране. Поэтому важно продумать не только функциональность, но и эстетическую составляющую.

1. Простота

Лаконичность — это ключ к удачному дизайну. Вот какие нюансы нужно учесть:

  • Отсекайте лишнее. Чем больше деталей — тем сложнее будет распознать и запомнить изображение, а также масштабировать его. Помните, что иконка должна быть хорошо различима в разных размерах: в магазине приложений, меню телефона и на панели настроек.
  • Используйте символику. Сфокусируйтесь на одном узнаваемом элементе, как сделали Pinterest (кнопка), Snapchat (привидение) или Instagram (камера). В качестве иконки может выступать главный визуальный символ бренда — логотип, если он отвечает принципам минимализма.
  • Лайфхак: изучите значки ваших любимых приложений и проанализируйте, какие символы использованы в их разработке.

2. Цвет

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

  • Используйте не больше двух-трех цветов, как большинство популярных компаний, например, Airbnb, Pandora или Dropbox. Большое количество оттенков будет сливаться в одно нечеткое пятно.
  • Берите пример с топ-брендов. Исследование показало, что чаще всего они выбирают для графики синий цвет (Google Calendar, Safari, Twitter, LinkedIn). Второе и третье места делят красный и белый, причем красный чаще всего используют бренды, связанные с едой и напитками.
  • Убедитесь, что выбранные цвета соответствуют вашему бизнесу, привлекают целевую аудиторию и согласуются с остальными элементами фирменного стиля.
  • Проверьте, как значок смотрится на разных фонах — цветном, черном и белом.

3.

Согласованность

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

  • Используйте один язык дизайна: цветовую палитру, стиль и приемы. В вашем приложении присутствует градиент, необычная геометрия или ретро-стиль? Примените их и в иконке.
  • Если у вас несколько приложений, оформите их в едином стиле, как сделал Adobe для своих продуктов: Photoshop Sketch, Illustrator Draw, Lightroom, Skan и других.
  • Привяжите символику к функциональности приложения, чтобы пользователь с первого взгляда понял, о чем ваш продукт. К примеру, винный рейтинг Vivino использует виноградную гроздь, а музыкальный сервис Spotify — символ громкости динамика.

4. Лишние элементы

Длинные надписи и фотографии — ненужные элементы на маленьком значке. Они рассеивают внимание пользователей и затрудняют восприятие.

  • Люди воспринимают изображения в 60 тысяч раз быстрее, чем слова, а при выборе приложения скорость может иметь решающее значение.
  • Помните: если вам приходится использовать слова, значит, вы не исчерпали весь потенциал визуальных образов. Подбирайте метафоры к вашему бизнесу, пока не найдете подходящий символ.
  • Исключения — короткие названия брендов (BBC News, Uber) или использование первой буквы («F» у Facebook и Foursquare).
  • Тот же принцип работает и с фотографиями, детали на которых будут неразличимы в маленьком разрешении. Если у вас есть любимый снимок, который характеризует бизнес, используйте для брендинга его элементы, создав из них векторное изображение.

5. Уникальность

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

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

Source: by Ramotion

Бонусные советы:

  • Проведите A/B-тестирование. Если не можете выбрать между двумя вариантами иконок, перед запуском организуйте маркетинговое исследование. A/B-тестирование — это метод, который позволяет запустить в работу оба варианта одновременно и сравнить, какой из них эффективнее.
  • Учитывайте сезонность. Подумайте, как вы можете «оживлять» иконку к праздникам или громким событиям: Рождеству, «черной пятнице» или Хэллоуину. Это может быть изменение цвета или добавление небольшого характерного элемента.
  • Следите за трендами. Соблюдайте грань между слепой погоней за модой и актуальностью. Не нужно обновлять иконку каждый сезон, но следить за глобальными трендами стоит. Например, если все конкуренты уже перешли на модную плоскую графику, а вы до сих пор используете 3D-эффект, значит, пора сменить значок.

Source: by Jakub Kuik

Три способа создать иконку

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

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

2. Онлайн-сервисы:

  • Logaster. Онлайн-генератор создаст логотип, который вы можете кастомизировать и скачать бесплатно в небольшом размере, подходящем для иконки мобильного приложения.
  • Canva. Бесплатный редактор с тысячами шаблонов графики и возможностью персональной адаптации.   
  • Iconsflow. Сервис с более чем 200 тысяч значков: просто выберите подходящий, измените цвет, размер и добавьте эффекты.
  • Appicon. Этот редактор адаптирует готовое изображение под размеры иконок для iOS и Android.

Мечтаете о собственном лого?

Введите название компании в поле ниже и наш генератор предложит вам лучшие дизайны!

3. Дизайнер. Если вам недостает опыта, но вы готовы выделить бюджет на брендинг, наймите графического дизайнера, который специализируется на иконках приложений: обратитесь на биржи (Upwork, Fiverr), попросите рекомендаций у знакомых или поищите в соцсетях.

Заключение

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

  • Позаботьтесь о простоте, узнаваемости и уникальности.
  • Следите за трендами, чтобы оставаться актуальным.
  • Учитесь у топ-брендов. Например, из этого списка самых популярных мобильных приложений 2019 года:
  1. Facebook Messenger
  2. Facebook
  3. WhatsApp
  4. TikTok
  5. Instagram
  6. SHAREit
  7. Likee
  8. Snapchat
  9. Netflix
  10. Spotify

Редактор блога компании Logaster, контент-маркетолог. Эксперт по веб-маркетингу и брендированию. Умеет писать просто о сложном. По ее статьям можно построить успешный бренд и начать успешное продвижение в интернете.

14 советов по дизайну иконок для мобильных приложений, которые следует соблюдать

Иконка мобильного приложения — это небольшая картинка, представляющая приложение на маркете, таком как Google Play или App Store, и устройстве пользователя. Если вскоре вам предстоит создать свой первый дизайн иконки мобильного приложения, прислушайтесь к этим советам. Они помогут вам избежать ошибок, которые подстерегают новичков.

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

Поэтому примите во внимание следующие советы по созданию дизайна иконки для приложения:

1.

Соблюдайте требования руководств

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

Вот руководства, с которых стоит начать:

  1. Официальный сайт, посвященный Material Design для Android. Здесь можно прочитать о стиле, анимации, компонентах, паттернах, макетах и юзабилити, а также скачать материалы в помощь дизайнеру.
  2. Руководства по iOS Human Interface от Apple пригодятся, если вы хотите создать иконку для iPad или iPhone.

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

2. Знайте свою аудиторию

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

3. Создавайте иконку в нужном размере

То, что выглядит хорошо, занимая лист A4, не обязательно «выстрелит» в размере 120 x 120 пикселей. Профессиональный дизайн иконки должен это учитывать.

4. Упрощайте и не перегружайте иконку лишними деталями

Минимализм — ваш лучший друг. Чем больше украшательств и деталей на иконке, тем ниже ее узнаваемость. Иконка должна быть чем-то вроде символа — достаточно простой и понятной. Например, вот иконка, которую мы сделали для приложения с рецептами Кукорама:

5. Правильно расставляйте свет и тени

Этот совет актуален, если вы делаете иконку для Android-приложения. Руководство по Android Material подробно рассказывает об этом аспекте. В нем также приведены значения для теней, отбрасываемых иконкой того или иного цвета.

6. Проверьте, как выглядит иконка на фоне другого цвета (темном, светлом, цветном)

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

7. Не бойтесь использовать перспективу

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

8. Создайте интересную форму

Иконки ниже запоминаются благодаря использованным на них формах:

Форма помогает распознать иконку даже если она очень маленького размера.

9. Ответственно подойдите к цвету

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

10.

Не используйте фотографии

Существуют замечательные фотореалистичные иконки, но использование фотографий — это табу.

11. Создавайте иконки приложений без лишнего текста

Мелкий текст тяжело читать, и его использование создаст проблемы в случае локализации, если, например, приложение выйдет для китайского рынка. При этом вы можете использовать первые одну–две буквы из названия компании, как это делают Tumblr или Pinterest:

12. Не используйте на иконке элементы из интерфейса приложения

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

13. Создавайте иконки, которые говорят о главной функции приложения

С хорошей иконкой пользователю даже не придется заглядывать в описание: для плееров обычно используют ноты, инструменты или визуалайзер, для камер — изображения фотоаппарата или объектива, а для мессенджеров вроде Viber — облачка сообщений:

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

14. Изучите иконки конкурентов

Несмотря на предыдущий совет, взгляните на иконки конкурентов — скорее всего, они уже как-то обыграли главную функцию приложения. Поэтому попробуйте не повторяться. Например, иконка Wunderlist выгодно отличается от иконок других приложений со списками дел:

А вот иконка, которую мы создали для приложения KeepSnap, которое ориентировано на фотографов:

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

Смена иконки — это тоже не шутки. Например, владельцам Radium, приложения-агрегатора радиостанций, пришлось менять иконку несколько раз за месяц, потому что она не пришлась по вкусу пользователям.

Мы, студия stfalcon.com, с удовольствием создадим иконку для вашего приложения, которая будет выгодно отличать его от продукции конкурентов.

Что происходит? Все меняют иконки приложений в iOS 14, и вы тоже можете

Вместе с iOS 14 Apple добавила новые возможности кастомизации рабочего стола для iPhone. И я сейчас говорю не только про виджеты и библиотеку приложений — теперь любой может за несколько кликов поменять иконку приложения на iPhone. Причем для этого не нужно ничего скачивать, все можно сделать с помощью приложения «Команды». Помимо возможности генерировать собственные команды, приложение по умолчанию содержит более 300 встроенных действий и поддерживает многие программы для iOS. Сейчас расскажу, как поменять иконку приложения на iPhone.

Сеть охватил настоящий флешмоб — все меняют себе иконки в iOS 14

Как поменять иконку приложения на iPhone

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

  1. Откройте приложение «Быстрые команды». Если его у вас нет, восстановите его из App Store. Нажмите на плюсик в правом верхнем углу и выберите «Добавить действие».

    2. Создайте новую команду

  2. На следующем этапе воспользуйтесь поиском и введите «Открыть приложение». Нажмите на это действие, откроется список всех ваших приложений. Выберите нужное — в нашем случае AppleInsider.ru.

    3. Выберите любое приложение из списка

  3. Затем введите название для своей новой команды и нажмите «Добавить на экран Домой». Вам будет предложено изменить имя приложения и его иконку — нажмите на ее и выберите «Выбрать фото».

    4. Добавьте команду на рабочий стол, поменяйте иконку

  4. Выберите фото или картинку из своей галереи и добавьте ее к своей иконке. После нажатия на кнопку «Добавить» она появится на вашем рабочем столе!

Осталось дать иконке название и добавить ее на рабочий стол!

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

Поменять рабочий стол в iOS 14

Тем не менее многих пользователей это не останавливает — вот что вытворяют некоторые со своими рабочими столами. Как вы считаете, это красиво? Поделитесь мнением в комментариях и в нашем чате в Telegram.

Иногда доходит до абсурда

Помимо вышеупомянутого способа с приложением «Команды» для кастомизации иконок, они также пользуются приложениями со сторонними виджетами вроде Widgetsmith. С его помощью можно создавать свои виджеты с разными цветами, шрифтами и оформлением.

Widgetsmith позволяет делать собственные виджеты

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

Ну такое…

Еще несколько приложений со сторонними виджетами:

  1. Color Widgets — для создания собственных виджетов;

    2. Color Widgets тоже позволяет создавать новые виджеты

  2. Coinbase — финансовые виджеты;

    3. Крутая штука для мониторинга курсов разных валют

  3. Night Sky — красивые погодные виджеты.

Зачем нужны быстрые команды в iOS

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

В iOS 14 «Быстрые команды» обзавелись дополнительными триггерами, провоцирующими включение в зависимости от наступления определенных событий, например, при достижении аккумулятором определённого уровня заряда. То есть, если iPhone разрядился ниже заданных пределов, можно настроить автоматическую активацию режима энергосбережения.

В новом Instagram можно менять иконку приложения — вот как это сделать

После выхода iOS 14 многие пользователи начали менять иконки приложений на своих iPhone, поскольку соответствующая функция появилась прямо в приложении «Команды». И хотя она позволяет сделать уникальный рабочий стол (если еще и с виджетами вроде Widgetsmith — вообще пушка), смена иконок таким образом работает не слишком удобно. При запуске приложения с другой иконкой сначала открывается утилита «Команды», пусть и на пару секунд, а уже потом само приложение. Однако некоторые разработчики предусмотрели возможность изменить иконку приложения прямо в его настройках — например, как это сделали в Instagram ко дню рождения сервиса.

Скучали по этой иконке? Теперь вы можете ее вернуть

Для всех своих пользователей Instagram запрятал небольшую «пасхалку» в свежем обновлении своего приложения. Теперь в настройках программы можно сменить иконку! Это может быть классическая иконка Instagram из 2010 года или слегка обновленная ее версия 2011 года (таким это приложение помнят немногие). Кроме того, Instagram открыл доступ к нескольким кастомным иконкам, в том числе той, которая была на предварительном запуске приложения. Тогда его, между прочим, еще даже не было в App Store.

Как сменить иконку Instagram

  1. Обновите приложение Instagram до последней версии.
  2. Подпишитесь на наш Instagram (это не обязательно, но нам будет приятно).
  3. Откройте свой профиль — зайдите в Настройки.
  4. Как можно сильнее потяните меню настроек вниз, следуя указателям эмодзи.

    5. Сильно потяните вниз для открытия скрытого меню

  5. Вам откроется доступ к секретному меню, где можно выбрать другую иконку приложения Instagram.

Иконка меняется за секунду и без приложения «Команды»

К сожалению, сменить иконку можно только на месяц — потом она автоматически сменится на актуальную, которая впервые появилась 11 мая 2016 года. Тем не менее раз Apple пропустила данное обновление Instagram в App Store, возможно, эта функциональность останется подольше. При этом по правилам магазина приложений в программе не должно быть скрытых меню.

А пока можете подписаться на наш Тикток, там мы часто публикуем такие лайфхаки.

Стоит отметить, что Instagram — далеко не первое приложение, где с помощью настроек можно изменить иконку. Возможность изменить иконку в Telegram появилась еще в 2019 году. Сначала она не входила в число официальных функций мессенджера. Более того, разработчики специально скрыли ее от рядовых пользователей, превратив в своего рода пасхалку, которую быстро раскрыли в нашем чате в Telegram, для наиболее активных и интересующихся (так же, как Instagram сейчас). Но с выходом Telegram версии 5.8 для iOS возможность смены иконок появилась официально.

Как сменить иконку Telegram

  1. Чтобы изменить иконку Telegram на iOS, откройте одноименное приложение;
  2. Перейдите в «Настройки» — «Оформление» — «Иконка приложения»;

    3. Выберите одну из иконок в Настройках

  3. На открывшейся странице выберите одну из шести пиктограмм, которая вам больше нравится;

    4. Можно выбрать одну из 6 иконок

  4. Подтвердите смену иконки нажатием на клавишу ОК, которая появится в диалоговом окне.

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

Ну что, какая иконка Instagram вам нравится больше всего? Поставили себе? Расскажите в комментариях.

10 простых, но красивых иконок приложений для iOS 11

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

С другой стороны, иконки приложений для iOS далеки от графически интенсивных решений, которые были стандартами в App Store. Так же, как и в оформлении, сейчас происходит сдвиг в торону чистых линий и в иконках приложений. Ранее мы видели всё, начиная с реалистичных 3D макетов фотоаппарата до тяжеловесных иллюстраций.

В этой статье мы рассмотрим вдохновляющую подборку из 10 простых и красивых иконок для iOS 11.

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

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

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

Иконка для iOS приложения sqAR является невероятно уникальной и объединяет в себе некоторые очаровательные маленькие детали. Графический товарный знак очень контрастный, а общий визуальный ряд является сдержанным, но привлекательным.

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

Объединяя некоторые притягивающие внимание градиенты, иконка VideoFix является ненавязчивой, но обладает какой-то глубиной и индивидуальностью.

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

Дизайн иконки Cryptonaut является простым, но идеально выполненным. Очерченные формы создают контраст и формируют узнаваемый и уникальный стиль.

Иконки приложения Flinto

Иконки Finto являются простыми по форме, с некоторыми тонкими и точно выполненными деталями, включающими в себя обводку и лёгкие градиенты для создания эффекта глубины.

Иконка iOS приложения Daily UI #6

Цветовая палитра этой иконки мгновенно делает её уникальной. Она добавляет идеальное количество глубины и теней в простую конструкцию глифа.

Иконка для Brush

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

Иконка мобильного приложения Tenory

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

Приложение для будущих мам Moms to be

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

Иконка для приложения Monkey.Cool

В дизайне этой иконки используются плоские, закруглённые формы для создания уникального образа. Цвета и различный фон выглядят впечатляюще, но в то же время остаются простыми и сообразными стилю iOS 11.

Счетчик на иконке приложения — Документация Webasyst

Иконка приложения в главном меню (которое обычно формируется с помощью метода {$wa->apps()}), может отображать индикатор красного цвета с краткой информацией для пользователя, требующей срочного внимания, например, количество новых заказов в интернет-магазине или комментариев в блоге. На рисунке показано, как может выглядеть такой индикатор:

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

wa-apps/[app_id]/lib/config/[app_id]Config.class.php с классом [app_id]Config, унаследованным от системного класса waAppConfig и реализующим метод onCount(), как показано ниже:

<?php

class myappConfig extends waAppConfig
{

    public function onCount()
    {
        ...
        return $value;
    }
    
}

Значение, возвращаемое методом onCount(), отобразится на индикаторе. При реализации метода следует учитывать, что он автоматически вызывается каждую минуту. Если индикатор нужно скрыть при каких-либо условиях, то в этом случае метод должен вернуть пустое значение.

Изменение ссылки иконки приложения

Помимо отображения индикатора, с помощью метода onCount() также можно изменять адрес ссылки, которой является иконка приложения в главном меню. Например, в приложении «Блог» при появлении новых комментариев (если настроено соответствующее уведомление) ссылка иконки «Блога» указывает на список комментариев; в противном случае ссылка открывает список постов. Таким же образом вы можете динамически изменять URL ссылки своего приложения. Для этого метод onCount() должен возвращать ассоциативный массив со следующими элементами:

array(
   'count' => $value, //значение для отображения в индикаторе
   'url' => $url, //URL ссылки для иконки приложения
)
Метод onCount() можно также использовать для выполнения каких-либо операций один раз в минуту — без отображения индикатора. В этом случае метод просто не должен возвращать никакого значения.

Принципы использования иконок в android приложениях — Fandroid.info

Иконка это графическое изображение, которое занимает небольшую часть экрана и обеспечивает быстрый, интуитивно понятное представление действия, статуса, или приложения. При проектировании иконки для вашего приложения, важно иметь в виду, что ваше приложение может быть установлено на различных устройствах, которые предлагают диапазон плотностей пикселей, как описано в статье Поддержка разных разрешений экрана в android приложениях. Но вы можете заставить ваши иконки отлично смотреться на всех устройствах, предоставляя каждый значок в нескольких размерах. Когда ваше приложение работает, Android проверяет характеристики экрана устройства и загружает ресурсы для вашего приложения соответствующие плотности экрана.Т.к. вы будете поставлять каждый значок в нескольких размерах, чтобы поддержать различные плотности, руководство дизайна приведенное ниже опирается на размеры иконок в независимых от плотности пикселях ( dp ), которые основаны на размерах в пикселях экрана средней плотности (MDPI).Таким образом, чтобы создать иконку для различных плотностей, вы должны следовать отношению масштабирования 2:3:4:6:8 между пятью главными плотностями (medium, high, x-high, xx-high, и xxx-high соответственно). Например, предположим, что размер для значка запуска должен быть 48×48 dp. Это означает, что базовой плотности (MDPI) размер будет 48×48 px (пикселей), и высокой плотности (HDPI) размер должен быть 1.5x от базового — 72×72 точек, и x-high плотности (XHDPI) размер должен быть 2x от базового — 96×96 точек, и т.д..

Примечание: Android также поддерживает экраны низкой плотности (LDPI), но вам обычно не нужно создавать собственные наборы для таких размеров, потому что Android эффективно уменьшает ресурсы HDPI на 1/2, чтобы соответствовать ожидаемому размеру.

Запуск

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

Размеры и масштаб
  • Иконки запуска на мобильном устройстве должны быть 48×48 dp.
  • Иконки запуска для отображения на Google Play должны быть 512×512 точек.
Пропорции
  • Полный набор, 48×48 dp
Стиль

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

Панель действий

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

Предустановленные символы должны использоваться для некоторых общих действий, таких как «обновить» и «поделиться». Ссылка для скачивания ниже предоставляет пакет с иконками, которые отмасштабированы для различных плотностей экрана, и подходят для использования с темами Holo Light и Holo Dark. Пакет также включает в себя иконоки без стилей, которые можно изменять в соответствии с вашей темой, в дополнение к исходным файлам Adobe® Illustrator® для дальнейшего изменения.

Скачать набор иконок для панели действий

Размеры и масштаб
  • Иконки панели действий для телефонов должны быть 32×32 dp.
Основная область и пропорции
  • Полный набор, 32×32 dpВидимый квадрат, 24×24 dp
Стиль

Пиктографический, плоский, не слишком подробный, с плавными изгибами или острыми формами. Если графика тонкая, поверните её на 45° влево или вправо, чтобы заполнить фокусное пространство. Толщина штрихов и негативных пространств должна быть не менее 2 dp.

Цвета

Цвета: #333333
Доступный: 60%непрозрачности
Недоступный: 30%непрозрачности

Цвета: #FFFFFF
Доступный: 80%непрозрачности
Недоступный: 30%непрозрачности

Маленькие / Контекстные иконки

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

Размеры и масштаб
  • Маленькие значки должны быть 16×16 dp.
Основная область и пропорции
  • Полный набор, 16×16 dpВидимый квадрат, 12×12 dp
Стиль

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

Цвета

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

Значки уведомлений

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

Размеры и масштаб
  • Значки уведомлений должны быть 24×24 dp.
Основная область и пропорции
  • Полный набор, 24×24 dpВидимый квадрат, 22×22 dp
Стиль

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

Цвета

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

Советы по проектированию

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

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

Многие программы редактирования изображений, такие как Adobe® Photoshop® позволяют использовать комбинацию векторных форм и растровых слоев и эффектов. Когда это возможно, используйте векторные фигуры, так что если возникнет такая необходимость, наборы могут быть увеличены без потери детализации и четкости краёв.

Использование векторов также позволяет легко выровнять края и углы с пиксельным границам на меньших разрешениях.

Начните с большими размеров

Т.к. вам нужно будет создать наборы для различных плотностей экрана, то лучше начать с дизайна значков больших размеров, кратных размерам целевых значков. Например, иконки запуска 48, 72, 96 или 144 точек в ширину, в зависимости от плотности экрана (mdpi, hdpi, xhdpi, и xxhdpi, соответственно). Если вы изначально нарисовали иконки запуска размером 864×864точек, вам будет проще подгонять иконки, когда вы будете масштабировать к целевым размерам для создания окончательного набора.

При масштабировании, перерисуйте растровые слои по мере необходимости

Если вы масштабируете вверх изображение растрового слоя, а не векторного, то эти слои должны быть перерисованы вручную, что бы быть четкими при более высоких плотностях. Например, если круг 60×60 был нарисован как растровое изображение для mdpi он должен быть перерисован в круг 90×90 для hdpi.

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

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

Тип набораПрефиксПример
Иконкиic_ic_star.png
Иконки запускаic_launcheric_launcher_calendar.png
Значки меню и иконки панели действийic_menuic_menu_archive.png
Значки панели состоянияic_stat_notifyic_stat_notify_msg.png
Иконки вкладокic_tabic_tab_recent.png
Иконки диалоговic_dialogic_dialog_info.png

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

Настройка рабочего пространства, которое организует файлы по плотности

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

art/…     mdpi/…         _pre_production/…             working_file.psd         finished_asset.png     hdpi/…         _pre_production/…             working_file.psd         finished_asset.png     xhdpi/…         _pre_production/…             working_file.psd         finished_asset.png

art/…

    mdpi/…

        _pre_production/…

            working_file.psd

        finished_asset.png

    hdpi/…

        _pre_production/…

            working_file.psd

        finished_asset.png

    xhdpi/…

        _pre_production/…

            working_file.psd

        finished_asset.png

 

xxhdpi/… _pre_production/… working_file.psd finished_asset.pngПоскольку структура вашего рабочего пространства похожа на структуру приложения, вы можете быстро определить, какие наборы должны быть скопированы в каждый каталог ресурсов. Разделение наборов по плотности также поможет вам обнаружить любые отклонения в именах файлов, которые важны поскольку соответствующие наборы для различных плотностей должны иметь одни и те же имя файлов.

Для сравнения, вот структура каталога ресурсов типичного приложения:

res/…     drawable-ldpi/…         finished_asset.png     drawable-mdpi/…         finished_asset.png     drawable-hdpi/…         finished_asset.png     drawable-xhdpi/…         finished_asset.png

res/…

    drawable-ldpi/…

        finished_asset.png

    drawable-mdpi/…

        finished_asset.png

    drawable-hdpi/…

        finished_asset.png

    drawable-xhdpi/…

        finished_asset.png

 

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

Удалите ненужные метаданные из конечных наборов

Хотя инструменты SDK Android автоматически сжимают PNG файлы при упаковке ресурсов приложения в пакет установки, хорошая практика заключается в удалении ненужных заголовков и метаданных из ваших PNG наборов. Такие инструменты, как OptiPNG или Pngcrush могут гарантировать, что эти метаданные удалятся и, что размеры файлов ваших наборов изображений будет оптимизированы.

Читайте также: Курс для начинающих разработчиков Android приложений

Пример значка приложения | Qt 4.8

Создание значка для Maemo

Maemo ожидает, что значок приложения будет файлом изображения PNG 64×64. Имя файла значка должно быть таким же, как у исполняемого файла с расширением .png . Вам также понадобится файл .desktop , который дает диспетчеру окон подсказки о приложении, такие как имя, тип и значок.

 [Desktop Entry]
Кодировка = UTF-8
Версия = 1.0
Тип = Приложение
Терминал = ложь
Name = Значок приложения
Exec = / opt / usr / bin / applicationicon
Значок = значок приложения
X-Window-Icon =
X-HildonDesk-ShowInToolbar = true
X-Osso-Type = приложение / x-исполняемый файл

Поле Icon также должно содержать имя исполняемого файла.На устройстве значки приложений хранятся в каталоге / usr / share / icons / hicolor / 64x64 / apps , а файлы рабочего стола — в каталоге / usr / share / applications / hildon .

Создание иконки для Symbian

Symbian использует масштабируемую векторную графику (SVG Tiny 1.1+) для отображения значков приложений в меню приложений. Поэтому значки можно создавать вручную с помощью текстового редактора, поскольку файлы SVG представляют собой простой текст с синтаксисом XML, но обычно вы должны использовать программу векторной графики, которая может выводить файлы SVG.Популярные графические программы, такие как Adobe Illustrator или Inkscape, могут это сделать.

Для достижения наилучших результатов значок следует создавать на холсте размером 44×44 пикселей. В противном случае изображение может измениться неожиданным образом.

Создав значок, убедитесь, что он хранится в соответствии со стандартом SVG-Tiny 1.1+. Inkscape, например, не может сохранять изображения таким образом, но есть инструменты, которые могут конвертировать обычные файлы SVG в формат Tiny. Например, инструмент svg2svgt, который входит в комплект SDK для Symbian 3rd и 5th editon в папке s60tools, может в некоторой степени выполнить это преобразование.Еще один инструмент для преобразования SVG в SVG Tiny — SVG Pony.

Добавление иконок в проект

Отредактируйте файл .pro и укажите переменную ICON для цели Symbian. Для Maemo нам нужно добавить, что должны быть установлены .desktop и файл значков.

 QT + = основной графический интерфейс

TARGET = значок приложения
ШАБЛОН = приложение

ИСТОЧНИКИ + = main.cpp

ДРУГИЕ_ФАЙЛЫ + = applicationicon.svg \
               applicationicon.png \
               applicationicon.desktop

Symbian {
    include ($$ QT_SOURCE_TREE / examples / symbianpkgrules.pri)
    # значок переопределения
    ICON = applicationicon.svg
    TARGET.UID3 = 0xe9f919ee
    TARGET.EPOCSTACKSIZE = 0x14000
    TARGET.EPOCHEAPSIZE = 0x020000 0x800000
}

maemo5 {
    включить ($$ QT_SOURCE_TREE / examples / maemo5pkgrules.pri)

    # значок переопределения из maemo5pkgrules.pri
    icon.files = $$ {TARGET} .png
}
Symbian: предупреждение (этот пример может не полностью работать на платформе Symbian)
maemo5: предупреждение (этот пример может не полностью работать на платформе Maemo)
simulator: предупреждение (этот пример может не полностью работать на платформе Simulator)

В настоящее время Qt Creator не включает файлы значков и рабочего стола в пакет приложения для Maemo, а только исполняемый файл.В качестве обходного пути можно добавить файлы вручную на вкладке «Проекты». На этапе сборки «Создать пакет» для цели Maemo можно добавить файл .desktop и значок, которые будут частью содержимого пакета. К сожалению, эти дополнения хранятся только как часть файла .pro.user . Эта проблема будет решена в следующем выпуске Qt Creator.

Файлы:

Значок приложения

для приложений Xamarin.Mac — Xamarin

  • 3 минуты на чтение

В этой статье

В этой статье рассматривается создание образов, необходимых для приложения Xamarin.Значок приложения Mac, объединение изображений в файл .icns и включение значка в проект Xamarin.Mac.

Обзор

При работе с C # и .NET в приложении Xamarin.Mac разработчик имеет доступ к тем же инструментам Image и Icon, что и разработчик, работающий в Objective-C и Xcode .

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

Значок приложения

Отличный значок должен отражать основную цель приложения Xamarin.Mac и давать подсказки о том, какого опыта пользователь должен ожидать при использовании приложения. Каждое приложение macOS должно включать значок нескольких размеров для отображения в Finder, Dock, Launchpad и других местах на компьютере.

Разработка иконы

Apple предлагает следующие советы при разработке значка приложения:

  • Подумайте о том, чтобы придать иконке реалистичную и уникальную форму.
  • Если у приложения macOS есть аналог для iOS, не используйте повторно значок приложения iOS.
  • Используйте универсальные образы, которые люди легко узнают.
  • Стремитесь к простоте.
  • Используйте цвет и тень экономно, чтобы значок рассказал историю приложения.
  • Избегайте смешивания фактического текста с выделенным текстом или строками, чтобы предложить текст.
  • Создайте идеализированную версию объекта значка, а не используйте реальную фотографию.
  • Избегайте использования элементов пользовательского интерфейса macOS в значках.
  • Не используйте в значках реплики значков Apple.

Прежде чем создавать значок приложения Xamarin.Mac, ознакомьтесь с разделами «Галерея значков приложений» и «Разработка значков приложений» Руководства по человеческому интерфейсу Apple OS X.

Требуемые размеры изображений и имена файлов

Как и любой другой ресурс изображения, который разработчик собирается использовать в приложении Xamarin.Mac, значок приложения должен иметь как стандартную версию, так и версию с разрешением Retina. Опять же, как и любое другое изображение, используйте формат @ 2x при именовании файлов значков:

  • Стандартное разрешение — ImageName . расширение файла (пример: icon_512x512.png )
  • Высокое разрешение — ImageName @ 2x. расширение файла (пример: [email protected] )

Например, чтобы предоставить версию значка приложения 512 x 512, файл будет называться icon_512x512.png и [email protected] .

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

Имя файла Размер в пикселях
icon_512x512 @ 2x.png 1024 x 1024
icon_512x512.png 512 х 512
[email protected] 512 х 512
icon_256x256.png 256 х 256
[email protected] 256 х 256
icon_128x128.png 128 х 128
[email protected] 64 х 64
icon_32x32.png 32 х 32
icon_16x16 @ 2x.png 32 х 32
icon_16x16.png 16 х 16

Для получения дополнительной информации см. Документацию Apple по предоставлению версий всех графических ресурсов приложений с высоким разрешением.

Упаковка ресурсов значков

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

Сделайте следующее:

  1. На панели решения откройте Assets.xcassets > AppIcons.appiconset :

  2. Для каждого необходимого размера значка щелкните значок и выберите соответствующий файл изображения, который был создан выше:

  3. Сохраните изменения.

Использование значка

После создания файла AppIcon.appiconset его необходимо назначить проекту Xamarin.Mac в Visual Studio для Mac.

Сделайте следующее:

  1. Дважды щелкните файл Info.plist на панели решения , чтобы открыть параметры проекта .

  2. В разделе Mac OS X Application Target щелкните значок приложения , чтобы выбрать файл AppIcon.appiconset :

  3. Сохраните изменения.

При запуске приложения в доке будет отображаться новый значок:

Сводка

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

Страница не найдена

Документы

Моя библиотека

раз
    • Моя библиотека
    «» Настройки файлов cookie

    Могу ли я изменить значок приложения в сценарии Automator?

    Могу ли я изменить значок приложения в сценарии Automator? — Спросите у другого
    Сеть обмена стеков

    Сеть Stack Exchange состоит из 178 сообществ вопросов и ответов, включая Stack Overflow, крупнейшее и пользующееся наибольшим доверием онлайн-сообщество, где разработчики могут учиться, делиться своими знаниями и строить свою карьеру.

    Посетить Stack Exchange
    2. 0
    3. +0
    6. Авторизоваться Зарегистрироваться

    Ask Different — это сайт вопросов и ответов для опытных пользователей оборудования и программного обеспечения Apple.Регистрация займет всего минуту.

    Зарегистрируйтесь, чтобы присоединиться к этому сообществу

    Кто угодно может задать вопрос

    Кто угодно может ответить

    Лучшие ответы голосуются и поднимаются наверх

    Спросил

    Просмотрено 61к раз

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

    ЗначокДемон

    16.7k1010 золотых знаков3737 серебряных знаков5151 бронзовый знак

    Создан 22 авг.

    Бадди Линдси, Бадди Линдси

    1,963 11 золотых знаков1111 серебряных знаков1313 бронзовых знаков

    1

    После создания скрипта выполните следующие действия:

    1. Найдите исходное приложение с нужным значком

    2. Получить информацию исходного приложения ( cmd — i )

    3. Щелкните значок внутри информационного окна исходного приложения (Не тот, что в большом разделе предварительного просмотра внизу, если он у вас есть; маленький в верхнем левом углу.)

    4. Скопируйте ( cmd — c )

    5. Получить информацию сценария автомата (т. Е. Целевого приложения ) ( cmd — i )

    6. Щелкните значок внутри информационного окна целевого приложения

    7. Вставить значок из буфера обмена ( cmd — v )

    Этот метод работает для всех файлов в Mac OS X.

Автор записи

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *