Tag Archives: конверсия

Секреты гейм-девелопмента: 47 игровых механик

1 Ноя

Что заставляет миллионы людей ежедневно кормить несуществующих рыбок, покупать несуществующие дома и «прокачивать» пиксели в виде свиней до 9-го уровня?

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

Пока Zynga шифруется, SCVNGR (разработчик социгр для мобильных платформ) натуральным образом «раскрывает карты».

Проект «Playdeck» от SCVNGR – это «колода карт, в которой описано около 50 различных игровых механик, которые могут смешиваться, создавая фундамент для различных видов игр»

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

«Некоторые из механик интересны для общего понимания теории игровой динамики («эпические победы», социальная структура игр). Многие из этих концепций общеизвестны – они были собраны для колоды SCVNGR со всех уголков интернета и почерпнуты из опыта известных деятелей (Jane McGonigal, Ian Bogost и Jess Schell), а также из материалов сайта Gamasutra.com, некоторые используются только в разработках компании и могут не сработать вне проектов SCVNGR.»

Колода игровых механик от компании SCVNGR

Достижения /Achievement

Определение: Виртуальное или материальное выражение результата выполнения действия. Достижения часто рассматриваются как награда, либо сами по себе.
Пример: Медаль, уровень, вознаграждение, очки… наградой будет все, что может считаться таковой. Читать далее

Реклама

В защиту A/B-тестирования

23 Сен

parakee.livejournal.com

(Оригинал статьи)

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

Как же не истратить ценные ресурсы в пустую?

В юзабилити-тестировании существует такой инструмент — A/B-тестирование. Оно не занимает много времени и сил и позволяет провести сравнительный анализ одного элемента относительно другого. У такого метода есть свои сторонники и противники, но метод, безусловно очень полезный и важный. В защиту этого метода и приводится очень полезная статья, опубликованная в Smashing Magazine.

В защиту A/B-тестирования

Не так давно A/B-тестирование попало под несправедливую критику со стороны разных Internet-сообществ. Несмотря на то, что в некоторых местах эта критика и является справедливой, основной аргумент против A/B-тестирования все же некорректен. Создалось ощущение, что происходит путаница между методом A/B-тестирования и его конкретной реализацией (например, тестирование красной и зеленой кнопки и другие тривиальные тесты). Давайте взглянем на замечания, которые всплывали на сайте [Smashing Magazine] за последнее время.

Аргумент №1: A/B-тестирование и локальный минимум.

Джейсон Коэн (Jason Cohen) в своем посте под названием «Из выгребной ямы в канализацию: ловушка A/B-тестирования» утверждает, что A/B-тестирование дает нам в результате локальный минимум, в то время, как целью является достижение глобального минимума. Те, кто не понимает разницу между локальными и глобальными значениями в контексте A/B-тестирования, могут представить себе зависимость степени посещаемости web-страницы от расположения элементов на этой странице. Эту зависимость можно представить в виде графика, каждая точка которого представляет собой одну из модификаций страницы (по оси Х) и процент ухода с нее (по оси У). Чем ниже точка на графике, тем лучше. Рассмотрим пример Джеймса с  противопоставлением глобального минимума локальному:
Local-minimum-global-maximum in In Defense Of A/B Testing

Однако дальше Джейсон признает в своем посту, что этот довод на самом деле не связан с A/B-тестированием, поскольку этот же метод может быть использован и для проверки радикальных изменений и это позволит добиться глобального минимума. Таким образом несправедливо называть это ловушкой тестирования, скорее этот аргумент указывает на бессмысленность тестирования небольших изменений.

Итак, A/B-тестирование это не преступление и достижение локальных минимумов не является реальной проблемой. Давайте представим себе ось Х как различные цвета фона, а ось У как степень уходов со страницы. В таком случае аргумент Джеймса звучит примерно так: если вы протестировали десятки оттенков синего фона, то вы сможете уменьшить показатель уходов, но если вы попробуете что-то совсем новое (например, желтый фон), вы сможете достичь абсолютного минимума этого показателя.

Но с этим аргументом есть две проблемы…

1. Вы не можете быть уверены, что достигли глобального минимума

Jason Scaled in In Defense Of A/B Testing

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

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

2. Друзья мои, существует не только цвет фона

При оптимизации web-страницы вы можете изменять буквально сотни или даже тысячи переменных (и цвет фона — всего лишь одна из них). Заголовок, верстка, длина страницы, видео, изображения и цвет текста — это несколько из таких переменных. Ваша цель на этой странице (с точки зрения посещаемости или степени уходов) определяется всеми такими переменными. Это значит, что график (изображенный выше) не может быть одномерным и не так прост, как кажется. На самом деле он носит многомерный характер с большим числом переменных, влияющих на максимумы и минимумы.
FitnessLandscape in In Defense Of A/B Testing
Пики на графике являются показателями посещаемости или уходов со страницы и определяются разным числом переменных (на графике их всего две, но в реальности существуют сотни переменных). В отличии от одномерного случая, перебрать все варианты в реальности невозможно. Таким образом вы не можете гарантировать, что добились глобального минимума. Урок, который из этого можно извлечь — искать локальные минимумы.

Аргумент №2: A/B-тестирование минимальных изменений.

Рэнд Фишкин (Rand Fishkin) из SEOmoz разместил статью под заголовком «Не попасть в ловушку мелочей A/B-тестирования», в которой он подтверждает вывод Джеймса о бессмысленности тестирования отдельных небольших элементов страницы. Его главный аргумент это то, что тестирование минимальных изменений отнимает слишком много энергии и времени. Ниже приведено изображение из его блога. Конечные изменения слишком малы, чтобы их хоть как-то отметить.
Abtests in In Defense Of A/B Testing

Первое, что необходимо сделать — уменьшить время, затрачиваемое на прохождение теста (часто несколько недель), но не время, необходимое для создания теста (занимающее, обычно, несколько минут). Есть очень много автоматизированных систем тестирования, поэтому, после того, как вы создали тест, вам необходимо потратить совсем немного времени на настройку. Что плохого, если инвестиции в 15 мин. на создание теста для цветных кнопок дают в итоге 1,5% увеличение конверсии траффика в действия?

Многие инструменты A/B-тестирования позволяют очень просто создавать небольшие тесты. Они могут проводить тестирование в фоновом режиме, тест может быть в любой момент автоматически остановлен. Чем вы рискуете, создавая такие тривиальные тесты? Я вижу только положительную сторону: рост конверсии и продаж.

В качестве иллюстрации Рэнд приводит в пример редизайн стартовой страницы Basecamp, после которого конверсия возрасла на 14%. Можете себе представить, сколько усилий было приложено, чтобы сделать такой редизайн (по сравнению с тестом цветных кнопок)? Действительно, как вы уже поняли, график испытаний многомерный и очень сложный, поэтому при глобальном редизайне велика вероятность сделать еще хуже. В проектирований появляется много мест для ошибок. Можно ошибиться не только в цвете кнопки. Но мы не должны делать вывод, что тестирование радикальных изменений эффективнее тестирования мелочей, только потому, что мы никогда не слышали, что в результате глобального исследования что-то пошло не так. К тому же тестирование радикальных изменений требует гораздо большего числа сил и времени, по сравнению с небольшим тестом красного против синего.

Мы точно знаем, что при попадании в локальный минимум повышается конверсия, и это ведет непосредственно к увеличению прибыли. Это не означает, что мы должны отказаться от стремления найти глобальный экстремум (минимум или максимум). Глобальный экстремум, как «мир во всем мире» — его невероятно сложно достичь, но всегда нужно двигаться в этом направлении. Урок, который можно извлечь из вышесказанного: идеальная стратегия представляет собой смесь небольших тестирований (красный или синий?) и тестирований глобальных изменений.

Аргумент №3: A/B-тестирование душит творчество.

Джефф Этвуд (Jeff Atwood) сравнивает фильм «День Сурка» с A/B-тестированием и приходит к выводу, что A/B-тестирование также терпит неудачи, как и герой фильма. Джефф полагает, что в A/B-тестировании нет места эмпатии и оно душит творчество. Он ссылается на твиттер Натан Боуэрс (Nathan Bowers):

A/B-тестирование как наждачная бумага — вы можете сгладить с помощью него какие-то шероховатости, но не  можете ничего реально создать.

Но кто утверждает, что A/B-тестирование необходимо для создания чего-либо? Создание происходит в уме, а не исключительно инструментом. Так же порочно эти рассуждения можно применить и к обычной кисти:

Кисточка как палка с мехом — вы можете с ее помощью пощекотить кошку, но вы не можете ничего реально создать.

A/B-тестирование, как кисть, просто инструмент. И как все инструменты оно имеет свои свойства и ограничения. Оно не диктует вам, что вы можете проверить, таким образом тестирование ограничивается только вашей фантазией. С A/B-тестированием или без него вы можете применять всю вашу эмпатию и фантазию в создании дизайна вашего сайта. Только от вас зависит, осуществлять все изменения сразу, или взять более научный подход и попытаться определить, действительно ли новый дизайн обеспечит большую конверсию. Полученный урок: A/B-тестирование это инструмент, а не инструкция по проектированию.

Резюме


Уроки, которые мы получили из этих трех аргументов:

  • Мы никогда не сможем добиться глобального экстремума, заменим его локальным экстремумом. Тестирование минимальных изменений занимает несколько минут, но результат будет гораздо больше, чем стоимость этих минут.
  • Постоянно изучайте наилучшие пути увеличения посещаемости выполняя как тривиальные тесты, так и тестирования глобального редизайна.
  • A/B-тестирование не убивает вашего воображения (вам необходимо очень много воображения при разработке вариантов тестов).
  • И наконец, не чуствуйте себя виноватым, применяя A/B-тестирование.

Перевод In Defense Of A/B Testing (Paras Chopra) — Smashing Magazine

Веб-формы: понижаем когнитивную нагрузку

3 Сен

Дизайнов три, а форма одна
Сможете ли вы сходу сказать, которая из этих форм легче воспримится пользователем? В этом посте я приведу рекомендации по дизайну веб-форм, с целью облегчения когнитивной нагрузки
Рекомендаци основаны на результатах теста, который провели в 2006 году и отчето котором размещен на сайте uxmatters. Тест был построен на технологии считывания движений глаз пользователя (eyetracking). Авторы теста получили весьма полезные данные. Они признают, что немного слукавили, так как им пришлось предъявлять веб-формы пользователям не в реальном контексте веб-страницы, а изолированно, чтобы изучать фиксированние глаз именно на форме, а не на других элементах сайта. Синими окружностями показаны фиксирования глаз, линиями — передвижения взгляда.

Расположения названия текстового поля

Названия с выравниванием по левом краю расположенные над текстовыми полями Названия выровнены по левому краю и расположены слева от текстовых полей

В большинстве случаев, название лучше распологать над полем ввода текста. Человеку не приходится смотреть отдельно на само поле ввода текста и его название — он может это сделать одним взглядом. Не надо забывать визуально явно отделять название следующего текстового поля от предыдущего. В ходе теста было установлено, что если название расположено слева от текстового поля и выровнено по левому же краю, то время скачка глаз от названия к самому полю занимало до 500 мс, тогда как в последующих тестах оно не превосходило 100 мс.

Выравнивание названия

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

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

Начертание названий

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

Выпадающие меню

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

Заголовок выпадающего меню

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

=======

http://uxmatters.com/mt/archives/2006/07/label-placement-in-forms.php

Интерпретация Рехимкулова Рината

Реализм графических пользовательских интерфейсов

17 Авг

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

В других направлениях, положительные эффекты от детализации, в лучшем случае, остаются под вопросом. Графические пользовательские интерфейсы (GUI) обычно полны символов. Большинство элементов, которые вы видите на мониторе, используются, чтобы донести до вас конкретные концепты. Маленький домик на рабочем столе означает не «жилище», а «Вернуться в начало». Глаз — не глаз, а «взгляните на выбранный элемент». Маленький треугольничек — не треугольничек, а «нажми на меня и увидишь допольнительные опции для использования». Иконки предназначены не для имитации реальных объектов, а для передачи обобщённого представления — концепта.

Графические детали и реализм могут отвлекать от истинной задачи иконки. Мне поможет вырезка из книги «Понимаем комиксы» Скотта Макклауда (Scott McCloud’s «Understanding Comics»), книга, которую должен прочитать каждый дизайнер.

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

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

Настоящий фотоаппарат на кнопке вводит в заблуждение.

Читать далее

Обзор свежих материалов, май-июнь 2010

23 Июл

Юрий Ветров, пользователь сайта Хабрахабра, опять подал нам новую порцию обзоров на новые инструменты, материалы и практики по юзабилити. Спасибо ему огромное!

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

Методы и практики

Wireframe Showcase
Коллекция примеров wireframes. Хотя по масштабности ей далеко до коллекции №1, в ней каждая схема страницы совмещена с итоговым дизайном — это помогает лучше понять особенности процесса проектирования.

Sketches and Wireframes and Prototypes! Oh My! Creating Your Own Magical Wizard Experience
Traci Lepore подробно описывает возможные уровни проработки интерфейса от скетчей и wireframes до интерактивных прототипов и дизайна. Статья хорошо показывает, как вместе с затрачиваемым на продумывание интерфейса временем растут его продуманность и уменьшаются «белые пятна». На эту же тему недавно написал Tyler Tate, включив в статью небольшой полезный кейс из практики с примерами готовых документов и графиком их создания.

Designing for Delight (презентация Giles Colborne)
Giles Colborne из компании CXPartners описывает процесс создания дизайна, который вызывает у пользователя ощущение восторга. Причем речь идет не о модных визуальных решениях — для этого важнее предвосхитить ожидания или помочь в проблемной ситуации.

How to Engage Customers in Your E-Commerce Website
В своей статье для Smashing Magazine Rung Andras рассказывает о пользовательских рейтингах в интернет-магазинах — как лучше собирать их, отображать на страницах сайта и учитывать в специальных предложениях.

The Question Protocol — How to Make Sure Every Form Field Is Necessary
Caroline Jarrett, автор книги «Forms that Work: Designing Web Forms for Usability» описывает хороший способ сокращения полей форм. Речь идет об опроснике для заинтересованных лиц компании-владельца сайта, который позволяет определить, кому именно нужны предоставляемые пользователем данные и можно ли отказаться от их части.

The Small Print — Writing UI Instructions
Connie Malamed дает несколько советов о том, как стоит писать краткие поясняющие тексты в интерфейсах. В первую очередь это касается форм и системных сообщений.

Not to Prime, is a Crime!
Jodie Moule из компании Symplicit рассказывает о методе исследования пользователей «priming». В ходе него участвующие в исследовании создают коллажи, описывающие их повседневные дела, что помогает лучше понять контекст и особенности их жизни и работы.

Читать далее

Как фотографии людей удваивают конверсию

21 Июл

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

Это было подтверждено двумя независимыми экспериментами

Я проанализировал результаты двух A/B тестирований пользователей сайта Visual Website Optimizer и пришёл к выводу, что верный способ привлечь внимание посетителей — это разместить людские фотографии на сайте.
RSS2LJ[idarwin]3588b04e213785d4038ef736c96badb0

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

Давайте рассмотрим оба эксперимента.

Пример первый

Ребята из Medalia Art продают бразильские и карибские картины через интернет. Недавно они были приятно удивлены, когда фотографии художников на главной странице сайта увеличили число посетителей на 90%. Это не было их первое A/B тестирование, они до этого уже “игрались” со своей главной страницей. В прошлом им удалось уменьшить процент отказов на 20%, экспериментируя с размещением рекламных сообщений.

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

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

Ниже я привожу скриншоты вариантов исследования.

Первый вариант с картинами — контрольный.
image

А второй с фотографиями — победивший.
image

А вот результаты в цифрах

Вариант Конверсия Улучшение в %
Контрольный с картинами 8,8% —-
С фотографиями 17,2% +95%

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

Пример второй

Блог EmptyMind Джейсона Томпсона посвещён веб-аналитике и оптимизации. В боковой панели сайта находится большая иконка телефона, ведущая на страницу с контактными данными. В отличии от Medalia Art у Джейсона была причина провести сравнительное тестирование иконки против фотографии.

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

В данном экперименте целью была страница с контактными данными, каков процент посетителей перешёл на неё. Вот варианты и их производительность.

Контрольный вариант
image

С фотографией
image

Вариант Конверсия Улучшение в %
Контрольный с иконкой телефона 3,7% —-
С фотографией 5,5% +48%

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

Выводы

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

Я рекомендую вам провести подобное A/B тестирование, чтобы проверить, поможет ли людское фото чудесным образом вашему бизнесу.

И если у вас получится, то возможно, мы нашли великую формулу увеличения конверсии на сайтах. Удачи!

via lexxscorp