Дизайнер иконка: Иконки дизайнер — 5,010 бесплатных иконок

11 бесплатных наборов иконок для дизайнеров — Дизайн на vc.ru

Перевод оригинала

4496 просмотров

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

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

1. 730+ прозрачных иконок

Этот огромный набор из 730+ иконок для UI в форматах SVG, PNG64 и Iconfont может оказаться очень полезным для многих дизайнерских проектов. Он охватывает все основные тематики: базовые (файлы, папки, Wi-Fi, батареи питания и даже значок дискеты), музыка, коммерция, ПО, стрелки, погода… Если вы ищете полный набор прозрачных иконок, это то, что вам нужно.

Скачать набор бесплатно

2. Travel-иконки

Этот набор иконок имеет различную цветовую гамму и дизайн, в том числе и простые плоские дизайны, которые гарантированно подойдут любому сайту, UI/UX или другому дизайн-проекту travel-тематики. Они станут идеальным решением для заголовков разделов, описаний преимуществ и других категорий контента, а необычный дизайн «от руки» поможет выделить ваш дизайн среди конкурентов.

Скачать набор бесплатно

3. Эго-иконки

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

Скачать набор бесплатно

4. Набор иконок азиатской кухни

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

Скачать набор бесплатно

5. Набор космических иконок

Небольшой, но хорошо продуманный набор из четырех растровых значков был создан просто для забавы (как и многие из лучших творений!). Эти рисунки из другого мира доступны бесплатно для вашего вдохновения в следующих космических проектах.

Скачать набор бесплатно

6. Иконки в мультяшном стиле поп-арт

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

Все возможные комбинации «Biff!», «Pow!» и «Bang!» гарантировано вызовут восторг у ваших клиентов.

Скачать набор бесплатно

7. Значки случайных предметов

Название говорит само за себя. Единственное, что связывает этот набор из более 120 разрозненных иконок, — это отличный дизайн. Нужна иконка яйца или видеокамеры? Пожалуйста. Делаете новогодний лендинг? Здесь этой теме посвящены около 20 иконок. Есть даже Путин! В общем, если вы еще не определились с тематикой, этот набор — то, что вам нужно. Автор предполагал, что сет заполнит пробелы, которые есть в других наборах иконок. Пульверизатор, собачья кость и пачка сигарет убеждают нас, что он преуспел в этом.

Скачать набор бесплатно

8. Концептуальные иконки

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

Скачать набор бесплатно

9. Иконки со стрелками

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

Скачать набор бесплатно

10. Набор бизнес-иконок

Компактная коллекция отличается чистым, плоским дизайном с использованием штриховых рисунков и цветовых стилей. Это отличная отправная точка, если вы ищете профессиональную, но слегка игривую иконку, которая идеально подойдет для презентации Power Point или в качестве навигационных ссылок для вашего следующего дизайна. Их можно использовать как в Adobe Illustrator, так и в Sketch.

Скачать набор бесплатно

11. Адаптивные иконки

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

Скачать набор бесплатно

Шесть главных «искушений» дизайнера иконок

Обдумывая метафоры иконок, необходимо придерживаться двух основных принципов:

1. Сохранить их простыми
2. Сделать их непохожими друг на друга

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

Искушение № 1. Отображение всех функций

Мы уже привыкли к тому, что иконка принтера отправляет на печать одну копию документа на принтер, который стоит по умолчанию. Но представьте, что вы никогда прежде не печатали документы: данная иконка может использоваться для настройки параметров печати или для поиска и добавления принтера(пример из книги Алана Купера About Face 3).

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

На примере панели инструментов Outlook 2007 мы видим, что многочисленные конверты снижают читабельность иконок.

Искушение № 2. Добавление трех и более объектов

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

Пытайтесь отобразить какую-нибудь одну функцию иконки. Для иконки «Администратор сети» нарисуйте «ботаника» в очках, но не добавляйте гаечный ключ и компьютер, подключенный к сети.

Эта иконка установочного файла — наглядный пример перегруженной объектами иконки. Мы уже знаем, что программы, как правило, устанавливаются на компьютер. Мы уже знаем, что иногда программы распространяется на CD. Одной коробки было бы достаточно.

Искушение № 3. Чрезмерная конкретизация

Используйте символы. Отойдите от сугубого реализма. Для иконки «Художественная выставка» больше подойдет статуя или картина, нежели помещение музея. Само собой, в приложении не должно быть противоречащих иконок, таких как «Предмет искусства».

Искушение № 4. Использование фирменного стиля

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

Использование фирменного стиля в иконках в 99% случаев ухудшает их читабельность. Более того, создавая иконки в едином стиле, вы делаете их похожими друг на друга. Вместо этого используйте Руководство по стилю иконок от операционных систем. Начиная с ОС Windows XP, компания Microsoft вводит такие параметры, как перспектива, источник света и общий вид. Соответственно иконки для ОС Vista должны быть реалистичными, а источник света должен располагаться в левом верхнем углу, слегка перед иконкой.

В приложении для конференций Yugma логотип используется для всех пунктов стартового меню, так что здесь фирменная символика применена на все 100%. Сравните их с понятными иконками TuneUp Utilities 2008, которые отражают непосредственно свои функции.

Искушение № 5. Использование текста на иконке

Не описывайте функциональность прямо на иконке. Для этого существуют всплывающие подсказки и надписи рядом с иконками.

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

Искушение № 6. Добавление деталей лица

Не отрисовывайте детали, используйте «пустые» лица. Когда лицо несет в себе много информации, это отвлекает от значения иконки. Эта подборка классических рисунков Bidstrup показывает, как много можно прочесть на лице человека:

Об авторе
Иван Бойко является владельцем компании VisualPharm и присматривает за всеми проектами компании. Это не мешает ему заниматься собственной работой — дизайном сайтов и интерфейсов. С 2005 года Иван ведет собственный курс Интерактивного дизайна в Британской школе дизайна в Москве.

дизайнов, тем, шаблонов и графических элементов Icon Designer, загружаемых на Dribbble

1. Посмотреть минимальные значки приложений

   Минимальные значки приложений

2. Посмотреть набор иллюстраций Marklogic

   Набор иллюстраций Marklogic

3. Просмотр наборов друзей — день 2

   Наборы друзей — День 2

4. Посмотреть иллюстрированные иконы Klarna

   Иллюстрированные иконки Klarna

5. Посмотреть подборку логотипов

   Набор логотипов

6. Посмотреть стиль иконографии Атопы

   Стиль иконографии Атопа

7. Посмотреть набор иконок пользовательского интерфейса Proemion

   Набор иконок пользовательского интерфейса Proemion

8. Посмотреть иконографию Дейбриджа

   Иконография Дневного моста

9. Посмотреть дизайн логотипа: 3Cevre

   Дизайн логотипа: 3Cevre

10. Вид .

11. Посмотреть JS

12. Посмотреть эскизы Космоса

    Эскизы космоса

13. Просмотр SignOnSite

    Вход на сайт

14. Посмотреть набор иконок

    Набор иконок

15. Посмотреть иконографию восстановления ServPro

    Иконография ServPro Restoration

16. Посмотреть иллюстративные значки банка ключей

    Иллюстративные значки Keybank

17. Посмотреть руководство по фирменному стилю Tamochat

    Руководство по фирменному стилю Tamochat

18. Посмотреть ✨

19. Посмотреть эскиз робота

    Эскиз робота

20. Просмотр D💧

21. Просмотр дракона

    Дракон

22. Посмотреть дизайн логотипа utm. co

    utm.co Дизайн логотипа

23. Посмотреть иллюстрацию веб-сайта Ware2Go

    Иллюстрация веб-сайта Ware2Go

24. Посмотреть альтернативный логотип субстрата

    Подложка alt Logo

Зарегистрируйтесь, чтобы продолжить или войдите в систему

Загрузка еще…

Designer Icons дизайны, темы, шаблоны и загружаемые графические элементы на Dribbble

1. Посмотреть иконографию Дейбриджа

   Иконография Дэйбриджа

2. Посмотреть иллюстрированные иконы Klarna

   Иллюстрированные иконки Klarna

3. Посмотреть ✨

4. Посмотреть иконографию восстановления ServPro

   Иконография восстановления ServPro

5. Набор иллюстраций Marklogic

6. Посмотреть набор иконок

   Набор иконок

7. Посмотреть иллюстративные значки банка ключей

   Иллюстративные значки Keybank

8. Посмотреть стиль иконографии Атопы

   Стиль иконографии Атопа

9. Посмотреть набор иконок пользовательского интерфейса Proemion

   Набор иконок пользовательского интерфейса Proemion

10. Посмотреть халяву: Iconly V2. 2, новый тип

    Халява: Iconly V2.2, новый тип

11. Посмотреть иконографию Кларны

    Кларна Иконография

12. Посмотреть систему иконографии Gett + руководство по стилю

    Система Gett Iconography + руководство по стилю

13. Просмотр значков приложений Goody

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

14. View ⚡️Iconic — бесплатные пиксельные значки «делай, что хочешь».

    No related posts.