봇 응답 꾸미기
카카오톡 채널 챗봇의 자랑이자 차별화 포인트는 바로 카카오 고유의 유려한 말풍선입니다. 챗봇 관리자센터에선 직접 봇 작업자가 되어 카카오의 모든 말풍선을 입맛에 맞게 구현할 수 있습니다.
어디선가 보았지만 멀리있는 듯 했던 그 화려한 말풍선들… 이제는 텍스트형/이미지형/카드형/커머스형/리스트형 그리고 단일형/가로케로셀/랜덤형 출력케이스도 모두 봇 작업자 여러분의 손끝에 달려있습니다.
더불어, 업계의 가장 핫한 아이템, 작고 귀여운 ‘바로연결(Quick Reply)’ 버튼도 말풍선 아래에 달아보세요. 챗봇 인터페이스가 깔끔해지고, 사용자들은 더욱 간편하게, 재밌게, 빠르게, 여러분의 챗봇을 경험할 수 있게 됩니다.
잘 만든 챗봇은 ‘살아있는 생물’과 같아서 사용자를 부르게 되고, 그에 따라 여러분의 서비스 활성도는 꾸준히 올라갈 것 입니다.
말풍선 타입별 응답 만들기
말풍선 설정하기
블록 상세화면 하단의 봇 응답형식 설정 영역에서 응답추가 버튼을 눌러 말풍선의 타입을 선택합니다. 각 말풍선은 생성한 말풍선들 중 무작위로 하나만 전송되는 랜덤형, 생성한 말풍선들을 모두 사용자에게 보여주는 케로셀형으로 사용할 수 있습니다. 그리고 하나의 블록에서 최대 3개의 연속된 말풍선을 응답으로 설정할 수 있습니다.
응답 추가 버튼을 눌러 응답 영역 메뉴를 펼친 화면
말풍선을 생성하기 위해서 확인해야 하는 상세한 스펙정보는 튜토리얼 > 말풍선 제작 스펙 정보에서 확인하실 수 있습니다.
말풍선 타입
- 텍스트형
- 이미지형
- 카드형
- 커머스형
- 리스트형
텍스트형
- 텍스트 전용 말풍선입니다.
- 필요에 따라 말풍선 안에서 최대 3개의 버튼을 추가하여 기능을 추가할 수 있습니다.
텍스트형 말풍선
이미지형
- 이미지 전용 말풍선입니다.
- 내 컴퓨터에 저장된 이미지를 올리거나 이미 업로드된 이미지의 URL을 입력할 수 있습니다.
- 노출되는 섬네일 이미지를 클릭할 경우, 봇 작업자는 이미지 뷰어를 통해 올린 원본 이미지를 저장/확대/축소할 수 있습니다.
Information. 이미지형은 등록된 이미지들 중 하나만 전송되는 랜덤형으로만 사용할 수 있습니다.
이미지형 말풍선 : 랜덤형타입, 1:1비율 타입 / 1:2 비율 타입 / 세로로 긴 이미지의 미리보기 예시
카드형
- 카드형 말풍선은 사용자에게 봇 작업자가 이미지, 이미지 / 텍스트, 이미지 / 텍스트 / 버튼으로 조합하여 구성할 수 있는 말풍선 입니다.
- 각 말풍선 내에서 버튼은 최대한 3개까지 추가할 수 있습니다.
Information.
카드형에서 등록할 이미지는 와이드형과 정사각형 중 선택할 수 있습니다.
- 와이드형 이미지를 설정하면 버튼을 최대 3개까지 등록할 수 있습니다.
- 정사각형 이미지를 설정하면 버튼을 최대 2개까지만 등록가능하고, 버튼은 가로로 배열됩니다.
카드형 말풍선 : 와이드형 이미지 타입
카드형 말풍선 : 정사각형 이미지 타입
커머스형
- 커머스형은 상품의 이미지와 가격정보, 상품명과 같은 사항을 표기해야 할 때 사용하는 말풍선입니다.
- 필요에 따라 버튼을 추가해 각 버튼에 기능을 설정할 수 있습니다.
- 상품 이미지와 가격을 필수로 입력해야 합니다.
- 상품 가격은 정확한 정보가 중요하므로 가격 설정에서 할인이 적용될 경우 할인금액/할인율 중 하나를 선택하여 할인정보를 입력해야 합니다.
- 할인 계산 과정에서 소수점 이하 가격은 반올림 처리됩니다.
Information.
커머스형 말풍선은 랜덤형으로 노출할 수 없습니다. 카드형 말풍선과 마찬가지로, 등록할 이미지는 와이드형과 정사각형 중 선택할 수 있습니다.
- 와이드형 이미지를 설정하면 버튼을 최대 3개까지 등록할 수 있습니다.
- 정사각형 이미지를 설정하면 버튼을 최대 2개까지만 등록가능하고, 버튼은 가로로 배열됩니다.
커머스형 말풍선 : 와이드형 이미지 타입
커머스형 말풍선 : 정사각형 이미지 타입
리스트형
- 리스트형은 목록형태로 노출할 때 사용하는 말풍선입니다.
- 상단부터 헤더와 목록, 버튼 순으로 구성되어 있습니다.
- 목록은 최소 1개에서 최대 5개까지 설정할 수 있고, 각 목록의 대표 문구를 필수로 설정해야 합니다.
- 노출되는 목록을 사용자가 클릭 했을 경우 실행되는 기능을 Web 링크/블록 연결/메시지 전송 중에서 설정할 수 있습니다.
- 목록의 기능을 블록 연결이나 메시지 전송으로 설정한 경우, 추가 정보를 입력할 수 있습니다.
- 연결되는 블록에 스킬이 연결되어 있는 경우, 추가 정보에 입력한 값이 스킬 서버에 추가적으로 제공됩니다.
- 연결된 스킬 payload의 clientExtra 필드에서 해당 값을 확인할 수 있습니다.
- 버튼은 가로로 노출되며 최대 2개까지 설정할 수 있습니다.
Information.
리스트형 말풍선은 하나의 말풍선만 노출할 수 있습니다.
Tip.
추가 정보에 입력한 값의 활용 예시 : 사용자 직접 입력 발화와 목록 클릭을 통해 발송되는 메시지(발화)가 동일한 경우, clientExtra 필드 내 값이 포함되어 있는지 여부를 확인하는 방법으로 구분할 수 있습니다.
- clientExtra 필드에 값 포함 : 목록 클릭을 통한 발화
- clientExtra 필드에 값 포함되지 않음 : 사용자 직접 입력 발화
리스트형 말풍선
스킬데이터로 활용
각 말풍선의 응답은 스킬데이터를 활용하여 구성할 수 있습니다.
파라미터 우측 상단의 스킬 및 버전 설정 셀렉트 박스
스킬을 활용한 응답설정은 아래 페이지에서 상세하게 확인할 수 있습니다.
말풍선별 출력 방식
응답 말풍선을 선택하면 랜덤형/케로셀형 중 하나를 선택하여 출력 방식을 설정할 수 있습니다.
랜덤형
- 랜덤형은 생성한 말풍선들 중 하나의 말풍선만 무작위로 전송됩니다.
- 커머스형 및 리스트형 타입은 랜덤형을 사용할 수 없습니다.
이미지형 말풍선 : 랜덤형을 적용했을 때
케로셀형
- 케로셀형은 생성한 모든 말풍선을 사용자에게 보여줍니다.
- 사용자는 화면을 좌우로 밀어 모든 말풍선을 확인할 수 있습니다.
- 이미지형 및 리스트형 타입은 케로셀형을 사용할 수 없습니다.
- 케로셀형은 최대 10개까지 생성할 수 있습니다.
커머스형 말풍선 : 케로셀형을 적용했을 때
케로셀헤드 설정
- 케로셀형으로 설정할 경우 케로셀 말풍선의 가장 앞에 케로셀헤드 말풍선을 설정할 수 있습니다.
- 케로셀헤드는 등록된 말풍선에 2장 이상일 때만 사용가능하며 위치를 변경하거나 복사할 수 없습니다.
- 케로셀헤드의 전체 높이는 뒤에 등록된 말풍선에서 가장 긴 높이에 맞추어집니다.
케로셀헤드는 카드형, 커머스타입 말풍선을 설정하신 후 케로셀형을 사용할 때 사용하실 수 있습니다.
전달하기 설정
- 말풍선을 전송할 때 전달하기 아이콘을 노출할지 설정할 수 있습니다.
- 전달가능 옵션은 출력이 단일형일 때 버튼이 없거나 버튼 기능 중 카카오톡 채널 포스트, 카카오톡 채널 쿠폰, 공유하기 플러그인이 포함된 경우에만 설정가능 합니다.
단일형 출력에서 버튼이 없을 경우 전달가능 옵션을 활성화 할 수 있습니다.
버튼 기능 설정
- 말풍선에 버튼을 추가할 경우 아래와 같은 기능을 사용할 수 있습니다.
- 말풍선 버튼에 들어가는 링크 타입은 webUrl 이며 http/ https 형식만 삽입 가능합니다.
커머스형 말풍선의 버튼을 설정할 때 버튼의 기능을 설정하는 화면
블록연결
- 사전에 만들어진 블록들이 노출되고 선택할 수 있습니다. 연결된 블록은 버튼 선택시 바로 실행이 됩니다.
- 연결되는 블록에 스킬이 연결되어 있는 경우, 추가 정보에 입력한 값이 스킬 서버에 추가적으로 제공됩니다.
- 연결된 스킬 payload의 clientExtra 필드에서 해당 값을 확인할 수 있습니다.
Tip.
추가 정보에 입력한 값의 활용 예시 : 사용자 직접 입력 발화와 버튼 클릭을 통해 발송되는 메시지(발화)가 동일한 경우, clientExtra 필드 내 값이 포함되어 있는지 여부를 확인하는 방법으로 구분할 수 있습니다.
- clientExtra 필드에 값 포함 : 버튼 클릭을 통한 발화
- clientExtra 필드에 값 포함되지 않음 : 사용자 직접 입력 발화
버튼을 설정할 때 버튼기능 중 블록연결하는 화면
URL링크
- 버튼 선택시 연결되는 URL 링크를 설정합니다.
- 설정한 URL 링크는 카카오톡 내 ‘인앱 브라우저’로 실행 됩니다.
버튼을 설정할 때 버튼기능 중 버튼을 클릭하면 연결할 URL을 입력하는 화면
전화
- 해당 말풍선에서 연결되는 전화번호를 설정합니다.
버튼을 설정할 때 버튼기능 중 전화번호를 입력하는 화면
메시지 전송
- 버튼 선택시 사용자 발화로 입력될 메시지를 설정합니다.
- 연결되는 블록에 스킬이 연결되어 있는 경우, 추가 정보에 입력한 값이 스킬 서버에 추가적으로 제공됩니다.
- 연결된 스킬 payload의 clientExtra 필드에서 해당 값을 확인할 수 있습니다.
Tip.
추가 정보에 입력한 값의 활용 예시 : 사용자 직접 입력 발화와 버튼 클릭을 통해 발송되는 메시지(발화)가 동일한 경우, clientExtra 필드 내 값이 포함되어 있는지 여부를 확인하는 방법으로 구분할 수 있습니다.
- clientExtra 필드에 값 포함 : 버튼 클릭을 통한 발화
- clientExtra 필드에 값 포함되지 않음 : 사용자 직접 입력 발화
버튼을 설정할 때 버튼기능 중 버튼을 눌렀을 때 전송될 발화를 입력하는 화면
플러그인
- 버튼 선택시 사용할 수 있는 플러그인을 설정합니다.
- 사용할 수 있는 플러그인 설명은 주요개념 > 플러그인에서 자세히 확인할 수 있습니다.
버튼을 설정할 때 버튼기능 중 응답에서 설정할 수 있는 플러그인 목록 화면
바로연결 응답 만들기
바로연결 응답이란?
바로연결이란 봇 디자이너의 자산 간 연결을 지원하는 기능입니다. 서로 다른 블록의 연결과 동일한 블록 내 엔트리들을 유저에게 노출하여 해당 봇의 다른 자산으로 쉽게 이동할 수 있도록 유도할 수 있습니다.
바로연결은 출력 영역의 가장 하단에 제공됩니다. 각 출력마다 바로연결을 제공할 수 없으며 한 블록에 하나의 바로연결만 설정 할 수 있습니다. 설정된 바로연결은 챗봇에서 발송되는 말풍선의 가장 하단에 노란색 타원형 버튼으로 제공됩니다. 버튼 당 최대 글자 수는 14글자, 최대 제공 버튼 개수는 10개입니다. 챗봇에서 바로연결 버튼을 클릭하면 메시지 형태로 발송되며, 바로연결 내에서 설정된 다음 액션을 연달아 수행합니다.
바로연결 설정 방법
엔티티 적용 방식
Tip.
- 나의 엔티티만 설정 가능하며 시스템 엔티티는 설정할 수 없습니다.
- 선택한 엔티티의 엔트리가 노출됩니다.
- 엔트리 목록 중 최대 10개의 엔트리를 선택할 수 있습니다.
- 전체 엔트리 목록에서 클릭으로 on/off 할 수 있습니다.
- 선택 엔트리 목록에서 드래그로 순서를 조정할 수 있습니다.
- 메시지를 입력하지 않으면 엔트리 선택 시 선택된 엔트리만 발화으로 전송됩니다.
- 메시지를 입력하면 엔트리 + 설정된 메시지로 발화가 전송됩니다.
- 14글자가 넘는 엔트리는 제외됩니다.
바로연결 엔티티 적용 방식 설정 예시
바로 연결 엔티티 적용 완료 예시
블록 연결 방식
Tip.
- 버튼명의 경우 유저가 보는 바로연결의 버튼명과 버튼을 클릭 했을 때 발송되는 메시지가 동일합니다.
- 버튼 기능 설정은 특정 블록의 출력을 바로 호출하는 기능입니다.
- 버튼 기능을 설정하면 버튼 명에 상관없이 설정 한 블록의 출력을 호출합니다.
- 연결되는 블록에 스킬이 연결되어 있는 경우, 추가 정보에 입력한 값이 스킬 서버에 추가적으로 제공됩니다.
연결된 스킬 payload의 clientExtra 필드에서 해당 값을 확인할 수 있습니다.- 추가 정보에 입력한 값의 활용 예시 : 사용자 직접 입력 발화와 버튼 클릭을 통해 발송되는 메시지(발화)가 동일한 경우, clientExtra 필드 내 값이 포함되어 있는지 여부를 확인하는 방법으로 구분할 수 있습니다.
clientExtra 필드에 값 포함 : 버튼 클릭을 통한 발화
clientExtra 필드에 값 포함되지 않음 : 사용자 직접 입력 발화
바로연결 블록 전송 방식 설정 예시
발화 전송 방식
Tip.
- 버튼명과 전송할 메시지를 다르게 설정할 수 있습니다.
- 버튼명 클릭 시 설정된 메시지가 발송됩니다.
- 설정된 메시지가 발화로 등록되어 있지 않다면, 클릭 시 폴백 메시지를 받게 됩니다.
- 연결되는 블록에 스킬이 연결되어 있는 경우, 추가 정보에 입력한 값이 스킬 서버에 추가적으로 제공됩니다.
연결된 스킬 payload의 clientExtra 필드에서 해당 값을 확인할 수 있습니다.- 추가 정보에 입력한 값의 활용 예시 : 사용자 직접 입력 발화와 버튼 클릭을 통해 발송되는 메시지(발화)가 동일한 경우, clientExtra 필드 내 값이 포함되어 있는지 여부를 확인하는 방법으로 구분할 수 있습니다.
clientExtra 필드에 값 포함 : 버튼 클릭을 통한 발화
clientExtra 필드에 값 포함되지 않음 : 사용자 직접 입력 발화
바로연결 발화 전송 방식 설정 예시
말풍선 제작 스펙 정보
본 스펙 정보는 모바일톡(IOS, Android) 환경에서 공백없는 한글 글자수를 기준으로 작성되었습니다. PC톡(Mac, Window) 환경이나 공백과 이모티콘을 사용한 문구에서는 차이가 발생할 수 있습니다.
말풍선 타입 | 필수입력 | 선택입력 | 이미지 비율 | |
---|---|---|---|---|
텍스트형 | 단일 랜덤 케로셀 |
텍스트 | 버튼 | - |
이미지형 | 단일 랜덤 |
이미지 | - | 원본 비율대로 Resize |
카드형 | 단일 랜덤 케로셀 |
이미지 | 타이틀 설명 이미지링크 버튼 |
2:1 1:1 |
커머스형 | 단일 케로셀 |
이미지 가격정보 |
이미지링크 프로필 정보 상품명 상품 설명 버튼 |
2:1 1:1 |
리스트형 | 단일 | 헤더문구 리스트 1개 (각 타이틀 필수) |
헤더링크 타이틀을 제외한 설정 항목 |
- |
버튼 수 | 최대 텍스트 수 | 액션(클릭) | ||
---|---|---|---|---|
텍스트형 | 세로배열 최대 3개 | 단일 (랜덤) |
텍스트(버튼X) 1,000자 텍스트(버튼O) 400자 버튼 14자 |
- |
케로셀 | 텍스트 128자 버튼 14자 |
설명 1000자 | ||
이미지형 | - | - | 이미지 뷰어 | |
카드형 | 세로배열 최대 3개 가로배열 최대 2개 |
단일 (랜덤) |
타이틀 50자 설명 230자 버튼 14자(가로배열 2개 8자) |
Web 링크 |
케로셀 | 타이틀 40자 설명(타이틀X) 80자 설명(타이틀O) 40자 버튼 14자(가로배열 2개 8자) |
|||
커머스형 | 세로배열 최대 3개 가로배열 최대 2개 |
프로필 타이틀 15자 상품명 30자 상품 설명 40자 버튼 14자(가로배열 2개 8자) |
Web 링크 | |
리스트형 | 가로배열 최대 2개 | 헤더문구 15자 타이틀(설명X) 35자 타이틀(설명O) 30자 설명 16자 버튼 14자(가로배열 2개 8자) |
Web 링크 블록 연결 메시지 전송 |
Information.
카드형과 커머스형 말풍선의 경우, 이미지 타입을 1:1(정사각형)로 변경시 버튼 배열이 가로형 배열로 변경됩니다.