Zasady projektowania interfejsu głosowego (voice UI)

Zasady projektowania interfejsu głosowego (voice UI)

Zasady projektowania interfejsu głosowego (voice UI)

Nie daj się zagłuszyć – nadejście ery VUI

Wyobraź sobie, że jesteś na przyjęciu branżowym. Wokół sami specjaliści – jednych znasz lepiej, innych gorzej, a jeszcze innych wcale. Pomimo kameralnego charakteru wydarzenia, z upływem czasu zaczynasz coraz lepiej kojarzyć uczestników. Ktoś ma wyrazistą osobowość, ktoś wyróżnia się stylizacją, a ktoś wygląda znajomo. Gdy nadchodzi koniec nocy, wiesz już, kogo podziwiasz, komu zazdrościsz i z kim warto utrzymywać kontakt.

Kilka dni później otrzymujesz zdjęcia z tego wydarzenia. I oto zaskoczenie – na jednej z nich pojawia się postać, której twarz gdzieś już widziałeś, ale nie możesz sobie przypomnieć, skąd. Próbujesz ją wyszukać w Internecie i… jest! To ten intrygujący gość z przyjęcia.

Jako projektant UX/UI przez większość swojego zawodowego czasu stawiam znak równości pomiędzy interfejsem użytkownika (UI) a graficznym interfejsem użytkownika (GUI). Gdy aplikacja, strona czy program potrzebuje interfejsu, przez który użytkownik mógłby wejść w interakcję z produktem, to automatycznie do głowy przychodzi jedno rozwiązanie – interfejs graficzny: paski menu, przyciski, linki, listy, tabele, bannery, paginacje, ikony, pola tekstowe, mikrointerakcje, animacje i wszystko inne, co przy zachowaniu funkcjonalności można wyświetlić na ekranach urządzeń elektronicznych – od wyświetlacza w pralce po panele sterowania w kapsule Crew Dragon od SpaceX.

Ale UI to o wiele szersze pojęcie. Przyjrzyjmy się typowemu podziałowi interfejsów użytkownika:

  • Graficzny interfejs użytkownika (GUI)
  • Interfejs tekstowy (CLI)
  • Interfejs dotykowy (TUI)
  • Interfejs sterowany gestami (Gesture-Driven UI)
  • Interfejs głosowy (VUI)

A co, jeśli powiem Ci, że przyszłość już jest tutaj, ale nierówno rozdystrybuowana, jak pisał William Gibson, pisarz science fiction? W krajach wysoko rozwiniętych technologicznie interfejsy głosowe nie są już niczym nowym. Na naszym rodzimym podwórku dopiero wkraczają na salony, stwarzając tym samym ogromne szanse dla zespołów, które zainteresują się ich rozwojem.

Usiądź wygodnie, bo czeka Cię 11 minut lektury na temat interfejsu głosowego – modelu komunikacji, o którym, podświadomie, już wiesz wszystko, a także na temat kursu projektowania VUI, który pomógł mi zrozumieć go w świadomy sposób.

Od GUI do VUI – ewolucja interfejsów

Jako UXUI Designer przez 99% mojego zawodowego czasu stawiam znak równości pomiędzy UI a GUI. Gdy aplikacja, strona czy program potrzebuje interfejsu, przez który użytkownik mógłby wejść w interakcję z produktem, to automatycznie do głowy przychodzi jedno rozwiązanie – interfejs graficzny: belki menu, przyciski, linki, listy, tabele, bannery, paginacje, ikony, pola tekstowe, mikrointerakcje, animacje i wszystko inne, co przy zachowaniu funkcjonalności można wyświetlić na ekranach urządzeń elektronicznych – od wyświetlacza w pralce po panele sterowania w kapsule Crew Dragon od SpaceX.

A przecież UI to o wiele szersze pojęcie. Przyjrzyjmy się typowemu podziałowi interfejsów użytkownika:

  • Graficzny interfejs użytkownika (GUI)
  • Interfejs tekstowy (CLI)
  • Interfejs dotykowy (TUI)
  • Interfejs sterowany gestami (Gesture-Driven UI)
  • Interfejs głosowy (VUI)

Zaczyna robić się ciekawiej. Dodajmy, że typy interfejsów możemy ze sobą mieszać w obrębie jednego produktu, zwłaszcza GUI z VUI lub GUI z gesture-driven i VUI. I wreszcie wkraczamy w XXI wiek myślenia o doświadczeniu użytkownika, który dąży do unaturalnienia interakcji człowieka z maszyną, tak aby w efekcie niewiele różniła się od tej międzyludzkiej, naturalnej, wielozmysłowej – tzw. frictionless experience.

I tu meritum – pomimo że wzrok jest naszym dominującym zmysłem, to najbardziej intuicyjnym, najlepiej znanym i najlepiej wyćwiczonym modelem komunikacji dla człowieka jest mowa. Długo ją ignorowaliśmy, bo jej symulowanie w cyfrowej przestrzeni wymaga ogromnej mocy obliczeniowej. Rejestrowanie, interpretacja ludzkiej mowy w czasie rzeczywistym – nie zapominajmy o wielości i złożoności języków, wielości akcentów i dialektów, niejednoznaczności wypowiedzi, którą można zrozumieć tylko z kontekstu, różnicach kulturowych itd. – to skomplikowany proces, który musi zmieścić się w sekundach, licząc od końca wydanej przez użytkownika komendy do odpowiedzi systemu.

Jednak obecnie wkraczamy w nową erę przetwarzania danych, gdzie machine learning i sztuczna inteligencja otworzyły drzwi dla nowego modelu interakcji z technologią. Pamiętasz film “Her” Spikea Jonzego? Jeśli nie, to polecam. To teraz nie muszę chyba nic dodawać.

Głos – najbardziej naturalny sposób interakcji z technologią

Pomimo że żaden wielki gracz nie wydał jeszcze odpowiednika Samanthy – inteligentnego systemu operacyjnego z filmu “Her” – to twórcy asystentów głosowych prezentują całkiem obiecujące dokonania. Poświęć chwilę czasu i zapoznaj się z możliwościami Asystenta Google na telefonach Pixel. I chociaż doświadczenie z interfejsem głosowym dotychczas wywoływało we mnie więcej zawodu niż zachwytu, to jestem przekonana, że już wkrótce z rozczuleniem będziemy wspominać czasy, gdy na komendę “Ok Google, turn on Polish radio” otrzymywaliśmy odpowiedź “Ok, playing Police Radio playlist on Spotify”.

Warto dodać, że innym istotnym czynnikiem, który wpłynął na rozwój VUI, jest mnogość urządzeń, które wspierają głosowy model interakcji. Dziś prawie 13% populacji jest w posiadaniu smartfonów, które obsługują interakcje głosowe (źródło: statista.com). Dodajmy do tego smart speakery, inteligentne głośniki, takie jak Amazon Echo, Google Home, Apple HomePod czy Sonos One, i łatwo wysnuć wniosek, że większość użytkowników jest gotowa do adaptacji VUI.

A co z językiem polskim? Nie oczekujmy przecież, że polskie społeczeństwo przestawi się bez oporu na codzienną komunikację w obcym języku, mimo że według raportu EF EPI 2019 całkiem nieźle posługujemy się językiem angielskim. To szczególnie trudna do pokonania bariera dla osób starszych i w średnim wieku, a dla tych grup VUI miałby paradoksalnie największy potencjał obniżenia progu wejścia do świata technologii. Na razie żaden z asystentów komercyjnych nie jest specjalnie dostrojony do naszej słowiańszczyzny. Co prawda na początku 2019 roku po cichu zadebiutował Asystent Google, który potrafi porozumiewać się z użytkownikiem w języku polskim, ale moim zdaniem jest on jeszcze w fazie intensywnego uczenia, więc nie oczekujmy rewolucji. Niemniej jednak firma LG zintegrowała swoje inteligentne telewizory z linii ThinQ z Asystentem Google, co dowodzi zainteresowania technologią rozpoznawania mowy dla języka polskiego przez wielkich graczy. To tylko kwestia czasu, aż interakcje głosowe osiągną satysfakcjonujący dla użytkownika poziom.

Jest więc pole do działania. I nic dziwnego, że moją naturalną potrzebą stało się poszerzenie kompetencji, aby projektować w bardziej świadomy sposób, a użytkownikom zapewniać realizację swoich celów jeszcze efektywniej.

Od GUI do VUI – zupełnie inna historia

Miażdżąca większość projektantów UX/UI jest wyspecjalizowana w kreowaniu doświadczeń dla fizycznego inputu: kliknięcie, przesunięcie, przytrzymanie, upuszczenie na ekranie dotykowym, interakcja z klawiaturą komputera, pilotem, przyciskami, myszą itd. oraz graficznego outputu. Projektowanie na potrzeby głosu to zupełnie inna historia, w której nie możemy zastosować tych samych zasad i wytycznych wyćwiczonych przy GUI. To realne wyzwanie.

Jako że to moje pierwsze kroki w tematyce VUI, zrobiłam analizę kursów, które budują podstawy i umożliwiają zastosowanie teorii w praktyce pod okiem mentora. Szału nie było. W Polsce mamy bardzo mały wybór szkoleń dla projektantów. Pojawiają się pojedyncze wystąpienia na konferencjach, a na styczeń 2020 roku był na rynku jeden tego typu kurs na poziomie podstawowym. W kursach zagranicznych – pomimo że tu z wyborem ogólnie jest nieco lepiej i dodatkowo pojawiają się materiały darmowe (patrz podsumowanie linków na końcu artykułu) – wybiła się jedna silna oferta od CarrerFoundry, która jest online’owa, trwa 2 miesiące i kosztuje niemało, bo ponad 16 tys. euro.

Po konsultacji w zespole wybór padł na ofertę od Upside – rodzimej firmy zajmującej się wdrożeniami i szkoleniami z VUI. Kurs trwał 2 dni i z przyczyn COVID-owych odbył się online. Pierwszy dzień obejmował głównie zagadnienia teoretyczne, drugi – praktyczne.

Od teorii do praktyki projektowania VUI

Na temat teorii nie będę się rozwodzić, bo w większości ograniczała się ona do przedstawienia krótkiej historii VUI i statystyk. Poniżej przytaczam jedną z najistotniejszych:

Wykres przedstawiający wzrost liczby urządzeń z obsługą interakcji głosowej

Następnie przyszedł czas na postawienie pierwszych kroków w tworzeniu interfejsu głosowego. Ze względu na ograniczony czas warsztatów, poniższe punkty były poruszone raczej powierzchownie:

  1. Określenie scenariusza użycia aplikacji i jej głównego celu – jedynym ograniczeniem był typ klienta (linie lotnicze).
  2. Stworzenie persony użytkownika.
  3. Określenie placeony.
  4. Stworzenie persony systemu – zarysu osobowości asystenta głosowego.

Przypuszczam, że analiza, która stoi za słowem “persona”, jest mniej lub bardziej znana. Czym natomiast jest placeona? Nie, to nie jest literówka. Termin ukuł Bill Buxton, Principal Researcher z Microsoft Research. Najprościej ujmując, placeona to odpowiednik persony, tylko zamiast określać typ użytkownika, do którego adresujemy nasz produkt, robimy analizę kontekstów, w których produkt będzie używany, z głównym naciskiem na zidentyfikowanie wszystkich zakłóceń tła, które mogłyby utrudnić interakcję z aplikacją głosową, lub okoliczności, dla których aplikacja głosowa jest szczególnie użytecznym rozwiązaniem.

Weźmy za przykład dwa konteksty:

  1. Sprawdzanie numeru peronu, z którego odjeżdża pociąg. Tu trzeba uświadomić sobie podstawowy problem – dworzec to hałas. Zastosowanie interfejsu głosowego nie jest wykluczone, bo często korzystamy ze słuchawek, ale już samo wydanie polecenia może być zagłuszone przez tło. W takim kontekście warto zastosować interfejs mieszany GUI-VUI lub ograniczyć się np. do graficznego.
  2. Wyszukiwanie drogi do najbliższej restauracji podczas jazdy samochodem. Jest to zupełnie odmienna sytuacja. Ze względu na bezpieczeństwo nie chcemy, aby nasz użytkownik odrywał wzrok od drogi, i raczej niewielkie zakłócenia tła – interfejs głosowy miałby tu szczególnie uzasadnione zastosowanie.

Więcej o placeonach i personach możesz przeczytać tutaj.

Następnie przyszedł czas na stworzenie flow konwersacji. Założyliśmy, że tworzymy aplikację powiązaną z Asystentem Google, stąd komenda znajdująca się na górze poniższego diagramu jest zarezerwowana ściśle dla niego. Korzystaliśmy z aplikacji draw.io, możliwej do zainstalowania w Google Docs. Szablon wygląda dość zrozumiale:

Diagram przedstawiający przepływ konwersacji z Asystentem Google

Po ukończeniu pracy mamy bazę, która umożliwia nam stworzenie

Nasze inne poradniki

Chcemy być Twoim partnerem w tworzeniu strony internetowej, a Ty chcesz mieć profesjonalnie zaprojektowaną witrynę?

Zrobimy to dla Ciebie!