상세 컨텐츠

본문 제목

Google Assistant - Interactive Canvas (인터렉티브 캔버스)

Programming/Mindchain

by 쌩우 2019. 7. 22. 16:51

본문

구글 어시스턴트는 actions과 intgreation의 hosting을 제공한다.

Interactive Canvas란?

구글 어시스턴트에 빌드되어 있는 프레임워크이다.
개발자들이 대화 actions에 대하여 시각적인 경험을 추가할 수 있도록 해준다.
이 visual layer는 웹 앱으로 사용자와의 대화의 응답으로써 보내진다.

어떨 때 사용하면 될까?

  • 풀스크린 화면을 만들 때
  • 커스텀 애니메이션과 이동을 구현할 때
  • 커스텀 레이아웃과 GUI를 만들 때
  • 데이터 시각화
  • 비디오 플레이백 실행

작동하는 방법

  1. 커스텀 Conversational Action
  2. 웹 앱
  3. Assistant Canvas
  4. ImmersiveResponse

1) 커스텀 Conversational Action
-> 대화 인터페이스를 사용하여 사용자의 요청을 행하는 것.
대화형 캔버스를 사용하는 동작은 대화형 동작과 동일하게 기본적인 방식으로 작동한다.
하지만 많은 카드나 간단한 텍스트, 음성 응답 대신에 몰입형 웹 뷰를 사용하여 응답을 제공한다.

2) 웹 앱
-> 사용자가 대화를 하는 동안에 응답으로 Action이 사용자에게 보내는 커스텀 비주얼이 포함되어 있는 프론트엔드 웹 앱이다.
웹 앱은 HTML, Javascript, CSS를 사용하여 빌드한다.
assistantCanvas는 웹 앱을 실제 대화 액션과 소통할 수 있게 해준다.

3) AssistantCanvas
-> Javascript API이다. 빌드하는 웹 앱과 실제 대화 액션과 소통할 수 있게 해준다.

4) Immersive Response
웹 앱의 렌더링 방법을 결정짓는 응답의 유형이다.

출처 : Google I?O'19

flow

  1. 사용자가 장치에 말을 한다
  2. 사용자의 입력이 google actions로 전달된다.
  3. google actions가 dialog flow를 불러낸다.
  4. dialog flow는 사용자가 말한 내용을 기준으로 화자의 의도를 매칭한다.
  5. immersive response를 제공하는 관련된 작업을 불러낸다.
  6. immersive response의 일부로써, 응답과 함께 URL이 제공된다.
  7. 장치는 관련된 웹 앱을 URL로부터 load 한다.
  8. 또한 장치는 Interactive Canavas API로부터 몇몇 callback을 등록한다.

참조 : [https://medium.com/voice-tech-podcast/google-assistant-interactive-canvas-c83a959bdea0]

'Programming > Mindchain' 카테고리의 다른 글

Vue 컴포넌트의 필요성과 특성  (0) 2019.07.25
미니게임 UI 디자인  (0) 2019.07.24
canvas API - 색상  (0) 2019.07.22
canvas API - Path2D objects  (0) 2019.07.22
canvas API - 도형그리기(advanced)  (0) 2019.07.22

관련글 더보기

댓글 영역