Поиск по фасетной классификации

Процессы и методики

Stephanie Lemieux из компании Earley & Associates опубликовала хорошую вводную статью о том, как создавать сайты с поиском по фасетными структурам.

Designing for Faceted Search

Сенсорный экран с рельефными кнопками

Видео, Инновации и идеи

Мембрана опубликовала статью о работе аспиранта Криса Харрисона (Chris Harrison) и профессорк Скотта Хадсона (Scott Hudson) над формированием рельефных кнопок для сенсорных экранов.

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

Тактильный экран обрёл рельефные подвижные кнопки

Удобный способ прокомментировать результаты работ

Инструментарий

Встречая в перечне комментариев к дизайну фразы типа: «Блок флёрдоранжевого цвета нужно поменять местами с померанцевым» или «Что означает округлая хрень слева?», мы часто рискуем сломать мозг, пытаясь понять, что имелось в виду. Чтобы избежать недопониманий и ускорить процесс согласования, можно использовать сервис Redmark.

Redmarkit
Redmarkit: как объединить работу дизайнера и заказчика?

Я ♥ прототипы

Процессы и методики, Экранные интерфейсы

Vana Jurcic совсем недавно создала блог, в котором публикует ссылки на интересные примеры использования прототипов. Опубликовано уже порядка семидесяти примеров прототипов.

I ♥ wireframes

Новая серия концептуальных видеороликов от Microsoft

Видео, Инновации и идеи

Корпорация Microsoft на конференции CHI 2009 представила новую серию концептуальных роликов «XUI concept: Home, Work, (Play)». Это первая работа новой лаборатории под названием MS Volume Studio. О другой серии от MS — «Office Labs Vision 2019» — мы уже рассказывали ранее.

На видео пользователь взаимодействует с голографическими объектами, возникающими в окружающем его пространстве. Авторы называют такой тип интерфейса XUI: Experience User Interface, считая его следующим этапом в цепочке Graphics User Interface — Natural User Interface — Experience User Interface.

Пока что опубликовано два ролика из трех: «Дом» и «Работа». Позднее должен появиться фильм «Игра».

Microsoft’s Home & Work XUI concept videos

Средства разработки Rich-прототипов: MS Blend 3 и Adobe Flash Catalyst

Инструментарий

Алена Косинская, обладатель звания Expression MVP, сделала на российской конференции REMIX 09 доклад о MS Expression Blend 3 и его новых возможностях. На видео она на примере конкретного сайта показывает, как используются разные возможности Blend. Интересная новая функция: панель, которая визуально показывает связи между разными экранами.

Для бесплатного скачивания доступна бета-версия системы.

Аналогичный инструмент от Adobe под названием Flash Catalyst (рабочее название — Thermo) также позволяет создавать прототипы, в которых наглядно отображена логика поведения интерфейса и используемая в нем анимация. Catalyst полностью совместим с графическими программами от Adobe: Fireworks и Illustrator. Нарисованные, например, в Fireworks экраны можно затем «оживить» в Catalyst. А графические элементы уже готового прототипа можно подредактировать в Illustrator. Кроме того, при помощи среды Flex Builder разработчики могут, присоединив к интерфейсу backend системы, создать готовое Flash- или AIR-приложение.

К сожалению, счастливыми обладателями беты Flash Catalyst пока стали только посетители конференции MAX 2008, но скоро она должна появиться и в сети.

Официальная страница MS Expression Blend
Blend 3 и Sketch Flow: прототипируем приложения (видеозапись доклада)
Официальная страница Adobe Flash Catalyst
Getting Started with Flash Catalyst Tutorial (обучающая видеопрезентация)

Как важны хорошие слова

Остальное

Иногда за счет правильно подобранных слов можно реально повлиять на впечатления пользователя от системы.

Good, Better, Best

Копенгаген — будущее Windows?

Видео, Инновации и идеи, Экранные интерфейсы

Cullen Dudas собрал различные идеи по оптимизации интерфейса и дизайна Windows и представил их в виде концептуального видеоролика.

Prezi: zoom-презентации в zoom-интерфейсе

Видео, Инновации и идеи, Инструментарий, Экранные интерфейсы

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

Определенный интерес представляет и оригинально выполненное меню сервиса.

Prezi
Prezi: ваша скучная презентация в динамике (пост о сервисе в блоге «Интернетные штучки»)

Краткий список рекомендаций по общедоступности

Общедоступность

Хотя W3C издал свое руководство по принципам и технологиям общедоступности (accessibility), эти документы очень объемны и детальны и использовать их в повседневной работе не так уж удобно.

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

Intranet Design Considerations Cont. [PDF, 171KB]

3 новых сервиса удаленного тестирования

Инструментарий

За последнее время в сети появилось сразу 3 сервиса для проведения юзабилити-тестирования.

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

Loop¹¹ может работать не с картинками, а с реальными сайтами, оценивая успешность и время выполнения заданий пользователем. Для того, чтобы опробовать этот сервис, инвайта придется подождать некоторое время.

Бета нового варианта сервиса Fivesecondtest помогает провести тест пяти секунд, который заключается в том, что пользователь смотрит на изображение в течение 5 секунд и отмечает те детали, которые успели броситься ему в глаза за это время. Такой дешевый и быстрый тест в какой-то степени может заменить исследование с регистрацией движений глаз.

Usabilla
Loop¹¹
Fivesecondtest

8 характеристик удачного пользовательского интерфейса

Остальное

8 Характеристик удачного пользовательского интерфейса
8 Characteristics Of Successful User Interfaces

Основы зрительного восприятия и моделирование движений глаз

Исследования, Процессы и методики

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

Моделирование зрения. Содержание
Часть 1. Экскурсия в глаз
Часть 2. Восприятие
Часть 3. Геометрия зрения
Часть 4. Eye tracking
Часть 5. Как поймать взгляд
Часть 6. Моделирование eye tracking

Генераторы интерфейсов: не все золото, что блестит

Видео, Инструментарий, Процессы и методики

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

Джо Винчестер сам участвовал в разработке подобных генераторов и написал статью об их возможностях и недостатках.

User Interface Generation Tools: Silver Bullet or Fool’s Gold?

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

Другие лекции, вошедшие в данную программу:
Human-Computer Interaction Seminar (2006-2007)
Human-Computer Interaction Seminar (2007-2008)

В движении сила

Экранные интерфейсы

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

Изменения различных объектов в системе нужно также показывать пользователю в движении. Неожиданно попадав из пункта A и пункт B, человек может испытать серьезную фрустрацию. Если же он понимает, как он попал в пункт B, то чувствует в себе уверенность и готов адекватно реагировать на события.

Эта мысль проиллюстрирована парой простых анимаций.

The movement is the massage
Посмотреть иллюстрации

Коллекция материалов по Adobe AIR

Инструментарий

Adobe AIR — кросс-платформенная среда исполнения для построения динамичных приложений на основе Adobe Flash, Adobe Flex, HTML или AJAX. Adobe AIR интересен в качестве среды для реализации hi-fi прототипов.

Smashing Magazine опубликовал подборку справочных и учебных материалов по Adobe AIR.

Adobe AIR Developer’s Toolbox: Resources And Tutorials

47 способов воздействовать на поведение человека

Остальное

Британский промышленный дизайнер Дэн Локтон посвятил свое исследование этой проблеме. На сайте он описал 47 способов такого влияния, проиллюстрировав их множеством примеров. Также Дэн предлагает скачать плакат с 12 наиболее ценными способами и повесить его в своем рабочем кабинете.

Советы Дэна напрямую касаются промышленного дизайна, но будут полезны и проектировщикам взаимодействия.

The Design with Intent Toolkit v.0.9
Плакат [PDF, 1,3MB]

Поговорим о навигации

Подкасты

На последний виртуальный семинар UIE поступило такое количество вопросов, что за время семинара ответить на все не было никакой возможности. Поэтому для ответов на вопросы отдельно провели подкаст.

Тема семинара: «Улучшение навигации в веб-приложениях». Полуторачасовую видеозапись можно приобрести за $129.

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

1. Нужны ли хлебные крошки?
2. Как правильно реализовать раскрывающееся меню?
3. Как во время юзабилити-тестирования оценить степень уверенности пользователя?
4. Что следует учесть при построении информационной архитектуры вокруг пользовательских ролей?
5. В какой момент нужно разрабатывать навигацию?

SpoolCast: Web App Navigation Q&A Follow-up

70 удачных AJAX и JS-виджетов

Инструментарий

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

Среди примеров разные варианты реализации:

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

70 New, Useful AJAX And JavaScript Techniques

Анатомия веб-приложений

Подкасты, Процессы и методики

Подкасты Spoolcast постоянно радуют выбором актуальных тем и интересных собеседников, которых приглашает Джерид Спул — директор компании UIE.

Роберт Хокман Мл., соведущий Джерида по другой серии подкастов — Userability — рассказывал об использовании в проектировании веб-сайтов и веб-приложений понятия «структурных блоков» (Frameworks). Структурные блоки, такие, как каталог, поиск или авторизация, представляют собой определенный набор функций, страниц и элементов, выполняющих некоторую общую задачу в рамках системы.

В данный момент Роберт и Джерид работают над книгой о структурных блоках, которая выйдет в издательстве New Riders.

SpoolCast: Introducing Interaction Design with Frameworks