Иконки лучше использовать с подписками или внутри кнопок
То, как пользователь взаимодействует с чем-либо (пульт телевизора, кран в душ. кабине, форма на сайте).
Пользовательский интерфейс, как будет выглядеть UX-интерфейс (цвет, кнопки, визуал, внешний вид и т.д.)
РЕАЛИЗМ |
![]() |
Стиль, при котором элементы интерфейса максимально приближены к реальным. Его достаточно тяжело реализовывать. | ||
ПЛОСКИЙ СТИЛЬ (FLAT) |
![]() |
Минималистичный дизайн, без лишних эффектов. |
Макет с расположением на нем состояние элементов пользовательского интерфейса. В него входят:
Кнопки |
![]()
c = высота шрифта;
|
Самая важная кнопка выглядит соответствуеще.
Тёплые тона притягивают. Если поля форма достаточно коротки, то есть смысл задать кнопке ширину как у полей Нужно повторять призыв к действию, дублировать кнопку в различных блоках Правильно располагать НАЗАД-ВПЕРЁД, а не ВПЕРЁД-НАЗАД В большие кнопки легче попасть, можно использовать маленький кегль, много пространства в кнопке выглядит хорошо. Большие внутренние отступы. Отделяйте главные действия от второстепенных. В кнопках тоже должна быть иерархичность. Не должно быть на одном экране несколько одинаковых кнопок. Кнопки должны повторять геометрию дизайн-концепции. С закругленныи краями или с прямыми зависит от концепта В кнопках текст смотриться лучше всеми заглавными буквами! ![]() |
||
Поля форм |
Меньше полей, менше кликов. Функциональные кнопки можно отображать при наведении (например на строку товара в
таблице)
Если полей не много, то имеет смысл сразу их показывать без поп-апов Чекбоксы и радио-кнопки лучше в столбик, в строчку не удобно для пользователей * - такие звёздочки уже не рисуют Группировать поля, схожие по смыслу в отдельные блоки с заголовками Постепенное раскрытие действий, по мере заполнения Форма как предложение, заголовок - подлежащее, кнопка - сказуемое Избегать повторений слов в форме Не нужно заставлять пользователей вводить излишнюю информацию |
|||
Лейблы |
Лучше располагать над полями, если рядом с полями, то лучше выравнивать по правому краю, чтобы не было пустот | |||
Селекты, радио-кнопки, чекбоксы |
Если вариантов выбора менее 6, то лучше делать не select, а радио-кнопки
Радио-кнопки лучше располагать столбиком, удобно для пользователей Подтверждение по умолчанию (checked) |
Миниформаты, цитаты, фактойды, реклама применяются для разнообразия в композиции.
Фактойд - это утверждение, представляемое в прессе, но без источника и подтверждения, целью которого является привлечение внимания.