{"id":6757,"title":"\u041c\u043e\u0436\u043d\u043e \u043b\u0438 \u043f\u0440\u0438\u0432\u043b\u0435\u0447\u044c \u043d\u043e\u0432\u0443\u044e \u0430\u0443\u0434\u0438\u0442\u043e\u0440\u0438\u044e \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u00ab\u041a\u043b\u0438\u043f\u043e\u0432\u00bb?","url":"\/redirect?component=advertising&id=6757&url=https:\/\/tjournal.ru\/promo\/437972-go-to-viral&placeBit=1&hash=a1a2bc603a905d29826016ca62137e5c33fa43b7c5c3b9ff986557245a5d7f90","isPaidAndBannersEnabled":false}

5 принципов качественного UI

Всем привет! Статья скорее всего будет интересна новичкам, кто, как и я в начале своего пути.

Лучший способ прокачать насмотренность - это делать аудит, либо простой анализ чужих кейсов, как успешных, так и не очень. Проводя такие UI аудиты, я выявила десять фундаментальных составляющих, которые делают дизайн продуктивным, качественным, красивым (выбирай, что больше нравится). Сегодня напишу про 5 из них.

1. Хороший дизайн эстетичен

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

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

2. Системы. Будь это сетка, или система отступов. Все элементы должны быть там, где мы ожидаем их увидеть, отсутствие системы рождает хаос. Хаос сложней сканировать, он напрягает, а нам не надо напрягаться, надо радоваться.

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

2. Хороший дизайн улучшает юзабилити.

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

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

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

3. Бесполезный декор и ограничители. Если геометрия, иллюстрации, сложные фоны, не решают никакую задачу, от них смело можно избавляться, лишний шум замедляет сканирование. Так же и дивайдеры (ограничители), если свободного пространства достаточно, чтобы оценить иерархию, то их стоит убрать. Меньше = больше.

3. Хороший дизайн - вне времени.

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

4. Хороший дизайн - не навязчив.

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

5. Хороший дизайн дружелюбен.

Если брать UI, то под дружелюбием здесь я подразумеваю:

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

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

3. Фидбэк. Реакции на действия пользователя -отображение различных процессов и состояний. От состояний кнопок и форм, до отображения скелета страницы и страницы 404.

Спасибо тем, кто прочитал.

Кому интересно - мой инстаграм

А для работодателей - мое портфолио

{ "author_name": "Анна Кошелева", "author_type": "self", "tags": [], "comments": 2, "likes": 14, "favorites": 95, "is_advertisement": false, "subsite_label": "design", "id": 150653, "is_wide": true, "is_ugc": true, "date": "Mon, 17 Aug 2020 10:46:10 +0300", "is_special": false }
0
2 комментария
Популярные
По порядку

Интересная статья, благодарен.

3

Спасибо за хороший материал.

2
Читать все 2 комментария
Amazon разработала домашнего робота Astro для переноски вещей, видеонаблюдения, воспроизведения музыки и другого Статьи редакции

Стоит $999,99.

ЦБ оштрафовал группу трейдеров за манипулирование рынком — они скупали активы, разгоняли их цену и перепродавали Статьи редакции

Трейдеры получили штрафы от 3000 до 5000 рублей, а доход превысил несколько миллионов рублей.

БКС перезапускает YouTube-канал

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

«Модульбанк» и «Ясно» проведут бесплатный воркшоп о синдроме трудоголика

30 сентября первый банк для предпринимателей «Модульбанк» и сервис психологических консультаций «Ясно» проведут второй совместный воркшоп для предпринимателей. Тема — синдром трудоголика. Эксперты «Ясно» расскажут, как владельцу бизнеса правильно отдыхать и не стыдиться этого.

Daniel Chekalov
Идея линейного города, который за $200 млрд строит Саудовская Аравия: в чём её смысл и почему это уже было в Волгограде Статьи редакции

Концепция, которую применяют саудиты, не нова, её придумали ещё в 19 веке. Однако в мире есть только один крупный город по ней, и он в России.

Планируемый линейный город The Line в регионе Neom Strelcamag
Apple извинилась перед пользователем «Хабра» — он нашёл четыре уязвимости в iOS, но за полгода компания исправила одну Статьи редакции

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

5 руководителей Skillbox вошли в рейтинг ТОП-1000 лучших менеджеров России

ИД «Коммерсантъ» и Ассоциация менеджеров опубликовали результаты ежегодного рейтинга «ТОП-1000 российских менеджеров». В рейтинг вошли сразу пять топ-менеджеров Skillbox:

Суд с «Тинькофф» относительно масштабных «сбоев», приводящих к потере инвесторами своих средств

Всем привет! Меня зовут Валерий, брокерский договор с Тинькофф (дальше буду называть их также «банк», «брокер») № 2057742591. В результате масштабных технических сбоев в работе Тинькофф Инвестиции 24 мая 2021 г., которые, между прочим, самим Банком были признаны, я потерял 70 000 долларов (!) при торговле акциями SPCE. 24-25 мая 2021 в результате…

Фонд «Подари жизнь» совместно с компанией LegalPics запустили сервис по юридической поддержке для родителей

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

«Яндекс» переименовал «Акрополь» в «Яндекс Банк» Статьи редакции

Компания закрыла сделку по покупке банка за 1,1 млрд рублей в июле 2021 года.

Как "Альфа-Банк" украл мои деньги через своего сотрудника в офисе банка у меня на глазах накануне моего Дня Рождения

Я очень любила «Альфа-Банк» за их креатив. Именно поэтому этот банк так сильно ранил меня и разбил мне сердце. Думаю, окончательно и бесповоротно. И об этом моя препечальная история.

null