Или все старое снова новое

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

Но как «сломать четвертую стену» работает в программном обеспечении?

Ранние человеко-машинные интерфейсы

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

Ранние интерфейсы были устрашающими

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

Ранние интерфейсы были неуклюжими

Множество кнопок и переключателей, циферблатов и рычагов. Устрашающий и неуклюжий.

Прорыв - Текст!

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

Текст интуитивно понятен

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

Но компьютеры неуклюжи

На заре компьютеров, если вы вводите неправильную команду или используете неправильный синтаксис, компьютер устраивал истерику. Темпераментные звери!

Только эти люди знали, как разговаривать с компьютерами

Вы можете узнать некоторые лица на групповой фотографии ниже.

Замена текста графическим интерфейсом - метафора рабочего стола

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

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

Графический интерфейс быстро превратился в нечто пугающее и неинтуитивное

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

Одна картинка стоит тысячи слов

Правда. Но что, если большая часть этой тысячи слов - тарабарщина? Чего это стоит?

Итог: люди находят графический интерфейс разочаровывающим

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

Графические интерфейсы пользователя также имеют тенденцию применять подход «один размер для всех», который не очень ориентирован на пользователя.

Так что же тогда решение?

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

Но компьютеры хрупкие и не так просты, как графические интерфейсы

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

Не могу далеко уйти, используя тренировочные колеса

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

Как снять тренировочные колеса и научиться правильно ездить?

Разбейте четвертую стену!

Как нам сломать четвертую стену? Прекратите толкать пиксели!

Как мы можем перестать выталкивать пиксели?

Разочаровывающий пример

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

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

Менее разочаровывающий пример

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

Перейдите в командную строку (скажем, в Messenger или Slack и т. Д.) И введите @merchant_name, каков статус моего заказа?

Таким образом, мы позволяем торговому сервису (например, Amazon, Etsy или Ebay и т. Д.) Делать всю работу от нашего имени.

Какой из двух способов «проверить статус заказа» более интуитивно понятен?

Угадайте, что - мы сломали четвертую стену в области программного обеспечения!

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

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

Как мы можем использовать чат-бота?

Мы / приглашаем его на наш канал. Например, предположим, что мы узнали, что существует чат-бот, который специализируется на рекомендациях по ресторанам. Мы хотим связаться с этим ботом, и, узнав имя бота (скажем, restobot), мы «нанимаем» этого бота для работы на нас, набрав:

/ пригласить @restobot

После приглашения на ваш канал этот бот всегда будет оставаться в сети, внимательно прислушиваясь к упоминанию своего имени.

Бот - это буфер

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

В чем ценность ботов?

Боты внимательны к человеческим потребностям и чувствительны к человеческим слабостям.

Так это революционное изменение?

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

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

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

Графические интерфейсы также текстовые

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

Итак, если это так, то где в игру вступают пиксели?

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

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

Удалите неровные украшения, и что у нас останется?

Одним словом - микрокопия.

Что такое микрокопия?

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

Или мы можем предложить более подробную микрокопию, как в примере ниже:

Разговорная тема

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

В чем преимущества диалоговых интерфейсов?

  • Интуитивно понятный
  • Чувствителен к человеческой слабости (бот попытается уточнить человеческий запрос, если изначально он не был четко понят)
  • Знакомый (все уже полностью привыкли к общению с семьей / друзьями / коллегами)
  • Единый интерфейс на всех устройствах (невосприимчив к любым проблемам / проблемам, связанным с макетами, шрифтами, цветами и т. Д.)
  • Гарантирует полное право собственности пользователя на беседу - полностью персонализированная ветка обсуждения навсегда записывается и принадлежит пользователю-человеку (полная прозрачность, полный аудит)

Разговорная коммерция

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

Разговорный интерфейс аналогичен обычному опыту поддержки клиентов

Подобно тому, как звонок по номеру 1–800 был основным каналом поддержки клиентов до появления Web 2.0 и мобильных приложений, мы возвращаемся к общению напрямую со службой поддержки клиентов. Только на этот раз, вместо того, чтобы оставаться на неопределенный срок и вынуждены слушать ужасный музак, мы разговариваем с ботами, которые всегда включены, намного быстрее и точнее, более детализированы, чем человеческий персонал.

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

Давайте сейчас создадим нашего собственного бота!

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

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

Сначала создайте сервис онлайн-торговли

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

Мы будем использовать современный фреймворк для веб-разработки (Ruby on Rails) для создания этого сервиса. Если у вас не установлен фреймворк Rails, посетите сайт Rails, чтобы узнать, как его установить на свой компьютер.

После установки мы используем Rails для создания нового сайта. Откройте терминал и введите:

рельсы новый your_site_name

Затем Rails создаст для вас новый проект, и как только вы перейдете к своему новому проекту (набрав cd your_site_name), вы будете готовы создать перечень продуктов, которые будут размещены на новом сайте. Мы создадим ресурс под названием Product, а затем назначим ему несколько атрибутов:

рельсы генерируют каркас Название продукта: строка цена: десятичное число on_special: логическое значение Discount_percentage: целочисленное описание: текст

Вышеупомянутая команда создаст ресурс с именем Product и реализует атрибуты продукта, такие как название продукта, его цена, является ли он специальным или нет, и процент скидки.

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

rake db: migrate

Осталось только запустить сервер и убедиться, что только что созданный веб-сайт работает должным образом:

рельсы s

Вести инвентарь продуктов

Теперь, когда мы создали нашу базу данных продуктов и наш веб-сайт, мы должны перейти к ней и добавить несколько продуктов. Откройте веб-браузер и перейдите по URL-адресу http: // localhost: 3000 / products.

Конечно, страница с описанием продуктов будет пустой, потому что мы еще не добавили ни одного продукта. Давайте сделаем это, нажав ссылку «Новый продукт».

После ввода некоторых значений мы нажимаем кнопку «Создать продукт», и теперь продукт добавлен в инвентарь. Давайте введем еще несколько продуктов (не забудьте установить флажок «Особые» для некоторых из них).

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

Где будет жить наш бот?

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

Зарегистрируйтесь в Slack (если вы еще не являетесь участником), а затем перейдите по ссылке:

Https://yourteam.slack.com/services/new/bot

Вам будет предложено указать имя вашего бота. Назовем нашего бота гофером.

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

Мы также можем добавить имя и фамилию бота и описание возможностей бота.

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

Последний шаг - создание нашего бота

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

Первое, что нам нужно сделать, это перейти в папку config на нашем сайте product inventory и создать новый файл. Этот файл будет содержать токен API Slack. Мы можем назвать этот файл как угодно; Я предпочитаю, чтобы его имя было простым, поэтому я назвал его api.rb. Этот файл будет состоять всего из одной строки кода:

ENV [‘SLACK_API_TOKEN’] = ’xoxb-23830295172-r5CzhzDnUSZQfUfXWmR’

Затем нам нужно указать фреймворку Rails загрузить этот API-токен на этапе инициализации. Мы открываем файл config / environment.rb и добавляем следующие две строки кода:

api = File.join (Rails.root, ‘api.rb’)
load (api) if File.exists? (api)

Теперь, когда мы объявили Slack API Token и проинструктировали Rails загрузить его, нам нужно добавить нашего бота в проект. Лучший способ сделать это - перейти к папке app и создать новую папку с именем bots.

Создайте новый файл в папке app / bots и назовите его real_time_messaging.rb. Этот файл будет иметь дело с потоком, используемым нашим ботом для прослушивания входящих сообщений. Добавьте эти строки в файл и сохраните его:

$ :. unshift File.dirname (__ FILE__)

Thread.abort_on_exception = правда

Thread.new do
Gofer.run
конец

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

Итак, настоящая задача сейчас - выяснить, как создать нашего бота по имени Gofer. Для краткости, здесь мы будем хитрить, используя товарный сервис, известный как Slack Ruby Bot. Использование этого продукта позволяет нам сэкономить время, которое в противном случае было бы потрачено на кодирование обработки низкоуровневых веб-сокетов, что является довольно сложным делом.

Самый быстрый способ использовать этот продукт - открыть Gemfile, находящийся в корне проекта, и добавить к нему следующую строку:

драгоценный камень "слабина-рубин-бот"

Сохраните файл, а затем перейдите в командную строку в корень проекта и запустите:

установка пакета

Когда установка будет завершена, наша стандартная служба Slack Ruby Bot запечет, которую мы будем использовать при создании нашего бота Gofer.

Но прежде чем мы перейдем к разработке логики бота, нам нужно выполнить еще один шаг, связанный с базовой системой, необходимой для правильной работы бота Slack. Перейдите в папку config / initializers и создайте новый файл с именем bot.rb. Это простой файл, состоящий всего из одной строчки кода:

требуется File.join (Rails.root, ‘app / bots / real_time_messaging’)

Это просто указание Rails загрузить файл real_time_messaging.rb при инициализации. И если мы вернемся к содержимому файла real_time_messaging.rb, мы увидим, что после загрузки веб-сайта он также запустит поток, отвечающий за запуск Gofer бот.

И наконец, по созданию логики бота! Создайте новый файл в папке app / bots и назовите его gofer.rb. В этом файле будет объявлено, что бот Gofer наследует свои возможности от только что установленного продукта - SlackRubyBot :: Bot.

class Gofer ‹SlackRubyBot :: Bot

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

Давайте начнем с очень простого - давайте научим нашего бота Gofer обрабатывать команду «help». Добавьте следующее определение команды в файл gofer.rb:

команда ‘help’ do | bot, thread |
bot.say (channel: thread.channel, text: «Помощь уже в пути.»)
end

Эта команда будет использовать бота, чтобы заставить его отображать текст «Помощь уже готов.» На канал, откуда его попросили о помощи.

Сохраните файл, перейдите в командную строку и запустите сервер (rails s). Теперь вы увидите дополнительные сообщения в командной строке при запуске сервера:

Теперь, когда наш бот Gofer успешно подключен к нашей команде Slack, мы можем его протестировать. Зайдите в свою команду Slack, и вы увидите, что бот gofer в сети (рядом с его именем есть зеленый семафорный свет). Щелкните его имя и введите «help». Вы увидите, что бот немедленно отвечает текстом, который мы дали ему выше.

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

Сохраните файл, перезапустите сервер и перейдите в Slack, чтобы спросить гофера, что особенного.

Просто чтобы убедиться, что бот действительно работает в режиме реального времени, перейдите в инвентарь продукта и внесите некоторые изменения. Мол, убрать скидку на Шляпу и, может быть, добавить скидку на какой-нибудь другой товар. После того, как вы это сделаете и спросите гофера, что на промо, он расскажет вам все последние подробности.

Заключение

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

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

Обновлять

RED Academy пригласила меня выступить с докладом на тему Разговорная коммерция и революция ботов. Выступление было записано, и его можно посмотреть ниже:

Заинтригованы? Хотите узнать больше о революции ботов? Более подробные объяснения читайте здесь:

Как создать бота с отслеживанием состояния
Эпоха самообслуживания подходит к концу

Только отсутствие UX является хорошим UX
Хватит создавать хромых ботов!
Четыре типа ботов
Есть ли обратная сторона у диалоговых интерфейсов?
Боты - просто причуда? Действительно ли графические интерфейсы лучше?
Как разработать протокол для ботов
Боты - это антиприложения
Сколько НЛП нужно ботам?
Экраны нужны Для потребления, а не для взаимодействия