Блог: интерфейсы

✖ Фильтр по слову «интерфейсы»

Проверка работает, а люди застревают

Вложенные бумажные рамки показывают внутренний и внешний зазоры, между которыми замер указатель.

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

Читать дальше →

Когда анимации пора закончиться

Занавес ещё движется, но открытый проход уже доступен.

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

Читать дальше →

Плавное проявление, мгновенное затухание

Слева погасший светильник, справа мягко загорается новый.

Илья Бирман вчера написал:

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

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

Исходный смысл подсветки — обратная связь, ощущение, что всё работает, реагирует, не зависло и не заглючило. Если подсветка срабатывает не мгновенно, а лениво, это сразу воспринимается как тупняк, а не как приятный эффект. Точно так же бесит, когда некоторые светильники не сразу включаются, когда жмёшь кнопку, а плавно.
Читать дальше →

Операция отменена. Почему её результат всё ещё меняет интерфейс?

Голубая картинка закреплена в рамке, а старая песочная картинка задержана розовым зажимом снаружи.

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

Читать дальше →

Когда сообщения приходят быстрее, чем их читают

Один лист удерживается для чтения, пока новые листы поступают в небольшой лоток.

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

Читать дальше →

Форма, которая не теряет написанное

Лист сохранён в бумажном кармане рядом с разомкнутым проводом.

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

Читать дальше →

Улучшаем опыт взаимодействия с формами

Конверт с сохранённым листом дополняют фотография и лента прогресса.

Улучшаем опыт взаимодействия с формами Часто меня спрашивают студенты: «Какой элемент сайта самый важный?», на что я им отвечаю — формы. Ведь с помощью форм пользователи совершают почти все конверсионные действия. Именно с этим элементом связано больше всего проблем. В этой статье я постараюсь рассказать, что можно улучшить при взаимодействии с формами. А заодно описать новые возможности работы с ними в браузерах.

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

Читать дальше →

Как запретить «резиновую прокрутку» в Safari 5.1

Закреплённая рамка с подвижной бумажной лентой внутри.

Safari 5.1 — это версия по-умолчанию в OS X Lion. Вместе с ней мы получили «резиновую прокрутку», как на устройствах iOS. Однако на некоторых веб-сервисах, где нужно использовать прокрутку одного из элементов дизайна, то есть не всего сайта, такая прокрутка очень мешает. Это сервисы как Google Reader, Twitter, наша внутренняя система и другие.

Читать дальше →

Google Maps + Geolocation + Маршруты = <3

Маршрут на складной карте соединяет точку отправления с дверью.

Недавно мы добавили в раздел «Контакты» к нашей карте возможность прокладывать маршрут от того места, где сейчас находится пользователь, к нам в офис. Я бы хотел немного подробнее рассказать как это делается.

Читать дальше →

Выбор внешней системы комментирования

Две кабинки для разговора сравнивают по полноте деталей и настройкам.

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

Для себя я определил несколько критериев выбора, это были:

  1. полная смена языка
  2. возможность авторизоваться используя социальные сервисы, например Twitter, Facebook
  3. аватары из Gravatar сервиса по умолчанию (но чтобы была возможность закачать свой)
  4. система репутации

Честно говоря, почти все системы комментирования имели полный современный функционал: модерирование, антиспам, треды.

Читать дальше →