Плюс: как мы научили Google Assistant научить вас испанскому языку

Если вы в настоящее время создаете или думаете о разработке собственного действия Google Ассистента, этот пост для вас!

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

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

Так как же все это началось?

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

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

Поэтому, когда Ассистент ответил Ариэлле, что он не может научить ее испанскому «пока», меня осенило: почему я не делаю этого ?!

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

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

Мы собираемся осветить принятые нами технические решения и поделиться своим опытом с результатами нашего выбора.

SDK шаблона, диалогового окна или действий?

В настоящее время существует три подхода к созданию действий Ассистента: готовые шаблоны, Dialogflow и Actions SDK.

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

В нашем случае, однако, нам требовалось больше возможностей: мы хотели иметь возможность отслеживать прогресс пользователя, а на самом деле смешивание испанского и английского языков в одном приложении является довольно сложной задачей, как вы увидите через минуту. Поэтому нам пришлось выбирать между Dialogflow и Actions SDK.

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

Actions SDK предоставляет вам «простой» доступ к пользовательскому вводу, и вы должны предоставить бэкэнд, который будет анализировать этот ввод и генерировать соответствующие ответы.

Мы решили использовать Dialogflow, так как он может обрабатывать некоторые потоки за нас (например, задавать пользователю вопрос «да» или «нет» и понимать ответ пользователя), а также позволяет нам быстро создавать прототипы.

Встроенные возможности Dialogflow оказались для нас очень полезными. Например, если пользователь не знал, как перевести данное ему предложение, он мог сказать: «Я не знаю», чтобы получить ответ, и перейти к следующему.

Вскоре после того, как мы опубликовали приложение, мы поняли, что у пользователей есть много способов сказать, что они не знают предложения: «Понятия не имею», «Я забыл», «что это» и даже старое доброе «idk. ”

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

Бэкэнд и непрерывная интеграция

Как веб-разработчик, JavaScript - мой хлеб с маслом, поэтому при выборе технологии для бэкэнда я выбрал Node.js, решение, которое также было поддержано тем фактом, что существует официальный Node SDK для разработки действий в Google с использованием Dialogflow. (пакет actions-on-google). У Дэниела уже был опыт работы с ним, и он всем сердцем рекомендовал его.

Чтобы дополнить опыт разработки, я также установил TypeScript, который теперь является моим идеальным решением для любого проекта, размер которого превышает несколько строк кода. Удобно, что Actions SDK поставляется с полными определениями типов, поэтому я получил автозаполнение и проверку типов. Наконец, я настроил модульные тесты с помощью Jest, фреймворка для тестирования от Facebook. Я использую его вместе с Wallaby.js, решением, которое постоянно запускает ваши тесты и показывает вам результаты выполнения и покрытие кода по мере того, как вы набираете код. Я благодарен Артему за его создание.

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

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

Мы используем Docker для создания контейнера с нашим транспилированным приложением, которое затем отправляем в Реестр контейнеров Google, а затем развертываем на небольшой машине, которую мы настроили для этого (а также для метабазы, см. Ниже). У нас были альтернативы для развертывания кода в Функции Firebase, Google App Engine, Google Cloud Run или Google Kubernetes Engine, но мы решили просто запустить Docker на нашем сервере.

Вот наш Dockerfile, в котором используется функция многоступенчатой ​​сборки, представленная в Docker 17. Сначала мы создаем контейнер, в котором запускаем наши тесты и транспилируем исходный код с помощью JavaScript. После успешного завершения мы переходим ко второму этапу, на котором мы создаем фактический контейнер для производства на основе более компактного образа Node-Alpine:

Наконец, мы используем сервис Sentry для отслеживания ошибок. Он собирает информацию о любых исключениях, которые происходят в нашей производственной среде, и отправляет нам электронное письмо с информацией. Вы также можете увидеть в строке 32 файла Dockerfile, что мы определяем переменную среды с тегом текущей сборки, которая затем используется Sentry, чтобы отслеживать, возникает ли проблема после того, как мы развернули новую версию. Мы заполняем переменную ${BUILD} нашим номером сборки CircleCI, передавая аргумент --build-arg команде docker при построении изображения.

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

Аналитика

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

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

Учитывая это, нам было ясно, что мы хотим отслеживать все взаимодействия пользователей с нашим приложением, а также иметь простой способ запрашивать эти взаимодействия, анализировать их и визуализировать их, чтобы помочь нам увидеть закономерности. Мы хотели собрать аналитику с нулевого дня и искали простое решение, которое не требовало бы слишком большого количества кода и могло бы расти вместе с приложением. Мы выбрали BigQuery, решение для хранилища данных от Google, которое можно легко масштабировать до огромных объемов данных и которое поддерживает знакомый нам язык запросов SQL.

Мы используем BigQuery, напрямую сообщая ему о любом взаимодействии с пользователем с помощью функции под названием «Streaming Insert», которая позволяет вам вставлять новые строки одну за другой, когда бы они ни возникали. Вы можете увидеть фрагмент кода, который сообщает о взаимодействиях пользователей ниже:

По сути, вы вызываете эту функцию с экземпляром DialogflowConversation и ответом, который вы отправили пользователю (если есть), и все готово. Вот как мы определили схему нашей таблицы BigQuery:

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

Здесь мы начали собирать детали locale, inputType и surfaceCapabilities. Последние два были не очень простыми, поскольку требовали некоторой предварительной обработки, прежде чем мы могли сохранить их в базе данных:

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

Посмотрев на возможности поверхности, мы также увидели, что многие пользователи взаимодействовали с нами, используя устройство только с возможностями вывода звука и звука мультимедийного отклика, которое, по нашему мнению, является Google Home (в отличие от устройства с возможностью вывода на экран, например смартфон):

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

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

Вы также можете отказаться от написания запросов с использованием SQL, если вам нужно более сложное агрегирование, или для объединения данных из нескольких таблиц. Наконец, Metabase позволяет создавать удобную панель управления, которую можно настроить для отображения важных для вас показателей:

Что ж, основываясь на графике выше, вы, вероятно, можете догадаться, в какой момент мы запустили приложение :-)

Обновление: с мая 2019 года Google запустил собственный инструмент визуализации данных Data Studio Explorer. Он все еще находится в стадии бета-тестирования, но может быть жизнеспособной альтернативой Metabase и не требует настройки.

Google также предоставляет некоторые сведения о вашем приложении в специальном разделе Analytics в консоли Actions on Google, где вы можете узнать о состоянии вашего приложения, задержке, обнаружении и многом другом.

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

Говорить по-испански

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

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

Как ни странно, мы нашли решение в совершенно неожиданном месте: в облаке Amazon. У него есть облачный TTS-сервис под названием Amazon Polly с щедрым уровнем бесплатного пользования: 5 миллионов символов в месяц. Они также поддерживают SSML, что означает, что мы можем попросить его говорить медленнее, когда пользователь просит повторить предложение.

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

База данных для пользовательских данных

Первый прототип приложения просто давал пользователям случайное предложение на испанском языке для перевода на английский. Наблюдая, как его использует наша бета-тестировщик №1 Ариэлла, я понял, что это неправильный подход, так как было много слов, которые она еще не знала; не имело особого смысла, когда Действие выдавало случайное предложение без учета ее текущего словарного запаса.

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

Мы выбрали новую базу данных Cloud Firestore, поскольку она полностью размещена и управляется, и это база данных документов без схемы, что делает ее идеальной для быстрого прототипирования. Я все еще новичок в Firestore, но мне очень нравится использовать Firebase (на самом деле, я был пользователем с момента их публичной бета-версии в 2013 году, и я даже написал свою собственную реализацию firebase-server), поэтому я решил, что мы Попробуй.

Пока я доволен: взаимодействие с ним из Node.js было легким делом, как и в небольшом приложении Frontend, которое мы создали. Их консоль - очень удобный способ исследовать и управлять вашими документами во время создания прототипов:

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

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

Фронтенд

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

Я решил воспользоваться этой возможностью, чтобы изучить новую технологию Vue.js. Я начал с fuse-box-vue-seed, который также включает Vuetify, библиотеку компонентов Material Design для Vue, и fuse-box, сверхбыстрый сборщик модулей, который является хорошей альтернативой Webpack.

Затем я добавил систему единого входа Google с помощью Firebase Authenticaton, развернул приложение в Интернете с помощью Firebase Hosting и использовал SDK firebase-admin для проверки личности пользователя на нашем сервере.

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

Заключение

У нас уже есть опыт работы с нашим приложением, но это еще только начало. Основываясь на существующих технологиях и облачных сервисах, таких как Dialogflow, BigQuery, Firestore, Sentry, Amazon Polly, при использовании настройки непрерывного развертывания с Jest, Docker, Circle CI и Google Container Registry мы смогли очень быстро приступить к работе, и поддерживать темп даже после того, как приложение будет работать.

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

Нам очень приятно видеть, что пользователи возвращаются в наше приложение каждый день, чтобы учить новые слова, и Ариэлле тоже было весело изучать новые испанские слова!

Звук весело? Попробуйте наши действия!

Да, и не забудьте попробовать нашу Акцию! Вы можете проверить это на Google Home, телевизорах Android 6.0+, телефонах Android 6.0+, iOS 9.0+ или на своем Chromebook. Просто установите Google Assistant (если вы еще этого не сделали) и скажите:

«Поговорите с уроком испанского»

¡Diviértete! («Удачи» и не забудьте оставить отзыв в разделе комментариев!)