Microsoft — мировой лидер в области ПО и ИТ-услуг
169,03
рейтинг
24 декабря 2012 в 08:40

Дизайн → «Не говорите мне, куда мне идти», — ваш пользователь

В серии статей про принципы дизайна для Windows 8 мы рассмотрели ключевые идеи и подходы, лежащие в основе всей платформы и задающие язык дизайна для Windows. Чуть ранее, обсуждая процесс проектирования приложения, мы рассматривали в общем-то эти же принципы, но уже в разрезе правильной расстановки приоритетов.



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


Ссылки


Если вы посмотрите на свои любимые веб-сайты, практический в каждом вы увидите общий элемент – некоторое меню навигации, или главное меню, разводящее пользователя по ключевым разделам сайта:



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



Когда разработчики и дизайнеры увидели «плиточный» интерфейс Windows Phone и Windows 8, они быстро смекнули визуальную составляющую, однако, суть часто оставалась прежней:



Место ссылок/кнопок/меню заняли квадратные плитки с двуцветными силуэтными картинками и небольшими подписями, все также разводящие пользователя по имеющимся разделам приложения.



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

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



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



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

По-умному это называется “progressive disclosure”, а по-простому это означает, что пользователю необходимо обеспечить как возможность быстро разобраться, что к чему, так и спокойно погружаться к деталям, переходя к исследованию контента. Важно и то, и другое.

Отсюда возникает вопрос: как добиться обеих задач одновременно? Если исходить из идей приоритизации целей пользователя и важности контента, ответ напрашивается сам собой.

Контент находится на самом последнем уровне? — Не вопрос! Давайте вытащим его наверх!

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



В такой ситуации становится прозрачной и роль живых плиток (Live Tiles) — они становятся отображением самого важного в приложении, вытянутым за пределы приложения на стартовый экран. Живая плитка — это иконка с самым важным и актуальным контентом из приложения.



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

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

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

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



Однако сюда же, на первый экран (или хаб), вынесена и дополнительная социальная составляющая с ачивками, соревнованиями и т.п.:



Хаб становится проекцией всех ключевых сценариев, вынося на поверхность ключевую информацию из нижних уровней:



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

Вместо того, чтобы говорить пользователю «смотри, вот что у нас есть», предлагая ему последовательно переходить к нижним уровням детализации контента, мы переходим к идее «смотри, вот что происходит», вынося на первый план быстрый доступ (возможно, и вовсе без необходимости погружения) к наиболее приоритетной информации с соответствующим уровнем представления и информационной насыщенности.

Несколько дополнительных сценариев, развивающих эту идею, мы рассмотрим в следующей статье.
Автор: @kichik
Microsoft
рейтинг 169,03
Microsoft — мировой лидер в области ПО и ИТ-услуг

Комментарии (22)

  • –7
    И чем это отличается от экрана с нотификейшенами у приложений в Meego, например? Разве что там их так тщательно в квадратные монохромные поля не упихивали.
    • +14
      А вы статью читали? :) Вопрос не в нотификациях и том, что где и от чего отличается, а в том, что находится к голове у проектировщика, когда он создает дизайн приложения. А квадратики и т.п. — это уже детали реализации.
      • –7
        Справедливости ради, заголовок и первая половина статьи действительно выглядят как описание нотификаций, и только потом появляется та самая полезная мысль, что все дело в голове проектировщика :)
  • +1
    Майкрософт живет в каком-то своем мире. В мире Индикаторов и Пультов Управления.
    • +1
      Поясните, вообще не понял вашего комментария. Где (или в чем) вы увидели «Индикаторы и Пульты Управления»?
      • +3
        Достаточно открыть стартовый экран новой Windows.

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

        • +3
          Вы опять что-то не договариваете.
          Я открыл стартовый экран новой Windows и вижу: 1 одно приложение хочет обновиться, друг написал коммент в фейсбуке, на ivi появился фильм «Игра на выживание», а гугл следит за Санта Клаусом.
          Я не вижу ни пульта управления, ни индикатора (ну разве счетчик апдейтов)

          Разверните свою мысль.
          • +3
            А я, включив компьютер, хочу запустить с рабочей папки файл с макетом, который не доделал вчера и открыть ТЗ с рабочего стола, куда сохраняю все временные файлы.

            Поможет мне новая Windows в этом? Вряд ли.
            Зато я буду в курсе, что какое-то приложение нужно обновить, что Гугл следит за Сантой, а на Иви появился фильм, о котором я ничего не слышал до этого. Это действительно важнее, чем мои привычные повседневные сценарии.

            Вы правда не видите здесь мира Индикаторов?

            • 0
              Может новая Windows должна вам сама доделать и открыть готовое ТЗ? Вы чего хотите, какой помощи? Предложите хоть свой вариант что ли. Или у вас рабочий стол отобрали с возможностью складывать туда временные файлы и прочие ярлыки? Отобрали таскбар с активными приложениями? Чем вам мир Индикаторов и когда успел насолить?

              У меня друг работает оператором на КС, у них уже много лет рабочий стол Windows представляет собой свалку индикаторов в плитках. Еще до Windows 7-8 и даже до Windows XP. Инновация в глубинках России прошла незамеченной :)
            • 0
              Я хочу знать, прислали ли мне на почту макет, или нет, поможет мне в этом рабочий стол с папками? А вот прямоугольник с темой и отправителем письма поможет. А еще поможет увидеть то, что запланировано на ближайшее время в календарях. И погоду утром увидеть поможет.
              У всех людей разные задачи к компьютеру, а вы считаете, что должно быть так, как удобно вам. Тем более, что я сомневаюсь в том, что вы садитесь за комп, сразу же запускаете недоделанный макет, а доделав все закрываете и выключаете компьютер, больше ничего на нем не делая.
              • +1
                А я сильно сомневаюсь, что вы целыми днями созерцаете температуру на виджете погоды.

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

                Все это не имеет никого смысла. Инновации ради инноваций. Десктопный компьютер — не телефон. И попытка размыть границы ни к чему хорошему не приведет.

                • 0
                  А на папку с макетом вы смотрите целыми днями?
            • 0
              > Вы правда не видите здесь мира Индикаторов?
              Честно, я вижу здесь только ваше отторжение нового. Больше ничего я не вижу. Для меня рабочий стол ровно такой же мир индикаторов и пультов управления. Поэтому я уже в третий раз прошу вас развернуть свою мысль.
              Сформулирую вопрос по другому: я не понимаю вашей аналогии и, как следствие, почему это хорошо или плохо.
              • +1
                Да прекратите :) Никто ничего не отторгает без нужды.

                Просто по продуктам МС можно проследить их давнее желание превратить «входной экран» системы в этакий разводной космо-пульт с кучей ненужных данных. Знаете как в старых фантастических фильмах — тонна мигающих кнопочек и один умный супер-пилот на кресле рядом.

                Ну вот — мечта разработчиков стала сбываться. Но удобно ли при этом работать? Нужно ли получать всю эту порцию данных? Конечно нет. Если мне нужно открыть Фейсбук — я открою его в браузере. А сейчас просто дайте мне мои программы и файлы.

                Могу описать более просто:
                Основной сценарий работы с любой ОС — открыть программу или файл.
                И чем быстрее это будет сделано (меньше кликов), тем лучше.

                Что делает студент? Играет в Контру. Клик по ярылку и вперед.
                Что делает студент за ночь перед экзаменом? Делает шпоры в Ворде. Клик по документу и вперед.
                Что делает мими-девочка? Открывает браузер и идет лайкать фоточки друзей.
                Что делает моя мама? Открывает браузер и идет на Одноклассники.
                Что делает разработчик? Запускает среду разработки, браузер, скайп и работает.
                Что делает дизайнер? Открывает Фотошоп, открывает макет в дропбоксе и рисует.

                Так вот вопрос — как сюда вписывается плитка? Где здесь непрекращающееся созерцание почтовых уведомлений и прогноза погоды?

                • +1
                  > Просто по продуктам МС можно проследить их давнее желание превратить «входной экран» системы в этакий разводной космо-пульт с кучей ненужных данных. Знаете как в старых фантастических фильмах — тонна мигающих кнопочек и один умный супер-пилот на кресле рядом.

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

                  > Основной сценарий работы с любой ОС — открыть программу или файл.
                  И чем быстрее это будет сделано (меньше кликов), тем лучше.

                  Это все хорошо, но категориями файлов мыслят лишь продвинутые пользователи, и то не все правильно понимают, что это вообще такое. Файл в компьютерном понимании давно отошёл от своего физического прообраза и представляет собой чисто техническое понятие, надо ли пользователю это знать? Судя по тому что пользователям уже 20 лет безуспешно пытаются это понятие втолдычить, пользователю оно не нужно. Они открывают флешки через ворд. Они понятия не имеют, где лежат их документы (именно по этому у обызных юзеров и засран рабочий стол). Зачем художникам, архитекторам, бухгалтерам мыслить компьютерными категориями?

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

                  > Что делает студент? Играет в Контру. Клик по ярылку и вперед.

                  тап по плитке и вперед

                  > Что делает студент за ночь перед экзаменом? Делает шпоры в Ворде. Клик по документу и вперед.

                  тап по ворду и вперед (впрочем именно из-за этого сценария в windows RT остался десктоп: работа с 2-3 документами, картинками и тп одновременно)

                  > Что делает мими-девочка? Открывает браузер и идет лайкать фоточки друзей.

                  открывает браузер со стартового экрана и вперед. Хотя уже недавно была статистика, что именно в соцсетях приложения побеждают браузер.

                  >Что делает разработчик? Запускает среду разработки, браузер, скайп и работает.

                  скайп всегда открыт, среда разработки так же легко открывается со стартового экрана. (именно от туда я ее и открываю, так как не люблю замусореный десктоп, а на супербаре 2-3 IDE закреплять не хочется)

                  > Что делает дизайнер? Открывает Фотошоп, открывает макет в дропбоксе и рисует.

                  тоже проблем никаких нет.

                  Да это отличается от того как вы привыкли, соответственно вызывает дискомфорт. Но мне кажется, в ближайшее время большинство приложений все же придет к тому, что открывая приложение, вы будете возвращаться к тому от чего ушли, и у вас будет возможность быстро переключиться на другой документ, из тех над которыми вы работали. Отличный пример в этом смысле OneNote MX.

                  Подытожу: можно спорить, подходит ли эта концепция лично вам, насколько хорошо сделана конкретная реализация. Но фундаментальных проблем этой концепции я сам не вижу, и вы пока мне не показали.
  • +2
    Мысль в том, что наиболее часто нажимаемые элементы должны быть повыше и побольше? Дык эта мысль последние лет 20 не менялась.
    • 0
      Вы статью прочитали или глазами посмотрели?
      Мысль в том, что бы пользователь сразу получал то, за чем пришел, а не за каталогом ссылок.
      В качестве примера, первый экран многих приложений похож на диски «с бесплатными играми», в которых просто каталог ссылок на скачивание игр. То что это надо избегать и общие указания как это делать, написаны в статье.
  • +1
    Меня пример с «Сапёром» убил, если честно. То есть, я правильно понимаю судя по скриншотам, вместо «Запустил→Играешь в своём любимом режиме» теперь «Запустил → Любуйся на целый экран картинок и ачивок → Выбери режим → Полюбуйся на целый экран ачивок в этом режиме → Выбери «Играть» → Играй»?
    Я очень надеюсь, что я неправ, и такого кошмара там нет. Вживую W8 не пользовался.
    • 0
      На первом скриншоте сапера показано, как выглядит его главное окно. Выбор режима (9х9, 16х16 и т.д.), адвентур мод, ежедневные соревнования, смена темы игры. Если вправо потащить (или покрутить колесом) вылезают всякие ачивки и тому подобное. То есть начать игру можно все так же одним кликом в начальном окне. Но и за всем остальным не нужно лазить по менюшкам.
      • +1
        И того, давайте признаем, что наиболее часто единственную используемую фичу игры Вы отдалили от игрока на 1 клик, а остальные ему и даром не нужны, так?
        • 0
          Ну почему же? Я, например, не всегда играю 9х9, смотря сколько есть свободного времени. Хотя на счет всяких ачивок и тому подобного их XBOX согласен, нафиг их надо.
  • 0
    Ох, вот бы цитату из заголовка «улучшаторам» интерфейса в Win8… Ладно ввели свое сомнительное новое, но зачем насильно отрубать то, что хорошо работало до этого? Пусть теперь выслушивают от юзеров, куда им идти…

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

Самое читаемое Дизайн