КАК УЛУЧШИТЬ ДИЗАЙН САЙТА. ТЕСТИРОВАНИЕ ЮЗАБИЛИТИ ИНТЕРНЕТ-РЕСУРСОВ РУССКОЯЗЫЧНЫХ СОЦИАЛЬНЫХ СЕТЕЙ

В статье с позиции эргономики рассмотрен дизайн сайтов русскоязычных социальных сетей. Для оценки качества дизайна сайтов «Одноклассники», «Мой Мир» и «ВКонтакте» было проведено usability-тестирование. Установлено, что мнения пользователей к изменениям в дизайне уже работающего сайта не однозначны и, во многом, противоречивы. Это доказывает, что в условиях конкуренции дизайнеры социальных сетей должны не только грамотно организовывать навигацию, но и максимально учитывать реакцию целевой аудитории при решении композиционных задачи и выборе цветового решения.

Ключевые слова: юзабилити, дизайн, социальные сети, usability-тестирование, визуальный контент, текстовый контент, структура сайта.

«В результате многолетних исследований,

команда Mail.Ru выяснила, как сделать Мир лучше.

В данный конкретный момент мы завершаем работу над очередным этапом.

Пожалуйста, обновите страницу через 30 секунд».

Актуально, но не изучено

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

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

Обзор большого количества посвященных эргономике публикаций выявил, что в основном обсуждается важность и необходимость проведения оценки юзабилити коммерческих сайтов, задачей которых является реклама компании или продукта, а так же непосредственная продажа последнего. О социальных сетях, как правило, речь не идет. Между тем, актуальность данной темы подтверждается тем, что уже на первой конференции по юзабилити User Experience 2007 были выступления, посвященные вопросу эргономике сайтов социальных сетей [1]. Однако докладчики рассказывали в основном о том, что такое социальные сети, истории их создания. Так, в тезисах одного из участников аналитика Владимира Климентьева прямо объявлено, что целью доклада являлось «раскрыть содержание социологического понятия «социальная сеть» применительно к сайтостроительству» [2]. В других статьях этого автора [3] рассматривается популярность той или иной социальной сети с точки зрения статусов сервисов и социологического анализа их аудитории и контента, а не графического дизайна сайта. Та же ситуация наблюдалась и на первой мини-конференции по юзабилити и дизайну интерфейсов, прошедшей в Минске в 2009 году [4]

Вероятно, это происходит потому, что юзабилити изначально связывается в большей степени с функциональностью интернет-ресурсов, понятностью элементов управления и режимов работы, с количеством и нужностью функций, а не с восприятием их изобразительного ряда. И в некотором смысле происходит определенное противопоставление. Так, по мнению некоторых обозревателей, даже идет война между специалистами по удобству интерфейсов и дизайнерами-графиками. «К чему все эти их новаторские эксперименты с внешним видом сайта? Почему они не могут сделать все проще, без наворотов?», - интересуются первые. Дизайнеры-графики со своей стороны считают «спецов» по юзабилити слишком ограниченными и прямолинейными. «Что значит, внешний вид - лишь просто глазурь на торте. Без графического дизайна, сайт - это просто голая схема» [5].

Признанный «гуру» юзабилити Якоб Нильсен, в активе которого 16 патентов, несколько книг и множество статей в этой области, настаивает на том, чтобы графический дизайн использовался для улучшения интерактивности, а не просто для красоты. Специалисты по эргономике считают, что дизайнеры-графики слишком сильно полагаются на чувства. Что неудивительно: графическое оформление сайта неразрывно связано с творчеством, фантазией, и его невозможно стопроцентно привести в соответствие с рецептом что надо, а что не надо делать. Но Web слишком велик, чтобы в нем возобладала лишь одна точка зрения. Для одних сайтов более важна эффектная подача, которая не укладывается в «принципы» Нильсена, а другим сайтам наоборот необходима упрощенная до предела навигация и высокая скорость загрузки

В то же время, графический дизайн должен отвечать предлагаемым задачам и способствовать сильному образу интернет-ресурса. Ведь именно графический дизайн может быть «приманкой», интуитивно понятной для целевой группы пользователей с точки зрения их интересов, пола, возраста. Юзабилити графического дизайна интерфейса, во многом определяет качество сайта, его удобство для пользователя, а значит и привлекательность для потенциального «юзера». Так в сентябре 2008 года произошел резкий рост числа посетителей фото-приложения на facebook. И причиной этого стал редизайн. На главной странице профиля появилась панель инструментов с навигацией: стена (feed), информация (info), фото (photos). То, что вопросы удобства и комфортности графического дизайна сайтов постепенно выдвигаются на первый план, подтверждает и такой пример: письмо-вирус, распространенное в социальной сети «ВКонтакте» в ноябре 2010 года было посвящено именно вопросам изменения в интерфейсе, в расчете на то, что этим заинтересуется большинство пользователей.

Лучший метод - тестирование

Для определения степени эргономичности того или иного интернет-ресурса обычно применяют usability-тестирование. Это экспериментальный метод, построенный на интервьюировании пользователей по заранее составленному сценарию и направленный на выяснение того, как они применяют продукт. Смысл usability-тестирования состоит в выявлении трудностей, с которыми сталкиваются пользователи, работая с сайтом [6]. Программисты и специалисты по юзабилити-тестированию разрабатывают различные «чек-листы» и тесты для проведения этой операции [7]. Учитывая результаты тестирования, можно улучшить интерфейсы так, чтобы целевая аудитория продукта наиболее плодотворно работала с его финальной версией. Якоб Нильсен предлагает свою эвристическую оценку, которую считает одним из методов юзабилити, выявляющим проблемы в дизайне пользовательского интерфейса, Эвристическая оценка проводится респондентами, которые оценивают интерфейс и высказывают свое мнение о том, что именно их не устраивает в дизайне. При этом все исследователи сходятся в мысли, что для полноценного исследования достаточно всего 5-10 респондентов, так как при слишком большом количестве опрашиваемых будет в основном получаться повторяющаяся информация.

Мы провели собственное usability-тестирование для оценки дизайна сайтов русскоязычных социальных сетей. Для большей объективности результатов к опросу было привлечено 7 респондентов возрастом от 25 до 50 лет, работающих в области графического дизайна (полиграфисты, фотографы). Им предлагалось оценить удобство структуры личных страниц пользователей этих сетей.

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

Результаты тестирования подтвердили, что практически все респонденты являются пользователями этих трех наиболее «старых» русскоязычных социальных сетей. По данным TNS, ежемесячная российская аудитория «ВКонтакте» составляет 19,5 млн. человек, «Мой Мир» 18 мил, «Одноклассники» – 15 млн. У других сетей число посетителей скромнее [8]. Их функциональность примерно одинакова: можно создавать свой профиль, общаться, вступать в группы и самому создавать их, постить видео и фото, играть в игры, пользоваться другими приложениями и многое другое.

Проведенное исследование позволяет с высокой долей точности сравнить юзабилити этих интернет-ресурсов.

Визуальный контент

Личная страница пользователя ресурса «Одноклассники» встречает посетителей цветовой гаммой теплых оранжевых тонов, уже одно это отличает ее от синеватого клона «фейсбука» - сайта «ВКонтакте» и обычно также решенного в синих тонах «Моего Мира». Однако респонденты не нашли это преимуществом и были склоны оценивать цветовое решение скорее нейтрально, чем положительно. «Оранжевый и зеленый, видимо, символизируют лето, молодость и должны выглядеть жизнеутверждающе, однако выглядит это, как раз таки, не стильно и «режет глаз»», - отмечает один из интервьюируемых. Именно по вопросу «Не кажется ли вам эта цветовая гамма сайта слишком элементарной или простоватой?» - «Одноклассникам» был преимущественно вынесен вердикт: «Да, и можно бы сделать поинтересней». В то же время однотонное цветовое решение «ВКонтакте» было большинством голосов признано стильным. Для этого же ресурса некоторый аскетизм в наличии графических элементов был отмечен меньшинством респондентов. Для двух остальных сайтов их количество было признано достаточным.

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

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

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

Текстовый контент

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

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

Общая структура

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

Структура «Моего Мира» стала объектом наибольших нареканий. Подавляющее большинство интервьюируемых отметили, что информация не структурирована по значимости, элементы управления расположены не логично и не там, там, где их привыкли видеть посетители. Как отмечает один из респондентов: «Мой Мир» - как восточный базар, в нем все есть, даже волшебные палочки, но уж чересчур назойливо, все напоказ, кричаще, «воздуха» не хватает». Но у этого есть и свои преимущества. Как отмечает другой участник тестирования: «В „Моем Мире“ есть все, что мне нужно для общения, хотя перебор с рекламой и особенно напрягает отчет о друзьях. „ВКонтакте“ в этом плане лучше продумано, там все логично и стильно, но неудобный поиск и мало возможности пересечься с человеком».

Заключение

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

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

Современные пользовательские интерфейсы так же сложны, как и современное программное обеспечение. Причина в большом количестве факторов, которые приходится учитывать разработчикам. Якоб Нильсен, основываясь на 20 годах исследований, считает, что идеальный интерфейс невозможно разработать с первого же захода. Даже самый маститый дизайнер с мировым именем не сможет моментально создать интерфейс, который идеально прост, соответствует всем требованиям пользователя и работает безошибочно. Это просто невозможно сделать.

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

ЛИТЕРАТУРА

1. Макарова А. А кто проверял полезность юзабилити? / SEONEWS.RU - поисковый маркетинг [Электрон. ресурс]. – 2009. – 11 августа. - Режим доступа http://www.seonews.ru/events/detail/43261.php

2. Климентьев В. Юзабилити социальных сетей / тезисы к докладу – 2007. – 4 ноября - Режим доступа: http://www. wklim.ru/tezisyi-k-dokladu-yuzabiliti-sotsialnyih-setey/

3. Климентьев В. Почему МойКруг проигрывает Одноклассникам, ВКонтакте и ЖЖ?; Место социальной сети в социальных трансформациях; Социальные сети - чпок, и нету и др. / Сайт Владимира Климентьева - Режим доступа: http://www.wklim.ru/category/pishu/socialnye-seti

4. Сергеев А. Юзабилити, как гормон роста социальной сети // Последние тенденции в мире юзабилити [Электрон. ресурс]. – Блог компании HumanoIT Group. – 2009 – 3 марта. - Режим доступа: http://www. guicci.ru/2009/03/03/yuzabiliti-kak-gormon-rosta-socialnoj-seti/

5. Cloninger C. Usability Experts are from Mars, Graphic Designers are from Venus / Webmascon [Электрон. ресурс]. - http://webmascon.com/topics/designgeneral/2b.asp

6. Д. Сатин, Современные технологии usability-тестирования // Мир ПК [Электрон. ресурс]. – Электрон. журн. – 2007. – 13 июля. - Режим доступа: http://www.osp.ru/pcworld/2007/05/4269863

7. www.senshov.ru/UCL.doc, bestwebdesignschools.com/2009/usabilityedu-25-incredibly-useful-usability-cheat-sheets-checklists, www.userfocus.co.uk/resources/guidelines.html

8. Мосолов Т. Социализируйся, а то …проиграешь. - Режим доступа: http://www.blog.poligrafi.com/post_920#more-920

9. Нильсен Я. Top Ten Web Design Mistakes of 2005 / Webmascon [Электрон. ресурс]. – 2005. – 10 марта. - Режим доступа: http://www.webmascon.com/topics/designdetails/33a.asp