챗봇 플랫폼을 위한 입력 UI 요소 생성 방법
게시 됨: 2017-01-01오늘날 존재하는 챗봇은 인간의 자연어를 이해할 수 있는 능력이 많지 않습니다. 그리고 이것이 대부분의 메시징 앱(Messenger, Kik 등)이 봇 플랫폼에서 그래픽과 텍스트 UI의 혼합에 의존하는 주된 이유 중 하나입니다. 텍스트 응답이 아닌 버튼, 캐러셀, 이미지 카드를 생각해 보세요.
Tars에서는 브라우저를 플랫폼으로 사용하여 봇이 작동할 수 있는 자체 채팅 인터페이스를 구축하고 있습니다. 그리고 이것은 우리가 가지고 있는 모든 구성 요소에 대한 완전한 자유를 줍니다. 당사 봇을 사용해 본 적이 있다면(아직 해보지 않은 경우 먼저 여기와 여기에서 시도해 보십시오) 그래픽 UI + 텍스트 기반 접근 방식을 강력하게 지원한다는 것을 알 수 있습니다. 이러한 사고 과정의 일환으로 다양한 사용자 상호 작용과 상황을 용이하게 하기 위해 프런트 엔드 인터페이스에 여러 사용자 지정 키보드 입력을 만들었습니다.
Messenger, Kik, Telegram은 개발자가 매일 수백 개의 봇을 배포하는 거대한 플랫폼입니다. 나는 여전히 이러한 메시징 플랫폼이 프론트 엔드 구성 요소에서 부메이커가 풍부한 사용자 상호 작용을 만드는 데 도움이 되지 않는다고 생각합니다.
그렇기 때문에 각 사용자 정의 UI를 만드는 방법, 각 UI가 의미가 있는 이유, UI가 없으면 사용자 상호 작용이 어떻게 엉망이 되는지에 대해 더 이야기하고 싶었습니다.
그래서 여기 우리가 간다:
날짜 및 시간 스크롤러
사용자에게 언제 약속을 잡고 싶은지 물어봐야 하는 시나리오를 생각해 보십시오. 동일한 정보를 제공하는 방법에는 여러 가지가 있을 수 있습니다.
11월 25일, 11월 25일, 11월 25일, 25/11, 25–11–2016, 11/25/16 — 모두 본질적으로 동일하지만 기계가 이 데이터를 이해하기 어려워집니다.
이것이 사용자가 다이얼을 돌려 날짜/시간을 선택할 수 있는 날짜 및 시간 스크롤러를 통합한 이유입니다.
지금까지 이 UI를 제공하는 다른 메시징 플랫폼을 본 적이 없으며 봇이 사용자에게 날짜나 시간을 묻는 경우 이것이 필수라고 생각합니다.
수직 버튼
선택할 수 있는 항목의 수가 제한된 형태의 객관식 옵션이라고 생각하십시오. 버튼을 탭하면 상호 작용이 빨라지고 대화 범위가 제한됩니다.
버튼 기반 접근 방식은 채식 피자와 비채식 피자 중 하나를 선택해야 할 때 의미가 있지만 선택할 수 있는 보험 증권이 100개라면 가장 좋은 UI가 아닐 수 있습니다.
수직 버튼으로 무엇을 더 할 수 있습니까?
- 각 옵션 옆에 이미지를 추가하여 시각적으로 더 매력적으로 만드십시오.
- 사용자가 한 번의 탭에 응답하도록 하거나 옵션 중 하나를 탭한 후 "보내기"를 클릭하도록 할 수 있습니다. 후자는 사용자가 실수로 특정 옵션을 선택하지 않았는지 재확인하는 데 도움이 됩니다. 채팅 흐름으로 돌아갈 수 있는 방법이 없으므로 이 사용자 지정이 의미가 있습니다.
- 각 옵션에 빠른 정보 메뉴를 추가하여 자세한 정보를 제공하고 더 나은 의사 결정을 내릴 수 있습니다.
모든 사람이 어드밴스 페이셜과 베이직 페이셜의 차이점을 아는 것은 아닙니다. 포함된 모든 항목과 가격 책정에 대한 세부 정보를 추가하면 사용자 경험이 향상됩니다.
버튼 UI를 사용할 때 명심해야 할 또 하나의 중요한 사항은 질문을 올바른 방식으로 구성하는 것입니다. Leszek이 여기 그의 기사에서 설명했듯이, 매우 열린 질문을 하는 것보다 옵션의 범위를 제한하고 맥락을 설정하는 방식으로 질문하는 것이 좋습니다.
사용자 입력 제한
이것이 우리가 채팅 인터페이스에 한 가장 좋은 일 중 하나라고 생각합니다. 그래픽 입력 UI(버튼, 캐러셀 등)를 제공할 때마다 사용자가 텍스트에 아무 것도 입력할 수 없습니다.
왜 그래? 사용자가 아무거나 입력할 수 있지만 봇은 이에 대한 준비가 되어 있지 않기 때문입니다. 당신이 거기에 있을 때까지는 대화를 끊는 것보다 간단하고 제한적으로 유지하는 것이 좋습니다.
당신을 위해 추천 된:
메타버스가 인도 자동차 산업을 어떻게 변화시킬 것인가?
인도 스타트업에 대한 반 영리 조항은 무엇을 의미합니까?
Edtech Startup이 인도 인력의 기술 향상 및 미래 준비를 돕는 방법...
이번 주 새로운 시대의 기술 주식: Zomato의 문제는 계속되고 EaseMyTrip은 Str...
인도 스타트업, 자금 조달을 위해 지름길 선택
디지털 마케팅 플랫폼 Logicserve, INR 80 Cr 자금 지원, LS Dig...
우리가 하는 일은 다음과 같습니다.
이것은 우리의 채팅 인터페이스입니다
그리고 이것은 다음과 같은 것이 없을 때 일어나는 일입니다.
빠른 답장을 보낼 때 제한된 텍스트 입력을 허용하지 않는 Facebook Messenger입니다.
완료 및 통과 버튼
우리는 항상 스크립트로 작성된 챗봇을 형태의 진화로 생각했기 때문에 이 두 가지가 아주 작은 뉘앙스로 통합되었습니다.
주소를 통해 보내거나 채팅 인터페이스를 통해 자세한 피드백을 제공할 때 일반적인 행동은 몇 단어를 쓴 후 보내기 버튼을 누르는 것이고 전체 응답은 결국 3-4개의 문장으로 퍼집니다. "완료 버튼"을 사용하면 계속 입력하고 완전한 응답을 제공한 후 이 버튼을 누를 수 있습니다.
이러한 옵션이 없으면 시스템의 다음 메시지가 첫 번째 인스턴스 자체 다음에 와서 불완전한 응답을 초래합니다.
여러 옵션을 선택해야 하거나 여러 줄로 된 응답이 있는 경우 "완료" 버튼을 사용하세요.
사용자가 질문을 건너뛰고 싶어하는 경우가 있을 수 있으며 이를 위해 "보내기 버튼" 대신 "통과 버튼"이 있습니다. 사용자가 타이핑을 시작하자마자 Pass 버튼이 Send 버튼으로 바뀝니다.
이메일을 주고 싶지 않으세요? 질문을 건너뛰려면 "통과"를 탭하세요.
자동 완성 제안
이것은 입력을 시작하고 가능한 옵션을 제안하는 Google 검색의 자동 완성 기능과 같습니다. 이것은 옵션 목록이 길고 수직 버튼을 갖는 것이 실현 가능한 옵션이 아닐 때 특히 유용합니다. 지역, 도시, 자동차 모델 등의 긴 목록을 생각해 보십시오.
별점과 좋아요
사용자 피드백이나 경험을 요청할 때 특히 유용하며 응답은 본질적으로 더 질적입니다. 그리고 아이콘을 별, 좋아요, 하트, 이모티콘으로 사용자 정의할 수도 있습니다.
이미지 카드
이것은 한 번에 각 항목에 대한 여러 정보를 표시해야 하는 경우에 유용합니다. 음식 주문 과정에서 햄버거가 될 수도 있고 쇼핑 과정에서 셔츠가 될 수도 있습니다. 모든 카드는 서로 겹쳐져 있으며 스크롤하여 모든 옵션을 볼 수 있습니다.
이 UI 요소에는 이미지, 제목, 설명 및 바닥글의 4가지 부분이 있습니다. 여기에 표시하려는 내용에 따라 이를 다르게 활용할 수 있습니다.
이러한 모든 입력 UI 요소를 테스트하려는 경우 한 번에 하나씩 안내하는 챗봇에 대한 링크가 있습니다.
채팅은 말풍선과 텍스트 상자만 있는 미니멀한 인터페이스이므로 많은 범위를 제공하지 않습니다. 그리고 기존 요소를 사용하고 채팅 인터페이스에 새로운 요소를 추가하여 다양한 상호 작용을 촉진할 수 있는 방법을 재고해야 한다고 생각합니다.
메시징 인터페이스를 직접 사용해보고 다른 멋진 GUI 요소를 추가했는지 알고 싶습니까?
[이슈진달의 이 글은 미디엄에 처음 게재되었으며, 무단 전재를 하였습니다.]