Материальный дизайн: почему плавающая кнопка действия это плохой ux дизайн?

Posted on by riasevastopol

Материальный Дизайн – язык дизайна, введенный Гугл годом ранее, и что воображает храбрую попытку компании на создания объединенного пользовательского опыта через все платформы и устройства. Это отмечено храбрыми цветами, либеральным, но принципиальным применением теней, дабы указать на уровни UI и ровные мультипликации, каковые снабжают достаточно хороший пользовательский опыт в Android (и кое-какие приложения Гугл на iOS). Одна вещь о Материальном Дизайне, но, напугала меня с того времени, как это было введено в прошедшем сезоне: Floating Action Button.

FABs – круглые кнопки, каковые плавают над UI и “употребляются для поддерживающего действия”, в соответствии с Гугл. Они выступают в качестве кнопки призыва к действию, предназначенных для представления одного действия, пользователи делают большая часть на этом конкретном экране.

И из-за храброго визуального стиля Материального Дизайн, FAB поразительно тяжело проигнорировать и выделить – и в этом содержится неприятность. Тогда как FAB думается, снабжают хороший UX в совершенных условиях в фактической практике, обширно распространенное принятие FAB имело возможность бы быть вредно для полного UX приложения. Вот пара обстоятельств, из-за чего.

Они приобретают погружение из опыта

FAB выделяются визуально ? — они практически сверху любого элемента UI на экране.Материальный дизайн: почему плавающая кнопка действия это плохой ux дизайн? Кроме этого, добавление FAB машинально привело бы к результату в UX, что есть менее иммерсивным, в особенности затрагивая приложения (либо экраны) целью которого есть обеспечить интерактивный эффект. Один пример – новое Фото приложение Гугл.

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

Предоставленный, умный фото поиск – неповторимая функция фото приложения Гугл. Но свидетельствует ли это что этому необходимо дать верховный уровень, постоянного FAB в приложении? (Я думаю нет.)
Как ни необычно, Гугл соглашается со мной. На странице Материального Дизайна о FABs Гугл растолковывает, что “не каждый экран испытывает недостаток в плавающей командной кнопке”.
После этого идет добавление, что “главное воздействие это коснуться изображения в галерее, в этом случае кнопка не нужна.” Ой.

Они выделяются, — и стоят на пути.

Это может показаться второй стороной медали, но имеется второе, более ответственное последствие которое стоит на пути FAB. Занимая положение на экране, FAB действенно блокирует содержание. Но эй, FAB есть легко маленькой круглой кнопкой, верно?

какое количество содержания оно может заблокировать?
В случае если наблюдать на скриншот фото приложения, то возможно представить, что поисковые блоки FAB блокируют примерно 50 процентов уменьшенного изображения – непременно достаточно дабы закрыть лицо либо два. Это – дополнительный свиток, нужный любой раз, в то время, когда Вы желаете наблюдать на каждое 4-е уменьшенное изображение последнего последовательности на экране. И это кроме того не нехороший случай.

Dumazy Пользователь разместил на Graphic Design Stack Exchange о проблеме, с которой он столкнулся в то время, когда FAB заблокировал «любимую» звезду, и отметку времени на его экране приложения. Это иллюстрирует проблему всего приложения со списковым понятием, и это делается особенно проблематичным, в то время, когда последний пункт в перечне не имел возможности прокручиваться дальше вверх. Это указывает, что целая колонка, должна быть принесена в жертву (меняя расположение звездной кнопки, и т.д.), дабы допускать надлежащее удобство применения экрана.

Следовательно, пока это может не казаться таким, FAB занимает намного больше на экране, чем предлагает его размер.
Выдвинутые действия не могли употребляться так довольно часто.
Делая дизайн UX, полезно не забывать правило 80/20, которое заявляет, что пользователи будут применять 20% изюминок 80% времени. Иначе говоря большинство упрочнения должна быть помещена в проектирование нескольких элементов, дабы пользователи применяли солидную часть времени. FAB практически делает лишь это – теоритически.
Заберите приложение Gmail Гугл, к примеру.

FAB Gmail приложения это создание кнопки, которая предполагает что главное воздействие пользователей это создание электронной почты.

Но правда ли это?

Многократные изучения продемонстрировали, что по очень мере 50 % писем читаются на мобильном устройстве, но не показывают то же самое изменение с позиций создания Email. Иначе говоря потому, что отечественные ежедневные события, возможно, подтвердили бы, что самые мобильные пользователи склонны применять собственные почтовые приложения, дабы прочесть Email на ходу.
Быть может, маленькое количество отвечает на мобильных устройствах, но что лишь происходит по окончании открытия электронной почты (обратите внимание на то, что это указывает, что они обойдут FAB). Это ведение пользователей, возможно вызванное достаточно несовершенным входным механизмом виртуальных клавишных инструментов и авто верное, свидетельствует, что главное воздействие каковые делают пользователи, это практически просматривают (и отвечают), Email, не создавая новые.
Итак, что FAB делает для «создания писем»? В редких случаях, это доставляет наслаждение пользователям, в то время, когда они срочно желают создать письмо, на ходу с приложением. Но в второе время, это занимает пространство экрана, блокирует отметку и звёздную кнопку времени и всегда отвлекает выкрашенным красным цветом.

Нужен ли нам FAB? Это набросок – Желаем ли мы FAB?

Само собой разумеется, не все применения FAB уменьшают опыт применения Материальных приложений. Имеется кое-какие хорошие примеры FABs, каковые имеют суть, и каковые увеличивают UX тех приложений.

Карты Гугл это хороший пример что FAB сделан верно. Основное воздействие, выполненное пользователями на Картах, этополучить направления, так, оно имеет красивый суть для FAB, которое делает именно это.

Но учтите, что Карты достаточно особенный случай, в то время, когда пользователи контента заинтересованы практически в любое время в попадание в центр экрана (где Ваша светло синий точка положения). В большинстве приложений, но, сетка либо списковое представление означают, что пользователи взаимодействуют с содержанием, расположенным везде на экране, включая то, где в большинстве случаев FABs расположены.
Разглядим кроме этого, что скриншоты выше информируют лишь часть истории: в фактическом применении FABs остаются кроме того в том месте, где прокручивались пользователи (солидную часть времени). Гугл выделил многократно в Материальном Дизайне, что дизайн перемещения так же серьёзен как дизайн UI.
Отсутствие перемещения – постоянство в пространстве экрана – в контексте движущегося содержания формирует более большой уровень внимания, которое смогут лишь продемонстрировать скриншоты.
Исходя из этого, в то время, когда мало примеров хорошей реализации FAB, то напрашивается вопрос: необходимы ли FABs?
В то время, когда мы наблюдаем на недочёты имеющий FABs в приложениях, мы можем свести это к несложной реализации: пользователи не только делают действия на приложениях, они кроме этого потребляют содержание (если не большое количество времени).
Дизайн FAB в Материальном дизайне основывается на предпосылке, что пользователи выполнить определенное воздействие солидную часть времени, и, следовательно, должен быть предоставлен повышенный статус в стойкой форме, кнопки на самом высоком уровне. Но во многих приложениях, пользователи сосредоточены кроме этого на потреблении содержания (если не больше): в фото приложении пользователи желают разглядеть фотографии; в приложении Gmail пользователи желают прочесть собственные Email; и в приложении Facebook, пользователи желают прочесть сообщения собственных друзей.
FAB, так, философия дизайна (либо по крайней мере выбор дизайна), что подчиняет оптимальное потребление содержания к принятию мер. И мы должны задать вопрос себя: нужен ли таковой компромисс? В действительности, требуется ли таковой компромисс?
В то время, когда FABs приводят к уменьшению большей части времени UX, в то время, когда тяжело узнать единственное самый применяемое воздействие в рамках приложения, и в то время, когда окольные способы должны быть изучены (в то время, когда FAB исчезает при прокрутки либо перечни с другими установленными элементами) я сообщил бы, что ответ звучит нет.
Материальный Дизайн Гугл, достаточно хорошая часть объединенного, принципиального языка дизайна, но FAB не это необычное.

Высоких конверсий!

Случайные статьи:

Дмитрий Колдун — \


Подборка похожих статей:

riasevastopol

More Posts