슬랙봇 디자인이라고 하면 단순한 UI정도로 생각하는 경향이 있는데, 토스에서 좋은 슬랙봇 디자인은 무엇일까에 대해 치열하게 고민했던 흔적이 담겨있는 글이 있어 공유드립니다. 🤔 좋은 슬랙봇이란 무엇일까요? 슬랙봇은 채팅 앱에서 업무를 "가장 빠르게 처리하도록 도와주는" 역할을 담당하고 있습니다. 업무 중엔 채팅으로 가장 이야기를 많이 나누는데, 슬랙봇은 해야 하는 태스크를 업무 대화 맥락에 위치시켜 빠르게 처리하게 돕기 위해서 사용됩니다. 또한 슬랙봇은 메이커 입장에서 싸게 만들 수 있어서 편리하고, 유저 입장에서는 업무 맥락에서 다른 페이지로 이동할 필요 없이 바로 사용할 수 있어서 편리합니다. 👁️ 슬랙이라는 플랫폼 슬랙이라는 플랫폼의 특이한 구현 제약사항을 이해해야합니다. 슬랙 위에서 디자인하는 건 디자인 툴 위에서 그림을 그리는 우리 멘탈 모델과 달라서 시안을 가져가면 문제가 생기는 경우가 많습니다. 가장 다른 점은 슬랙은 HTML 등 웹 문서 마크업 하는 방식이 아닌, 슬랙에서 정의한 블록이라는 개념으로 이뤄져있다는 것입니다. 그래서 슬랙에 몇 가지 제약 사항을 이해해야 좀 더 고도화된 UX를 만들 수 있습니다. ⛹🏻 타사, 자사 레퍼런스 찾아보기 슬랙이라는 플랫폼 제약 위에서 잘 디자인하려면 이미 잘 돌아가고 있는 제품을 확인해야 합니다. 어떤 식으로 제약 조건을 우회했는지, 어떤 모양으로 만들면 최적의 설계인지, 사용자와 커뮤니케이션은 어떻게 하는지, 마케팅은 어떻게 하는지를 기준삼아 참고하며 만들었습니다. 또한 내부 구성원들에 반응이 좋았던 슬랙봇 모양을 참고했고, 업무를 독려하는 커뮤니케이션을 위해 위트가 섞인 봇을 만든 것을 참고했습니다. 👩‍💻 심플한 인터페이스 설계 여러 슬랙봇들을 참고했을 때 더 단순하고 심플해야 빠르게 태스크를 수행할 수 있다는 사실을 알게 되었습니다. 너무 많은 버튼을 노출한다거나, 설명과 버튼 간 거리가 너무 멀다거나 하는 복잡한 인터페이스는 사용자들이 뭘 눌러야 할지 혼란을 느끼기 때문에 지양해야 합니다. 심플한 인터페이스를 설계하려고 할 때 PP리뷰와 UT의 도움을 받았습니다. 그리고 내부 제품이다 보니 사용성 테스트도 사용자를 만나기 너무 쉽기 때문에 바로 진행했습니다. 🏃🏻‍♀️ 사용자 맥락 이해 슬랙봇을 어떤 업무 맥락에서 쓰는지가 중요하기 때문에 용도와 맥락에 따라 디자인되어야 합니다. 이를 구분하는 구분자는 "단순 열람인지, 아닌지"였고, 구분자에 따라 가독성만 따지면 될지, 버튼과 화면 전환 등 인터렉션이 많이 들어가게 만들어야 할지 등 전반적인 컨셉을 정하게 되었습니다. 🏋️ 슬랙봇을 만들기 전에 할 일 리스트 슬랙 블록에 대해 이해하고 배운점 내 언어로 정리하기 슬랙에서 제공하는 블록킷 빌더 써보기 슬랙 앱 목록 화면에서 다양한 봇의 모양을 살펴보고 조사하기 인터페이스 설계를 하고나면 고객이나 팀원 대상으로 UT해보기 사용자 맥락을 이해하고 디자인했는지 점검하기