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

Лучшие советы по размещению

Чтобы эти элементы дизайна были удобными для пользователей, соблюдайте следующие правила их размещения:

•  соблюдаете оптимальные размеры — по данным MIT Touch Lab известно, что 10х10 мм является минимумом для удобного нажатия;
•    размещайте их в местах, где посетитель предполагает их найти, соблюдайте пары «дальше» и «назад», акцентируйте на иконке призыва к действию;
•    выбирайте хорошо зарекомендовавшие себя формы — обычную квадратную или с закругленными углами.

Будьте последовательными при их создании — это позволит посетителям сайта без труда найти их и распознать как кнопки.

Классификация кнопок — их предназначение и поведение

В UX дизайне кнопки делят на следующие типы:

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

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

Выбор типа кнопки

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

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

Источник: /uxgu.ru/