Играть любят все. А если не все, до 90% точно, а остальные 10% просто боятся в этом признаться. Игра позволяет расслабиться, отвлечься, переключиться.
Играть интересно, но время на это есть далеко не всегда. Речь, конечно, идет о взрослом человеке – семья, дети, работа, что-то для саморазвития (обучение, спорт), и вот вы уже и не помните, когда последний запускали любимую «линейку» на телефоне или «зуму» на компьютере:
Помните такую? =)
А играть хочется. Тут папы и начинают приносить детям в подарок радиоуправляемые вертолеты (ну и что, что дочка, ей тоже интересно), а мамы с увлечением закупают паззлы на 5000 элементов.
Конечно, неутомимым стремлением человека к играм пользуются не только производители игровых приставок, пейнтбольных шариков или твистера. Все чаще и чаще игровые механики переносятся на изначально неигровые процессы (обучение, работа, тренировки) – и называется это геймификацией, или в русском варианте – игрофикацией.
Сегодня мы поговорим о геймификации в сети, но не о крупных проектах, сама суть которых основана на игре (например, LinguaLeo), а о небольших игровых элементах, которые можно использовать на обычных сайтах.
Для начала быстро разберем вопрос – а зачем это нужно? Причины просты:
- Чтобы удержать интерес посетителя именно на вашем сайте, а не на сайте конкурента
- Чтобы выделить ваш сайт среди остальных, тем самым «отложив» его в памяти пользователя
- Чтобы увеличить время, проведенное на сайте (а соответственно, улучшить поведенческие факторы)
Второй (и последний здесь) теоретический вопрос – как придумываются игровые механики? Да без особых сложностей: берем уже существующую игру из реального (а может и виртуального), но точно игрового мира – и переносим на, казалось бы, неигровую ситуацию.
Этим мы сегодня и займемся. Возьмем 10 хорошо известных нам игр и придумаем «развлекалки» (или «завлекалки») для посетителей вашего сайта.
Игра 1. Паззлы
Суть проста – собери из частей что-то целое.
Пазл «Забавные животные» фирмы Djeco
Неигровая ситуация: Выбор блюд на сайте по доставке готовых обедов.
Пока блюда не выбраны, показываем клиенту начальную ситуацию – пустое игровое поле с кнопками для заполнения этого поля (плюсы – ссылки на тот или иной раздел с блюдами):
По мере выбора добавляем блюда на эту «тарелку»:
Допустим, 3 блюда уже выбрали. И вроде бы, клиент больше ничего и не хотел, но ведь паззл-то не завершен – и это явно видно:
Ничего не остается, как собрать всю «картину»:
Постойте, так ведь это не просто паззл, это ж мой заказ! Разве можно теперь спокойно закрыть эту страницу и уйти в магазин за каким-нибудь бургером? Поэтому очевиден результат:
Игра 2. Одежда для куклы
Рожденные в СССР еще должны помнить эти замечательные бумажные куклы с меняющейся одеждой:
Вот она, докомпьютерная эра ))
Неигровая ситуация: Покупка одежды в онлайн-магазине.
На самом деле, идея не новая, но пока не получившая большого распространения из-за несоответствия затрат на обработку фотографий часто меняющимся коллекциям одежды.
А сам инструмент онлайн примерки увлекателен. Дадим возможность покупательнице не просто посмотреть выбранные вещи на разных фотографиях, а примерить их на одну модель, чтобы оценить весь комплект (скриншот с сайта facecase.ru):
Ну всё, вроде собралась. Или чего-то не хватает…
Из известных примеров сюда же подходит создание своего дизайна для футболок/маек (те же Vsemayki) или кроссовок (например, Nike Id).
Игра 3. Рулетка
Когда хочется, чтобы случай все решил за тебя.
А сколько проиграли вы, перед тем как остановиться?
Неигровая ситуация: Выбор книги в онлайн-магазине.
Если человек ищет не какую-то определенную книгу, а хочет купить что-нибудь «на почитать», то выбор может растянуться на весь его обеденный перерыв. Эту книгу я уже читал, об этой книге отзывов нет, у этой начало какое-то неинтересное. И вообще я не знаю, то ли я хочу фантастику, то ли любовный роман… Свободное время закончилось, а книга так и не выбрана – значит, покупке не состояться.
Добавим для таких нерешительных инструмент, который сделает все за них:
После клика на «Крутить» в течение 4-5 секунд в прямоугольнике мелькают сменяющие друг друга обложки книг:
Затем перебор останавливается на одной случайной книге:
Ну вот и все, выбор сделан! С судьбой не спорят =)
Конечно, если в такую «рулетку» играет зарегистрированный пользователь, у которого уже есть заказы, то стоит все-таки сделать выбор «псевдослучайным», то есть учесть в нем персональные предпочтения юзера (иначе он и «русскую рулетку» будет крутить до бесконечности).
Игра 4. Ну, погоди
А эта игра была хотя бы у одного ребенка во дворе:
Каким был ваш рекорд?
Неигровая ситуация: Ожидание обратного звонка от менеджера.
Ваш клиент заполнил форму на колбэк, отправил ее и видит ответ:
Уже через 3 минуты он начнет думать, что про него забыли. А через 5 обиженно закроет ваш сайт. И даже если вы перезвоните на 6-ой минуте – осадок останется.
Давайте попробуем отвлечь клиента от тягостного ожидания:
Почему бы и не вспомнить игру детства? Как там было – «Мама, я лишь пару минут поиграю»:
Реально поиграть можно здесь http://shtange.com/catch-the-egg/
Теперь, случись вашему менеджеру задержаться со звонком на пару минут – это вряд ли будет замечено =). Понятно, что такой пример подойдет, если время ответа ваших менеджеров не превышает 10-15 минут.
Игра 5. Флип-флоп
Это одна из моих первых компьютерных игр:
При клике на один ряд все его окна меняют положение на противоположное. Надо открыть все окошки
Неигровая ситуация: Описание услуги.
Пример взят с нашей страницы про seo-сопровождение – http://1ps.ru/cost/seo/. На ней есть блок со списком специалистов, работающих по услуге:
Каждая иконка «раскрывается» раз в 5-6 секунд, либо при наведении мыши. А за ней показывается реальная фотография сотрудника:
Т.е. здесь просто развлекаемся. А давайте как на пианино – по всем клавишам:
Хотя на самом деле мы показываем клиентам, что в нашей компании работают вполне реальные люди.
Игра 6. Персонажи
Возьмем пример из виртуального игрового мира, где один из важных этапов – выбор персонажа для игры:
Неигровая ситуация: Выбор детских товаров в онлайн-магазине.
Во многих каталогах у посетителя есть возможность фильтровать товары по параметрам ребенка – пол и возраст:
Добавим сюда игровой механики. Теперь при выборе пола или возраста меняется иконка нашего персонажа ребенка:
Игра 7. Викторина
Вспомним известное телешоу, ставшее и мобильной игрой:
Ну кто же не хочет стать миллионером? Только миллиардер…
Неигровая ситуация: Подбор фирмы для бухгалтерского обслуживания на аутсорсинг.
При выборе человек может сомневаться, а нужны ли ему ваши услуги. Всегда кажется, что дешевле разобраться самому.
Так давайте проверим. Составляем небольшой тест, в котором вопросы распределяем примерно так: 20% простых, 40% средних, 40% сложных. И предлагаем посетителю его пройти:
Не делайте слишком длинные тесты. 10-15 вопросов вполне хватит. Недавно на одном из сайтов меня зацепил тест на уровень знания английского, но на 23-м вопросе я все-таки сдалась (всего вопросов там было 40).
После теста показываем результат и даем возможность посмотреть правильные ответы. И никто не запрещает нам дать ссылки на другие разделы нашего сайта:
Пример онлайн-теста от 1ps можно посмотреть здесь.
Игра 8. Конструктор
Вторая по популярности (после радиоуправляемых вертолетов и машинок) игра, в которую папы с удовольствием играют с детьми:
Да-да, это тот самый Halicarrier
Неигровая ситуация: Выбор компании для строительства (целого дома или чего-то попроще – например, забора или искусственного пруда).
Дадим пользователю элементы строительства и возможность проявить фантазию:
Так, пруд построили, теперь займемся растительностью:
Не забудьте кнопку «Рассчитать стоимость»
В итоге и клиент поигрался, и вы получили визуальное представление того, что ему нужно.
Игра 9. Квест
Самый затягивающий вид игр, потому что в них есть главное – сюжет. Можно сидеть ночами, днями и неделями.
Самый красивый квест своего времени. Интересно, вспомните ли вы его?
Неигровая ситуация: Выбор системы безопасности для частного дома.
Можно долго и подробно (в буквах и картинках) пояснять клиенту, какие системы безопасности вы предлагаете, и как они работают, а можно заменить 1000 слов на один мини-квест:
Зажимаем «маску» мышкой и водим по дому. В местах возможного проникновения маска становится красной. Добавим юмора и дадим возможность пробраться в дом и через трубу:
Отпускаем «маску» в найденном месте и видим пояснение, как будет пойман вор в этом случае. Конечно, не забываем ссылки на разделы сайта:
Вот так наглядно и интерактивно можем представить и схему работы, и имеющиеся комплекты, и даже некоторые условия работы.
Игра 10. Уровни
Как можно заставить игрока выполнять одни и те же игровые действия из раза в раз? Конечно же, нужно ввести систему уровней:
Скриншот игры Traffic Rider. Без уровней играть надоело бы на 10 заезде
Неигровая ситуация: Заполнение большой формы.
Например, возьмем наш бриф на редизайн сайта. В нем 28 полей, и когда клиент видит их сразу все, он становится печальнее прямо на глазах.
Попробуем разбить форму на уровни, а также выведем указатель прогресса (на сколько процентов выполнено задание):
Заполнить 6 групп по 4-5 полей проще, чем 30 полей подряд. А индикатор работает на стремление человека к максимальному результату (100 из 100):
Итог
Конечно, игровых механик и элементов гораздо больше. И дело здесь ограничивается лишь вашей фантазией.
Так что присмотритесь к своему сайту, возможно, и на нем найдется место геймификации. Ну а если присмотрелись и поняли, что сайт уже не торт тот, айда за редизайном.
P.S. Если у вас есть свой опыт применения игровых элементов на сайте, делитесь в комментариях.
