Окулографические исследования: что может рассказать взгляд

Original author: Thierry Bouillot, Sophie Raedersdorf
  • Translation
imageОт переводчика. Методики окулометрического тестирования(айтрекинга) в последнее время получили широкое распространение в сфере юзабилити. Публикуя перевод статьи французских исследователей-юзабилистов Тьерри Буйо и Софи Рэдесдорф, мы приглашаем наших читателей к обсуждению проблем визуального восприятия интерфейсов. Какие элементы интерфейса привлекают внимание пользователей? Как связаны визуальная привлекательность и функциональность? Насколько важен учет психологических особенностей человеческого восприятия при разработке интерфейсов приложений и сайтов?
Разговор об айтрекинге невозможен и без обсуждения важных методологических вопросов. С помощью окулографа можно с высокой точностью представить траекторию движения взгляда, зафиксировать зоны повышенного внимания, но может ли это хоть что-то рассказать о том, как испытуемые интерпретируют видимое? Мысли и чувства пользователей невозможно зафиксировать с помощью приборов; результаты исследований смысловой сферы не могут быть подвергнуты экспериментальной проверке. Можно ли (и если можно, то как) выработать такую стратегию исследования человеческого фактора, в которой учет всех субъективных моментов сочетался бы со строгостью методологии и общезначимость результатов?
Мы надеемся, что в обсуждении статьи примут участие представители самых разных областей знания: программисты, дизайнеры, философы, психологи.


Окулографические исследования (иногда называемые также айтрэкингом, от англ. eye tracking) стали весьма модной тенденцией в сфере веб-разработки. Действительно ли они так полезны и эффективны? В чем заключается различие между окулографией и традиционными методиками юзабилити-тестирования и эргономической оценки? Попытка ответа на эти вопросы будет предпринята ниже.

Анализ того, что мы видим

Окулография уже давно используется в научных исследованиях, а также в промышленности. Смысл исследования заключается в анализе движения взгляда и зон визуальной фокализации, на которых концентрируется взгляд. Анализ осуществляется на основе показаний специального прибора — окулографа (айтрекера).
Чаще всего целью исследования является изучение реальных сценариев работы с сайтом путем отслеживания движений взгляда. Предметом исследования является компоновка информации на сайте и ее пертинентность, т. е. соответствие информационным потребностям пользователя. Данные анализа могут быть представлены в двух формах: траектория движения взгляда (англ. gaze plot) и тепловая карта (англ. heat map).

eye tracking : le parcours oculaire

График движения взгляда отображает последовательность движений глаз при рассматривании образа. Остановки взгляда обозначаются кружками, а линии передвижения — чертами.

Eye tracking : carte de chaleur

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

Айтрекинг и маркетинг

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



Результаты исследования распределения взгляда 106 испытуемых на материале двух вариантов дизайна рекламы детских подгузников. Пример взят из статьи Джеймса Бриза Вы смотрите туда, куда они смотрят

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

Выявление паттернов навигации с помощью окулографического исследования

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

Движение взгляда по веб-странице напрямую зависит от того, как на ней расположена информация. Так, результаты анализа свидетельствуют о том, что пользователи почти не задерживают взгляда на рекламных баннерах (этот феномен получил название баннерной слепоты, от англ. banner blindness). На приведенных ниже рисунках видно, что взгляды испытуемых почти не останавливались на баннерах (как статических, так и анимированных), расположенных как в верхней части, так и по краям веб-страницы:



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

Еще одним паттерном визуального поведения, обнаруживаемым при помощи окулографических исследований, является так называемое F-образное сканирование. С ним приходится сталкиваться при чтении текстов на веб-страницах, а также при просмотре результатов поиска, когда информация представлена в виде текстовых блоков, расположенных друг над другом. Траектория движения взгляда напоминает латинскую букву F (отсюда и название): две горизонтальные линии, а затем — одна вертикальная. Процесс F-образного сканирования можно разделить на три фазы: сначала пользователь прочитывает текст в верхней части страницы (первый горизонтальный элемент буквы F), затем направляет взгляд ниже, находит и прочитывает показавшиеся наиболее интересными фрагменты текста (второй горизонтальный элемент), после чего просматривает остальную часть страницы сверху вниз (вертикальный элемент).



Тепловые карты F-образного сканирования (из статьи Якоба Нильсена F-образный паттерн чтения веб-контента)

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

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

Окулографическое исследование как средство измерения юзабилити веб-страниц

С точки зрения эргономики и юзабилити качественной следует считать веб-страницу, целиком отвечающую пользовательским ожиданиям, отличающуюся доступным и понятным содержание, а также удобством навигации.
Пользователи, как правило, сразу же обращают внимание на важные элементы страницы: полезные ссылки, формы поиска, меню навигации и т. п. Результаты окулографических исследований свидетельствуют о том, что эти элементы привлекают внимание и моментально распознаются испытуемыми. Второстепенные элементы (рекламные баннеры, ссылки на версию сайта на другом языке и т. п.) не должны моментально привлекать взгляд: иначе они будут отвлекать от решения действительно важных задач.
Временной промежуток между началом просмотра страницы и обнаружением нужного элемента содержимого должен быть как можно более коротким. В первую очередь привлекают взгляд фрагменты текста, написанные крупным или жирным шрифтом — во многом по той причине, что они представляют собой заголовки либо краткие и емкие фразы, на чтение и понимание которых не требуется времени и усилий. Важно, чтобы способы представления текста на веб-странице отвечали ожиданиям посетителей: наиболее интересная и важная информация должна быть размещена там, куда взгляд пользователя устремляется прежде всего. При представлении всего текстового содержимого в одинаковой манере может случиться так, что взгляд будет блуждать по странице, не задерживаясь на каких-то конкретных фрагментах, из-за чего важная информация может проигнорировано.
Грамотное визуальное расположение очень важно и для таких элементов, как заполняемые текстовые поля, чекбоксы, радиокнопки. Ярлыки, обозначающие эти элементы, должны находиться в непосредственной близости от них. К сожалению, разработчики нередко забывают об этой простой и очевидной истине. Окулографическое исследование позволяет подобрать удачные варианты расположения:



Точки фиксации взгляда на заполняемых текстовых полях (из статьи Почему пользователи быстрее заполняют формы с надписанными сверху названиями), опубликованной в блоге UX Movement

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

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

Заключение

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

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

При всех своих очевидных преимуществах методики айтрекинга имеют один существенный недостаток: с их помощью можно получить представление о движении взгляда, но нельзя объяснить, почему взгляд задержался на каких-то конкретных элементах страницы и чем они привлекли внимание пользователя. Как исследовать процесс интерпретации содержимого веб-страницы? Об этом речь пойдет в нашей следующей публикации.
ALEE Software
43.28
ПО стандартизации и управления качеством
Share post

Comments 29

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

    Грамотное для каких случаев? Не раз наблюдал применение принципа «юзабилити ради юзабилити».

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

    Какой вывод из вышесказанного? Usability-специалисты должны решать конкретные задачи, а не абстрактные.
      0
      Если я верно понял статью, то речь как раз о том и шла, что человек, даже заполняя форму в первый раз, будет испытывать ненужное напряжение в случае если подсказки находятся не сверху, и даже может в них не вчитаться.
      И, напротив, форма ему покажется более комфортной если расположить подсказки сверху/сверху.
        +2
        Если бы вы внимательно прочитали мое сообщение, и тем более над ним подумали, то поняли, что я не отрицаю сказанное в статье и вашем комментарии, а только ограничиваю область применения правого варианта формы.

        Но нет, давай минусовать скорее. Что за люди пошли… Никакой конструктивной беседы.
        0
        А Вы не могли бы привести примеров того, что Вы называете «юзабилити ради юзабилити»? Было бы интересно обсудить этот вопрос на конкретном материале.
          +1
          В любом деле нужно понимать, какую именно задачу нужно решать.

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

          С точки зрения бизнес-процессов банка, это катастрофическая ситуация. Были удалены два поля, которые играют одну из ключевых ролей в проверках анкеты на благонадежность заемщика (fraud-detection).

          Итак, что выиграл банк? Привлечение нескольких процентов заполняющих предварительную анкету? Чего лишается банк? Его скоринговые алгоритмы могут пропустить больше мошенников, так как уменьшается объем информации, которую можно анализировать. А потери тут могут исчисляться шестизначными числами.

          С точки зрения работы юзабилити-специалиста они делали вроде как и добро. С точки зрения бизнес-процессов, они делали зло. Пиррова победа.
            0
            Присоединяюсь к вашей позиции. Нежелание детально входить в предметную область, эдакий интерес только ко внешней стороне вопроса, характерен для некоторых юзабилити-специалистов. Надеюсь, что это временная тенденция характерная для начального периода развития данного сектора ИТ-рынка.
              0
              Эти «некоторые» юзабилити-специалисты читают доклады на конференциях… А на вопрос, вы чего творите, мне сказали фразу, после которой я больше не стал задавать вопросы: «Мы достигли нужного (нам) результата». А дальше хоть трава не расти.
                0
                Вы не сможете запретить им читать эти доклады, так же как и не сможете восхищенной аудитории им аплодировать. Весь вопрос в общем уровне просвещенности целевой аудитории. Чем выше этот уровень, тем сложнее протолкнуть туфту с высокой трибуны. Кстати действенный метод борьбы с безграмотностью населения — задавать вопросы сразу после доклада и в онлайне.
                  0
                  Задаю. Но редко кто понимает причины, почему я задаю именно такие вопросы.
                    0
                    Именно поэтому мы и затеяли данный блог, самим учиться и людей образовывать.
        0
        Интересно.
          –7
          Нда… Безсодержательная статья, тупо не о чем.
            0
            Весеннее обострение тро-ло-ло?
              0
              Мы принимаем и уважаем любое мнение. Мы открыты для критики. Однако не следует забывать о культуре общения и о логической культуре: любое замечание должно быть обоснованным, аргументированным. Статьи публикуются в этом блоге для того, чтобы инициировать продуктивную дискуссию по актуальным вопросам. А Ваша манера ведения диалога больше напоминает не продуктивный дискурс, а пустой треп.
                0
                Ок. Вот смотрите — профильный ит ресурс.
                Причем тут эта вата изложенная на нескольких страницах?
                Прочитав всю статью я был разочарован отсутствием какой-либо полезной/интересной информации.
                Статья из раздела «очередная статья на лента.ру» либо вообще введение в курсовой. Смех же.
                  0
                  Во-первых, данная статья представляет собой своеобразное введение к серии публикаций. Во-вторых, если Вы не нашли для себя ничего полезного, это не значит, что эта статья не заинтересовала других. В-третьих, понятия «вата» и «смех» выражают Ваше субъективное мнение, которое не обязаны разделять другие.
                    0
                    Неужели я заставляю Вас разделять свое мнение? :)
                    0
                    Согласен с «ватой и с мехом», тем более, что аппаратная окулометрия применяется даже фрилансерами для определения юзабельности своих работ, а оборудование продается в любом магазине бытовой техники.
                0
                Вот на основе таких исследований и пилят огромные бюджеты.
                Все из-за чего? Нормальных дизайнеров, которые чувствуют и/или знают как «вкусно» подать информацию, мало.
                А поставить на конвейер производство «вкусных сайтов» хочется.
                  –1
                  вы едите сайты!?!?!
                  давно пора забыть это уродующее слух слово
                    0
                    Это слово из сленга дизайнеров и маркетологов. Это тематический ресурс и сленг тут норма вещей
                      –1
                      Это слово из сленга долбоебов.
                    0
                    Почему же? Дизайн решает вполне конкретные задачи, и на чистом чувстве или интуиции тут далеко не уедешь. Нужно все продумать: как работать с клиентом, с материалом, как выстраивать коммуникацию… А для этого (в особенности если речь идет о дизайне интерфейсов приложений и сайтов, которые опять же создаются не просто так, а для решения определенных задач) требуется некоторая предварительная подготовка.
                    Окулография — всего лишь один из методов. На универсальность он не претендует и полезным может оказаться лишь в ограниченном количестве случаев.
                    0
                    очень интересно. и не задумывался о том какие классные есть методы.
                      0
                      А каким прибором проводят такие исследования?
                        +1
                        Электроокулографом. Прибор этот чем-то напоминает тот, что используется для снятия кардиограмм. У наружных узлов глаз закрепляются электроды, сигнал поступает на прибор, а оттуда — в компьютер.
                        Также часто используется инфракрасный айтрекер. По виду он мало чем отличается от обычного компьютерного монитора (хотя в отличии от монитора он чаще имеет квадратную, а не прямоугольную форму). Испытуемый просматривает изображения на экране, а в это время его лицо подсвечивается инфракрасным излучением и снимается одновременно на несколько камер. Специальная программа анализирует взаимное расположение зрачков и бликов от инфракрасного излучения, что, собственно, и позволяет определить траекторию движения взгляда. Весь процесс записывается, сохраняется в отдельном ролике; с помощью программы также можно сопоставлять результаты исследования о различных испытуемых.
                          0
                          Спасибо за ответ, наверное это дорогие аппараты? Видел системы с помощью обычной веб-камеры анализируют положение глаза, что-то типа управления курсором взглядом. По идее это технически дешевле и приспособить в акулографии можно.
                        0
                        В первом приближении основную проблему я вижу даже не в технологии фиксации взгляда, а в интерпретации поведения пользователя. Основная наука начинается именно с этого момента.
                          0
                          Собственно, во всех экспериментально-психологических исследования существует опасность подмены предмета: исследователь наблюдает физиологические реакции испытуемого, следит за его поведением, выслушивает произносимые испытуемым слова — и нередко забывает о том, что психика представляет собой сложное целое, несводимое к сумме внешних проявлений. Психика — это в первую очередь смысловая сфера. Цель всех методов исследования психики — пробиться к тому, что человек думает, чувствует, какие ассоциации у него возникают. Без понимания того смысла, который люди вкладывают в работу с веб-приложениями и сайтами, нельзя достичь существенных результатов в сфере дизайна и юзабилити. Более подробно данные вопросы будут проанализированы в следующей статье — появится в этом блоге до конца недели.

                        Only users with full accounts can post comments. Log in, please.