Daj się poznać 2017 – podsumowanie

DSP 2017

Nastał ten dzień. Konkurs Daj się poznać 2017 został oficjalnie zakończony.

O konkursie

W tegorocznej edycji konkursu Daj się poznać, wystartowało 981 uczestników. Jednym ze śmiałków, byłem także ja. Niespełna tysiąc programistów, przez 3 miesiące, mierzyło się z własnymi słabościami. Efekt – oszałamiający – prawie 8000 postów!

Prawie TYSIĄC programistów, prawie TYSIĄC blogów! Do polskiej dev-blogosfery wskoczyło prawie 8000 postów– Maciej Aniserowicz

Do wymarzonego finału zakwalifikowało się 183 najwytrwalszych. To z nich wybierzemy niebawem laureatów tegorocznej edycji.

Gala finałowa Daj się poznać

Podsumowanie konkursu zostało zaanonsowane na 17 czerwca. Gala Finałowa odbędzie się w biurze Microsoft.

17 czerwca spotkamy się w ok 150 osób na Gali Finałowej w biurze Microsoft na Alejach Jerozolimskich. Tam calutki dzień zapełniony będzie ciekawymi wystąpieniami, emocjami i rozmowami. – Maciej Aniserowicz

Ja w konkursie

Głównym celem, który dodawał mi sił, podczas trwania konkursu, była… NAUKA nowych technologii. Tak, to właśnie dlatego przystąpiłem do konkursu. Tak, to właśnie dlatego, sporo razy budziłem się niewyspany. Tak, to właśnie dlatego byłem czasem zdenerwowany i ponury. Teraz, po tych niespełna trzech miesiącach, zdaję sobie sprawę z tego, że pisanie kodu i przelewanie swoich doświadczeń na bloga jest najzwyczajniej w świecie męczące. Zdobyłem jednak dzięki temu, tak cenne doświadczenie, że śmiało mogę polecić start każdemu w kolejnej (daj Boże) edycji Daj się poznać.

Angular, Go i Mongo

Kolejnym celem, było wykorzystanie poznanego wcześniej języka TypeScript do napisania aplikacji front-endowej, w oparciu o framework Angular. Udało mi się postawić szkielet aplikacji, obsłużyć kilka końcówek i przewertować kilka tomów dokumentacji 🙂 Generalnie, jestem bardzo zadowolony. Wcześniej byłem nieco sceptycznie nastawiony, ale teraz dostrzegam potencjał jaki drzemie w odświeżonym frameworku Google’a.

Go golang sprawdził się idealnie do backendu mojej aplikacji. Wystawienie tych kilku endpointów, to była najprawdziwsza przyjemność. Prosta składnia, przejrzysta dokumentacja i tutoriale oraz ogrom bibliotek sprawił, że praca postępowała szybko i bezboleśnie. Ogromne brawa należą się także community zgromadzonemu wokół języka. Robią kawał dobrej i solidnej roboty.

W pakiecie do Angulara i Go była jeszcze MongoDB. Nierelacyjna baza danych była uzupełnieniem mojej pracy full-stack developera. Podczas trwania projektu musiałem się co nieco o niej dowiedzieć, ale była to bardzo wybiórcza wiedza. Z tyłu głowy jednak zostawiam Mongo i obiecuję wrócić do nauki wkrótce.

Chatbot

Prace nad projektem Shopping Manager, zostały w pewnym momencie zepchnięte na dalszy plan. Powodem był inny projekt, który musiałem wtenczas zrealizować. Temat dotyczył chatbotów. Wydał mi się na tyle interesujący, a pierwszy post spotkał się z tak zadziwiająco dobrym przyjęciem, że postanowiłem pójść za ciosem i stworzyć miniserię poświęconą tworzeniu chatbotów. Temat niezwykle ciekawy i bardzo modny. Na pewno będzie kontynuacja, bo pomysłów w tej dziedzinie mam niezwykle dużo.

Na koniec

Kończąc moją wypowiedź, chciałbym podziękować wszystkim, którzy odwiedzali mojego bloga. Dostałem sporo feedbacku odnośnie moich postów, większość na Slack Devs PL oraz poprzez formularz kontaktowy. Pojawiły się zarówno miłe słowa, jak i konstruktywna krytyka. Za wszystkie komentarze, wiadomości i maile, serdeczne dzięki!

Chatbot, Wit.ai – tworzenie chatbota – Speech API

Artificial Intelligence

Rozpoznawanie głosu to temat trudny, nawet dla największych wyjadaczy. Z pomocą przychodzi jednak Wit.ai, wraz ze swoim Speech API. Dzięki dedykowanej aplikacji oraz wykorzystaniu WebRTCWebSockets możemy w prosty sposób przekonwertować mowę na tekst oraz skomunikować się z naszym chatbotem.

Trochę teorii

Wit.ai Speech API powstało w lutym 2014 roku jako rozwinięcie projektu Wit.ai. Zasada działania jest prosta, przesyłamy na backend (w tym wypadku na zewnętrzny serwer Wit.ai) plik audio. Dźwięk jest przetwarzany i konwertowany. Dostajemy w zwrotce JSON z intencją oraz wartościami, które zostaną wychwycone.

speech2json

Wit.ai Speech API łączy w sobie różne techniki przetwarzania języka naturalnego oraz silniki rozpoznawania mowy. Potrafi odseparować szumy z otoczenia, dostosować poziom głośności i wydobyć właściwe dźwięki.

Microphone

W ramach tego wpisu zapoznamy się z nakładką wit-ai/microphone. Biblioteka jest dewelopowana przez zespół zajmujący się  Wit.ai. Została napisana w CoffeeScript, wykorzystuje WebRTC i WebSockets, dzięki czemu nie musimy zapisywać plików audio lokalnie. Cały kod jest jawny, a jego rdzeń możemy znaleźć tutaj.

Implementacja Speech API

Po wpięciu biblioteki obsługującej mikrofon i komunikującej się z Wit.ai API, pozostało obsłużyć mikrofon na stronie internetowej.

Zaczynamy od stworzenia instancji Microphone:

const microphone = new Wit.Microphone(document.getElementById('microphone'));

Jak widać, odwołujemy się do elementu posiadającego id microphone. W ten sam sposób dodajemy info oraz error:

const info = message => {
  document.getElementById('info').innerHTML = message;
};
const error = message => {
  document.getElementById('error').innerHTML = message;
};

Teraz, korzystając z dokumentacji, stwórzmy kilka metod obsługujących naszą aplikację. Poinformujmy użytkownika, że można rozpocząć nagrywanie:

microphone.onready = () => {
  info('Mikrofon gotowy do nagrywania');
}

Po starcie, zmiana statusu z informacją:

microphone.onaudiostart = () => {
  info('Nagrywanie rozpoczęte');
};

Oraz po zakończeniu nagrywania:

microphone.onaudioend = () => {
  info('Nagrywanie zakończone, trwa konwertowanie');
};

Pamiętajmy, że w razie niepowodzenia, warto o tym poinformować użytkownika. Wykorzystujemy więc metodę onerror:

microphone.onerror = errorMessage => {
  error('Błąd: ' + errorMessage);
};

W momencie nawiązywania oraz zamykania połączenia mamy dwa dodatkowe callbacki: onconnectingondisconnected. Wykorzystujemy je do stworzenia dodatkowych statusów informujących:

microphone.onconnecting = () => {
  info('Trwa weryfikowanie mikrofonu');
};
microphone.ondisconnected = () => {
  info('Mikrofon nie jest podłączony');
};

Została nam jeszcze obsługa onresult. Analogicznie jak w wersji node’owej, tutaj też po zidentyfikowaniu osoby, spróbujemy wyszukać o niej informacji na wikipedii:

microphone.onresult = (intent, entities) => {
  if (entities.fullName === undefined) {
    document.getElementById('result').innerHTML = 'Nie zrozumiałem, spróbuj jeszcze raz!';
  } else {
    let fullName = entities.fullName.value;
    document.getElementById('result').innerHTML = fullName + '? Szukam na wikipedii...';
    window.open('https://pl.wikipedia.org/wiki/' + fullName.replace(' ', '_'));
  }
};

W metodzie connect przekazujemy token, który możemy wygenerować w ustawieniach aplikacji.

Speech API token

Podsumowanie

Po implementacji i deployu na Heroku, możemy sprawdzić jak się zachowuje aplikacja. Przykładowy screen z testu zamieszczam poniżej. Cały kod dostępny jest na moim githubie, zachęcam też do przetestowania aplikacji samodzielnie.

Spy chatbot - Speech API

Przydatne linki

Chatbot, Wit.ai – tworzenie chatbota – Wit Node.js SDK

Artificial Intelligence

Dzisiaj już trzeci wpis z serii Wit.ai. Tym razem zajmiemy się tworzeniem chatbota w node.js. Przy tej okazji zapoznamy się z Wit Node.js SDK i zbudujemy aplikację, która wyświetli artykuł o szukanej osobie w wikipedii.

Wit Node.js SDK – przygotowanie środowiska

Instalacja

Instalacja Wit Node.js SDK przebiega w standardowy sposób.  Do instalacji używamy npm:

npm install --save node-wit

Jeżeli wszystko przebiegnie pomyślnie, zostanie stworzony folder node_modules, a w nim znajdować się będzie zainstalowana paczka.

Require

Możemy teraz, w głównym katalogu, stworzyć plik index.js. Tam z kolei dodajemy potrzebne zależności:

const Wit = require('node-wit').Wit;
const interactive = require('node-wit').interactive;

W tym tutorialu skorzystamy z Wit oraz interactive, więc dodajemy tylko te zależności.

Połączenie z Wit.ai API

Access token

Na początku musimy pobrać access token. Będziemy przekazywać go jako parametr, przy uruchamianiu aplikacji. Unikniemy w ten sposób zaszycia naszego tokenu w kodzie. Do wydobycia tokenu użyjemy node’owego proccess.

const accessToken = (() => {
  if (process.argv.length !== 3) {
    process.exit(1);
  }

  return process.argv[2];
})();

Tworzenie instancji Wit

Teraz możemy stworzyć nową instancję Wit. W tym celu dodajemy do naszego kodu następujące dwie linijki:

const client = new Wit({ accessToken, actions });
interactive(client);

Jak widzimy powyżej, tworząc instancję Wit, przekazujemy wcześniej utworzony accessToken. Dopisujemy od razu actions, które utworzymy za chwilę.

Akcje

Nasz chatbot do poprawnego działania potrzebuje jeszcze akcji. Do zapewnienia podstawowej komunikacji z Wit.ai API potrzebujemy w naszym przypadku dwóch akcji:

  • send – wbudowana akcja Wit.ai, przyjmuje dwa parametry: request i response
  • findPerson – zdefiniowana przez nas akcja

Zadeklarujmy więc akcje w naszym programie:

const actions = {
  send(request, response) {
    console.log('request', request);
    console.log('response', response);
  },
  findPerson({ context, entities }) {
    console.log('context', context);
    console.log('entities', entities);
  }
};

Testując naszą aplikację możemy zobaczyć od podszewki w jaki sposób działa Wit.ai.

Przykładowe wykorzystanie

Aby na tym poziomie nasz chatbot miał już jakąś funkcjonalność, sparsujemy wyodrębnione dane i sprawdzimy czy na temat danej osoby znajduje się artykuł w wikipedii.

Do tego celu wykorzystamy opn. Instalujemy paczkę przez npm.

npm install --save opn

Dodajemy opn do projektu:

const opn = require('opn');

Na koniec pozostało jeszcze zmodyfikowanie metody findPerson:

findPerson({ context, entities }) {
  const fullName = entities.fullName[0].value;
  const url = 'https://pl.wikipedia.org/wiki/' + fullName.replace(' ', '_');

  if (fullName) {
    context.fullName = fullName;
    opn(url, { wait: false });
  } else {
    console.error('Nie zrozumiałem.');
  }

  return context;
}

Test

Pozostało nam przetestować działanie aplikacji node.js. W tym celu wykorzystamy terminal:

Wit Node.js SDK

W terminalu otrzymaliśmy informację (zadeklarowaną w poprzednim wpisie o Wit.ai). Dodatkowo w prosty sposób sprawdzimy czy na temat danej osoby znajduje się artykuł na wikipedii.

Adam Małysz wiki

Dawid Ryłko wiki

Podsumowanie

W tym wpisie zapoznaliśmy się z Wit Node.js SDK i zbudowaliśmy prostą aplikację w Node.js. Kolejny wpis tej serii poświęcimy na rozbudowanie naszego chatbota.

Dodatkowo cały kod, z tego tutorialu do tworzenia chatbota, można pobrać z mojego repozytorium na githubie:
https://github.com/dawidrylko/spy/tree/1.0