3 заметки с тегом

ux

Дизайн на рендерах и в жизни

В последнее время в твиттере с каждым новым рендером от микрософта в ленту валится тонна твитов с восхищениями. Вроде выглядит красиво: анимации, блеск, текстуры, стекло. Рисуется интерфейс, появляется стеклянный шарик, который катится и создает волны, иконки выпрыгивают, надуваются с красивыми тканевыми текстурами и лопаются, появляются глянцевые листы и наверху объемные элементы управления.

@st8rmi: The new Office App

Комментарии под твитом
Комментарии под твитом

Через два месяца выходит приложение, но выглядит как-то обыденно. Аутлук и Офис используют стандартные элементы iOS UI Kit и не отличаются от стандартной почты на айфоне.

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

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

Ненастоящее окружение дополняет нереалистичные эффекты, у нас не белые пустые комнаты и рабочие столы: комнаты всегда чем-то заставлены, а на рабочих столах куча файлов, беспорядок и фотография гор вместо нежно-голубого фона. У нас всегда забит календарь (Джейсон Фрид исключение), открыто много программ, вокруг много влияющих на восприятие вещей, в голове много мыслей. Все не так, как в воображаемом вакууме.

«Choose» или «select»

Тут важное от Эппл про использование слов в интерфейсе, еще одно напоминание, что в разговорной речи не так, как в интерфейсных и компьютерных задачах:

“Use choose, not select, for menu items. In general, the user selects something (such as a file or disk icon, an email message, or a section of text) and then chooses a command to act on the selection.”

“Use choose, not select, for menu items. In general, the user selects something (such as a file or disk icon, an email message, or a section of text) and then chooses a command to act on the selection.”

Коротко: сперва «select» несколько фотографий, а потом «choose» поделиться.

Отсюда: Reminder: Select and Choose Are not Synonyms

Учимся смотреть на UX по-другому у Твиттера

Недавно Твиттер изменили в веб версии иконку поиска на хэштег. Это было не лучшее решение.

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

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

Твиттер решил, что надо создать вторую ленту и поместили ее в меню поиска, как сейчас сделано у Инстаграма. То есть больше нет меню поиска, а поисковая строка стала частью новой ленты, поэтому Твиттер и решил поменять иконку. Но у пользователей это меню все еще ассоциируется не с хэштегами или второй лентой, а с поиском, поэтому вышло плохо.

Но при этом у Твиттера все еще на каждой странице есть отдельное меню поиска, поэтому логичным выглядит только выбор: или лента по интересам или меню с поиском — мешать не стоит.

Сейчас у Твиттер так
Сейчас у Твиттер так

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