x
 
Владимир Усов
16 августа 2016
Советы почтой каждую неделю
Пожалуйста, получите наше письмо, чтобы подтвердить свой адрес:
Вы подписаны на «Советы за неделю»:

Вы рассказывали, что добавить полезную информацию — это один из способов повысить информативность. А какие ещё способы есть?


Напомню, мы говорим о том, как уменьшить шум. В прошлом совете обсудили приёмы УВЛ и вынесение за скобку. Вот ещё один.

Соединить информационные функции

Когда скорости интернета стало хватать, на сайтах появились виджеты-автомагнитолы:


Некоторые из них поддерживали плейлисты.

Мы делали встраиваемый плеер для Веборамы, и посмотрели на эти виджеты критически. Обязательно нужны название песни и кнопка «Плей»:


Ещё нужна ссылка на саму Вебораму, ведь смысл — в получении трафика с сайтов пользователей. Сделаем ссылкой название песни:


Хочется куда-то добавить прогрессбар. Но уже есть подчёркивание у ссылки, используем его:


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


Благодаря такой компактности у нашего виджета появилось новое качество: его можно вставлять прямо в текст:


Чтобы получился плейлист, можно просто разместить плееры разных песен в несколько строк. А громкость и так есть на компьютере.

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


Всегда стоит подумать, как наделить новой функцией существующий элемент, а не вводить новый.

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



На Маке кнопка закрытия окна сигнализирует о несохранённости документа точкой внутри:


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

Э. Тафти. Представление информации. Глава 7: Многофункциональные графические элементы

В браузере Сафари были совмещены прогрессбар и адресная строка:


О прогрессбарах

Индикатор включённости и подсветка чайника — это одно и то же:



Принцип работает и за пределами пользовательского интерфейса:

Самолёт — это стрелка

Екатеринбург

Для обратного отсчёта над светофором установлена третья секция

Челябинск

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

Навигация в «Дримхаусе»

Для указания выхода используется стрелка вправо и пиктограмма «вниз по лестнице», состоящая из лестницы и ещё одной стрелки

Вход в «Коворкафе»

Стрелка и лестница собраны в один знак, однозначно читающийся как «налево и вниз по лестнице»

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

О взгляде новичка

Интерфейс и информация — дисциплина Школы дизайнеров. Набор открыт. Чем раньше поступите, тем ниже стоимость и выше шанс на бесплатное место.
 

Поделиться
Отправить

Комментарии

Иван Гришаев
23 августа 2016

Вы пишете: «однозначно читающийся как „налево и вниз по лестнице“». Вовсе не однозначно. Этот знак может означать «спускайтесь вниз, а не вверх» или «вниз, а потом налево».


Цель рубрики — обсуждение вопросов дизайна всех видов, текста в дизайне и взаимоотношений дизайнеров с клиентами.

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

Решение о публикации принимается один раз; мы не имеем возможности комментировать или пересматривать свое решение, хотя оно может быть ошибочно. Уже опубликованные комментарии могут быть удалены через некоторое время, если без них обсуждение не становится менее ценным или интересным.

Вот такой веб 2.0.





Недавно всплыло

Как следует поступить дизайнеру, если клиент постоянно вспоминает «нечто очень важное» 7 Какой движок выбрать для сайта рекламного агентства? 2 Выбранные элементы списка, как не забывать принципы из советов бюро и когда нужен логотип 1 Экран ожидания в поликлинике 6