디자이너를 위한 챗봇 디자인 Tip -삼성카드 챗봇구축 인사이트 (2)

디자이너를 위한 챗봇 디자인 Tip -삼성카드 챗봇구축 인사이트 (2)

디자이너를 위한 챗봇 디자인 Tip -삼성카드 챗봇구축 인사이트 (2)
Category
Share Story

삼성카드 챗봇 구축 인사이트 1편 퍼소나를 반영한 캐릭터 구축과 그래픽, 애니메이션의 활용방법에 이어 2편에서는 대화형 인터페이스 활용과  챗봇 구조를 이해하고 다양하게 활용하는 것에 대해서 이야기 해 보겠습니다.

004

3.다양한 인터페이스 활용으로 대화형 인터페이스의 한계를 개선합니다.

하나의 ‘목적’을 이루기 위해서는 많은 ’조건’을 필요로 합니다.
그 조건들을 수행하는 데 있어서 꼭 텍스트로 피드백을 해야 할까요?

대화형 UI를 보완하여 효율적인 정보 전달 방법을 꼭 고려해 주세요
텍스트 기반의 대화형 인터페이스(CUI)는 정확한 정보 전달에 한계가 있습니다. 때로는 대화 목적에 따라 효율적인 정보 전달 방법을 고민해야 합니다. 사용자가 대화형 봇을 이용하는 목적은 굉장히 뚜렷하기 때문에 새로운 경험을 탐색하고 학습시키기보다 익숙한 카드형 UI를 활용하여 정보를 전달하는 것이 효과적입니다.

한 예로, 새로운 카드를 만들고자 챗봇에게 ‘카드 추천’을 받는다고 가정해 봅시다.
10가지의 혜택을 A카드사 챗봇은 텍스트로 알려 주고. B카드사 챗봇은 카드형 UI를 통해 중요 혜택을 그래픽화하여 안내해 줍니다.
어떤 방법이 효과적으로 가입을 유도할 수 있을까요? 텍스트로 제공된 카드 혜택은 스팸 문자처럼 지나치기 쉬워 보입니다.

005

 

또 가능한 많은 상호 작용을 위해 텍스트 입력을 단순화하려는 노력이 필요합니다.
회원가입을 하기 위해 이름, 생년월일, 전화번호, 이메일 주소를 입력해야 한다면, 사용자는 총 네 번의 질문을 받고 네 번의 대답을 해야 합니다. 철저하게 사용자 입장을 생각한다면 한 번에 4개의 문항에 답하고 원할 때 수정할 수 있는 기존 입력 방식이 더 효율적입니다. 적절한 UI 활용은 실제로 답을 얻는 시간을 단축할 수 있습니다.

006

아래 이미지처럼 대답을 선택지로 제안할 수도 있죠.
사용자의 질문 중 답이 명확하게 정해져 있는 경우 버튼을 클릭하게 유도하는 것만으로 돈으로 사용자의 대답을 끌어낼 수 있습니다.
터치만으로 탐색이 이루어지고 답을 제안하는 과정은 답을 사용자에게 질문을 입력하는 번거로움을 줄여줄 뿐만 아니라 챗봇 이용이 지루하게 느껴질 수 있는 부분을 해소한 좋은 예입니다.

 

007

 

이처럼 챗봇이라고 하여 대화식으로 풀어가는 것이 모든 상황에 적합한 것은 아닙니다. 다른 인터페이스를 활용함으로써 사용자의 참여도를 높이고 효율적으로 정보를 전달하는 방법을 고민해 보아야 합니다.

다양한 정보를 전달하기 위한 일관성 있는 가이드가 필요합니다.
지금까지 UI를 통한 사용성 개선에 대해 이야기를 했는데요. 정보를 표현하는 방법도 대화형 인터페이스의 한계점을 보완할 방법 중에 하나입니다. 특히 서비스 챗봇은 종속된 분야에 따라 담아야 하는 콘텐츠가 다양하기 때문에 일관성 있는 가이드를 만들어 공통적으로 활용할 수 있는 가이드를 정립하는 것이 중요한데요.

아래 이미지는 페이스북 챗봇 가이드입니다. 제품 사진, 그래프, 비디오, 버튼 등 다양한 요소들을 보여주고 있지만, 대화의 흐름은 메시징 플랫폼 고유의 느낌을 일관성 있게 유지하고 있습니다. 어느 정도의 자유도는 제한되지만 다양한 성격의 서비스를 수용해야 하는 상황에 최적의 가이드라 생각합니다.

 

008

 

삼성카드 챗봇 또한 카드사의 정보를 다양한 정보를 보여주기 위해 삼성카드 웹에서 각각 다르게 제공하는 정보를 일관성 있게 보여 줄 수 있는 가이드를 구축하였습니다.

 

009

 

4. 챗봇의 기본구조를 이해하고 활용하세요.

제공하는 서비스에 따라 챗봇의 기본 구조를 활용하여 더 효율적으로 대화를 할 수 있는데요
이때 챗봇의 메신저 형식을 깨지 않는 선에서 플랫폼의 일관성을 유지해야 합니다.

Composer와 Keypad area활용
사용자의 대답을 유도하는 방법이 하나일 필요는 없습니다. 말풍선 아래 버튼을 노출하는 방식으로는 콘텐츠를 모두 담을 수 없다면 Composer와 Keypad area를 활용하여 더욱 직관적으로 사용자의 대답을 유도할 수 있습니다.

 

010

 

Bubble의 UI개선
파일을 전송하거나 음성으로 대화를 할 때 말풍선을 활용하면 더욱더 직관적이고 감성적인 대화가 가능합니다.

 

011

 

아이콘(BI,캐릭터) 적용
아이콘은 더욱 감성적인 대화를 위한 방법 중 하나입니다.
말풍선 옆에 위치한 아이콘은 말하는 주체를 직관적으로 알려주지만 챗봇은 메신저가 아니기 때문에 대화 상대를 구분해 줄 필요는 없습니다. 제약 없이 다양한 시도를 해 보세요.
그러나 너무 많은 아이콘 활용은 정보를 해칠 수 있으니 챗봇의 목적을 잊지 마세요!

 

012

 

마무리하며

삼성카드 챗봇 프로젝트를 떠올리며 금융/카드사 챗봇 디자인에 대하여 느꼈던 점들을 정리해보았는데요. 기술적이고 환경적인 부분에 부딪혀 실제로 반영해보지 못한 부분도 많았습니다.
앞으로는 실제 AI가 도입되며 챗봇의 활용과 신뢰도가 높아질 것이고, 대화형을 보완하는 인터페이스는 더 많이 제공되며 환경도 더 나아지리라 생각합니다..

기술적인 부분이 보완되어도 사용자가 어떻게 챗봇을 활용할지를 이해하지 못하면 서비스가 제대로 제공될 수 없습니다. 하고자 하는 서비스가 어떤 것인지를 명확하게 정하면 기술의 발전까지 더해 더 좋은 서비스를 제공할 수 있을 거로 생각합니다.
여러분의 챗봇 디자인에 작은 도움이 되었길 바라며 마무리하겠습니다.
감사합니다.

 

– 가치 디자인그룹 이하정

 

 

 _ * 전편 보기-
디자이너를 위한 챗봇 디자인 Tip -삼성카드 챗봇구축 인사이트 (1)

* 시리즈 보기
챗봇 기획자를 위한 실전 Tip – 챗봇 UX 설계 시 체크 포인트 (1)
챗봇 기획자를 위한 실전 Tip – 챗봇 UX 설계 시 체크 포인트 (2)
디자이너를 위한 챗봇 디자인 Tip -삼성카드 챗봇구축 인사이트 (1)
디자이너를 위한 챗봇 디자인 Tip -삼성카드 챗봇구축 인사이트 (2)

 

 

[참고 자료]
1. https://www.invisionapp.com/inside-design/learn-ux-design-build-chatbot/
2. http://www.devpools.kr/2017/05/30/챗봇-프로젝트를-진행하면서-알게-된-사실들/
3. https://chatbotsmagazine.com/a-beginners-guide-to-designing-smart-chatbots-5217e2196578
4. https://booking.design/7-things-you-need-to-know-about-designing-a-chat-bot-4f07886d3fd0
5. https://medium.com/voice-tech-podcast/conversation-design-workflow-how-to-design-your-chatbot-in-10-basic-steps-721652b056d
6. https://onix-systems.com/blog/how-to-design-a-chatbot-creating-a-conversational-interface