Иконки

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

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

История

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

Но развились иконки только в XX веке. В 1909 году появились первые дорожные знаки, за ними и городская инфографика. В 1970 в США стало популярным добавлять иконки на упаковки продуктов для привлечения внимания к своим товарам. Дальше иконки стали служить ориентиром свойств товара

Первые Иконки в компьютерах

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

1981 Xerox Star

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

1984 Apple Macintosh 1.0

Mac отличала инновационная операционная система, которая впоследствии вдохновила и на то, как работает Windows. Там появилось перетаскивание файлов, подвижные окна и специально отображаемые значки. Иконки Macintosh были разработаны графической художницей Сьюзен Кар, которая считается одним из мастеров дизайна иконок.

1991 Macintosh System 7

Цветные иконки, стиль которых клево вписывается в текущую дизайн среду из-за тренда на пиксельность.

Ещё всякие иконки из компов

Функциональность

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

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

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

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

Характер иконок

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

Немного примеров из топ-левел компаний. В целом они все стремятся к минимализму.

Material design

В Material design микс из острых и скруглённых углов. Обычно они имеют геометрическую форму: круги, квадраты, треугольники. Это позволяет быстро распознавать иконку и придаёт характерный брутальный стиль.

Airbnb

Стиль иконок Airbnb в целом соответствует фирменному стилю бренда, который стремится к минимализму и простоте. Это позволяет иконкам Airbnb вписываться в любой контекст.

IBM

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

Применение иконок в графике

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

Конец

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

0
14 комментариев
Написать комментарий...
Никита Левцов

Блин так много текста про квадрат с приложения... Прошел наверно курс какой-то на скиллбоксе и радуется

Ответить
Развернуть ветку
Egor Nasonov
Автор

Ахахазп

Ответить
Развернуть ветку
Danil Davydov

Ретро иконки конечно стиль

Ответить
Развернуть ветку
Никита Каляев

такое всегда в моде будет

Ответить
Развернуть ветку
Alex Lowen

Только молодое поколение не понимает, почему сохранить обозначается странным знаком "дискета", а позвонить - странной кривой штукой.

Ответить
Развернуть ветку
loromeon

Эталонная вода.

Ответить
Развернуть ветку
Egor Nasonov
Автор

Ок

Ответить
Развернуть ветку
Юрий Подшибякин

восьмибитные иконки это просто любовь

Ответить
Развернуть ветку
Герман

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

Ответить
Развернуть ветку
Аккаунт удален

Комментарий недоступен

Ответить
Развернуть ветку
Egor Nasonov
Автор

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

Ответить
Развернуть ветку
Аккаунт удален

Комментарий недоступен

Ответить
Развернуть ветку
Egor Nasonov
Автор

Ахахахах ок, чел.

Ответить
Развернуть ветку
Рама

Чувак, развивайся, не слушай всяких ноунейм-токсиков. Если по существу - статья очень поверхностная, непонятны мораль и посыл (если они не заключались просто в ссылке на канал). Рекомендую в следующие разы писать более ёмко и, конечно, в рамках тематики ресурса. Успехов

Ответить
Развернуть ветку
11 комментариев
Раскрывать всегда