Время покаяться. Мой предыдущий совет оказался не совсем корректным, и Артём Горбунов попросил дополнить его следующей мыслью.

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

Фрагмент гайдлайнов Эпла
Приложение «Эпл Стор»

Веб‑сервисы, которые ведут себя таким же образом, выглядят более привычно и предсказуемо:

А в настольных операционных системах кнопки наоборот имеют ограниченную ширину:

Вытянутая по ширине окна кнопка выглядит дико, неуместно и неузнаваемо:

Таким образом, в Скайпе на настольном компьютере более правильно было бы сделать так:

Заодно появилось хорошее место для вывода ошибок.

Типографика в вебеИнтерфейс
Отправить
Поделиться
Запинить

Комментарии

Сергей Плохотнюк

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

12 июля 2020

Skype — кроссплатформенное браузерное и мобильное приложение, где UI так или иначе наследуется на всех платформах с некоторыми особенностями под каждую из систем, а мы его сравниваем с целой операционной системой со своим подходом к проектированию как UX, так и UI. Я думаю, идея была в том, что кнопка тянется относительно контента, а не относительно всего окна, — поэтому идея растянуть её на все окно и выглядит так «дико, неуместно и неузнаваемо». И, с другой стороны, сжатие кнопки по правилам MacOS также ломает весь макет.

6 авг 2020

Дополнение к комментарию выше. Вот так могли бы выглядеть оба подхода в контексте операционной системы Apple.

6 авг 2020

Рекомендуем другие советы