Десять способов сориентировать пользователя на сайте

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

Imagine you’re driving along and due to a road closure you have to follow those conspicuous yellow detour signs. You’re now on an unfamiliar road, but because of the signs you confidently proceed, comfortable in trusting the arrows to tell you where you need to go. Then there’s a roundabout and no sign. Do you turn left? Right? You’re lost and have two choices; turn back and find an alternate road you know well or blindly drive around and hope for the best.
Websites are very similar, no matter what their ultimate goal is, your site visitors need to intuitively find their way around. Too often, general website navigation and orientation disappears or changes on internal pages. In fact, with websites this point is even more pertinent as users can just ‘evaporate’ and leave your site, instead of being forced to drive around aimlessly!

Представьте, что вы едете на машине, и из-за того, что основную дорогу ремонтируют, вам приходится ориентироваться на знаки объезда. Сейчас вы двигаетесь по незнакомой дороге, но двигаетесь уверенно, потому что есть дорожные знаки, на которых указано, куда нужно поворачивать. А потом вы выезжаете на кольцевую развязку, и никакого указателя там нет. Куда надо поворачивать? Направо? Налево? Вы заблудились, и у вас есть два выбора: развернуться и искать другой путь или наудачу двигаться дальше, надеясь на лучшее.
Работа с вебсайтами очень похожа на езду по незнакомой дороге. В независимости от того, какая у посетителя цель, он должен ориентироваться на сайте и находить дорогу. Слишком часто из-за неправильной навигации пользователи теряют ориентацию на сайте, уходя вглубь него. Для сайтов это очень критично, потому что пользователи скорее просто сдадутся и уйдут с вашего ресурса, чем будут пытаться найти путь.

10 ways to orientate users on your site

О мелочах в интерфейсе

Инновации и идеи, Остальное

Очевидно, что при разработке интерфейса (если таковая вообще выделяется в отдельный этап), за всем не уследишь, более того, всегда есть приоритеты; в первую очередь прорабатываются ключевые функции, затем второстепенные, а потом все шлифуется до воображаемого блеска. Как правило, сроки проекта поджимают уже на стадии реализации ключевого функционала, и шлифовка откладывается до второй версии, а потом и до третьей. Мелочи в данном случае – это тот блеск, который появляется при шлифовке, – блеск «настоящих» елочных игрушек, которые «радуют». А зачастую это и крючок для того, чтобы игрушку можно было повесить на елку, избавляющий от поисков канцелярской скрепки в предновогодней суете.

О мелочах в интерфейсе

Интервью с Доном Норманом

Гаджеты, Инновации и идеи, Остальное

Ресурс CNET опубликовал интервью с одним из самых известных пропагандистов человекоориентированного подхода, автором книги «Дизайн привычных вещей», Дональдом Норманом. Сегодня на Хабрахабре опубликовали перевод этого интервью, правда, вырезав небольшой кусок.

Итак, когда же мы избавимся от мышей?
Зачем от чего-то избавляться, если оно хорошо работает?.. Проблема здесь не столько в самой мыши, сколько в задачах, которые требуют длительных периодов повторяющихся движений. Настоящий вопрос состоит в том, как нам взаимодействовать с нашими технологиями? Клавиатура по-прежнему лучше всего подходит для ввода текста, а выбор объектов лучше всего осуществлять через указание курсором.

Каков потенциал технологии мультитач, которую мы видим у Apple и Microsoft?
Тач-скрин действительно эффективен для некоторых вещей, но не для всего. Он эффективен в операциях с графикой, где вам нужно манипулировать объектом и одновременно позиционироваться на экране, и возможно, вращать, а также в приложениях, где несколько людей хотят участвовать одновременно. Это может быть хорошо для коллективного решения проблем, но это не тот инструмент, который может всё заменить.

Интервью с Доном Норманом (English)
Перевод интервью на Хабрахабре

Введение в инфографику (часть 1)

Остальное

Infographics are traditionally viewed as visual elements such as charts, maps, or diagrams that aid comprehension of a given text-based content.
However, as we shall see in this article, visual representation of information can be more than just the manner in which we are able to record what has been discovered by other means. I hope to establish that they have the potential to become the process by which we can discern new meaning and discover new knowledge.

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

Infographics: Being and Doing (Part I)

Проектировщик взаимодействия или специалист по информационной архитектуре?

Остальное

В блоге «Boxes and Arrows» подняли вопрос о различии специалистов по проектированию взаимодействия (interaction designer) и специалистов по информационной архитектуре (information architect). В том числе в статье обсуждается и то, как видят и видят ли вообще это различие работодатели.

Getting Hired: What Employers Really Want

Бюллетень «Эргономика & Юзабилити»

Инновации и идеи, Остальное, События

В полку бюллетеней о юзабилити прибыло. Теперь (мы надеемся, регулярно) можно будет читать дайджест компании HCI.ru. На наш взгляд, первый выпуск получился достаточно интересным. Свое мнение об издании вы можете выразить здесь в комментариях или написать непосредственно авторам.

Страница бюллетеня «Эргономика & Юзабилити»
Первый выпуск бюллетеня (PDF, 1.20Mb)

Каким будет человеко-компьютерное взаимодействие в будущем?

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

Журнал Smashing Magazine снова радует интересным обзором. На этот раз рассмотрению подверглись тенденции развития человеко-компьютерного взаимодействия. Какие-то вещи, вроде multi-touch, сейчас у всех на слуху. Какие-то, вроде технологии, использованной в музыкальном инструменте Reactable, неоднократно освещались, но пока не получили широкого распространения. Какие-то практически неизвестны, но от этого не теряют своей интересности. В общем, читайте, смотрите, делайте прогнозы.

Monday Inspiration: User Experience Of The Future

Дизайн форм: почтовые индексы и адреса

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

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

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

Дизайн форм: почтовые индексы и адреса
Web Form Design: ZIP Codes & Locations

Примеры и советы по организации систем листания страниц

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

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

Pagination Gallery: Examples And Good Practices

Новый выпуск Journal of Usability Studies (November 2007: Volume 3, Issue 1)

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

Недавно вышел ноябрьский номер Journal of Usability Studies (журнал исследований в области юзабилити)

Статьи номера

Caroline Jarret
On the problems and joys of reading research papers for practitioner purposes (PDF)
(О радостях и горестях чтения исследований в практических целях)

Jonathan Howarth, Terence S. Andre, and Rex Hartson
A Structured Process for Transforming Usability Data into Usability Information (PDF)
(Структурированный процесс трансформирования данных юзабилити в полезную информацию)

Young Sam Ryu, Kari Babski-Reeves, Tonya L. Smith-Jackson, and Maury A. Nussbaum
Decision Models for Comparative Usability Evaluation of Mobile Phones Using the Mobile Phone Usability Questionnaire (MPUQ) (PDF)
(Модели принятия решений при сравнительной юзабилити оценке мобильных телефонов основанные на специальном юзабилити опроснике)

Juan E. Gilbert, Andrea Williams, and Cheryl D. Seals
Clustering for Usability Participant Selection (PDF)
(Сегментация выбора респондентов на основе кластерного анализа)

Journal of Usability Studies (November 2007: Volume 3, Issue 1)

Устройство ввода для жителей Индии и Азии

Гаджеты, Инновации и идеи

HP совместно с Human Factors International разработали специальное устройство ввода для жителей южно-азиатских стран. Дело в том, что QWERTY-клавиатуры, привычные европейцам и американцам, не очень-то подходят для жителей Индии и Юго-Восточной Азии. В их языках используется несколько сотен различных символов, многие из которых различаются одни-двумя завитками. Расположить их все на стандартной клавиатуре невозможно, а убрать какие-то тоже непросто. Вот как решили эту проблему HP и Human Factors:

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

Case Study: HP Creates an Award-Winning Keyboard

Когда персонажи не полезны (дискуссия)

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

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

Examples where personas are *not* useful (discussion)

SMS-клавиатура для компьютера

Гаджеты

Такую вот клавиатуру придумали умельцы из компании Cre8txt. Она позволяет сохранить навык набора SMS-сообщений при наборе текстов на компьютере. Программой, которая идет в комплекте в том числе поддерживается предикативный ввод текста, а также перевод слэнговых сокращений типа «luv u» на нормальный язык.

Cre8txt

Amazon.com выпускает устройство для чтения электронных книг

Видео, Гаджеты

Всемирно известный магазин Amazon.com на днях выпустил гаджет для чтения электронных книг. Новинка называется Kindle и представляет собой прибор, смахивающий на большой электронный переводчик. В дисплее используется технология так называемой «электронной бумаги»: высокая контрастность и монохромность. По мнению создателей, текст, представленный на таком мониторе выглядит совсем как напечатанный на обычной бумаге.

Amazon Kindle

Мобильный телефон для людей с ограниченными возможностями

Гаджеты, Общедоступность

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

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

DoroMobile

Найм персонала при помощи вебсайта

Остальное

Хотите создать сайт для найма персонала? Он у вас уже есть? И в том, и в другом случае, почитайте статью, опубликованную в английском журнале «The Recruiter». Она посвящена тому, что нужно делать и чего стоит избегать при создании сайтов для найма.

The Recruiter: How useable is your website?

Демонстрация концепции при помощи бумажных прототипов

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

Вот как при помощи метода бумажных прототипов проводится демонстрация концепции сервиса знакомств для КПК:

Создание удобных и доступных игр на основе паттернов взаимодействия

Гаджеты, Инновации и идеи, Общедоступность, Экранные интерфейсы

Traditionally best practices concerning interface/interaction design have been captured by means of guidelines or heuristics such as Nielsen’s heuristics. The purpose of guidelines is to capture design knowledge into concise small rules, which can be used to inform interface and interaction design.
Attempts to capture design knowledge have been made with regard to game interaction design. Houser & Deloach present seven principles for effective game design. Melissa Federoff has looked at how existing usability heuristics such as proposed by Nielsen apply to games and a set of 42 game heuristics is proposed.
This paper will argue that many usability-improving solutions in games can be beneficial for players with disabilities and the other way around.

Традиционно, создание интерфейсов и проектирование взаимодействия основывалось на принципах (гайдлайнах) или эвристиках в стиле Якоба Нильсена. Задача гайдлайнов — собрать массив знаний о проектировании в виде коротких правил.
В области проектирования взаимодействия с компьютерными играми также были сделаны попытки собрать такие знания. Хаусер и Делоуч (Houser & Deloach) описывают семь принципов эффективной разработки игр. Мелисса Федерофф (Melissa Federoff) решила проверить, насколько существующие эвристики (как например, описанные Нильсеном) можно применить к компьютерным играм. В итоге получился набор из 42 эвристик.
В этой статье мы обсудим, как множество решений, улучшающих юзабилити игры, положительно влияют на ее доступность людям с ограниченными возможностями и наоборот.

Designing Usable and Accessible Games with Interaction Design Patterns

Построение персонажей на основе статистических данных

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

Incorporating the voice of the user into user experience design by using personas in the design process is no longer the latest and greatest new practice. Everyone is doing it these days, and with good reason. Using personas in the design process helps focus the design team’s attention and efforts on the needs and challenges of realistic users, which in turn helps the team develop a more usable finished design. While completely imaginary personas will do, it seems only logical that personas based upon real user data will do better. Web analytics can provide a helpful starting point to generate data-backed personas; this article presents an informal 5-step process for building a “persona of the people.”

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

Building a Data-Backed Persona

7 юзабилити рекомендаций для сайтов на мобильниках

Гаджеты, Экранные интерфейсы

These 7 guidelines are based on actual user research conducted with mobile phone users. Users were asked to carry out typical tasks on popular websites using a mobile phone browser. The issues they encountered were used to produce these guidelines.

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

7 usability guidelines for websites on mobile devices