우리는 Blue 플랫폼 문서에 맞춰 훈련된 자체 문서 AI 챗봇을 만들었습니다.
Blue에서는 고객의 삶을 더 쉽게 만들 방법을 항상 찾고 있습니다. 우리는 모든 기능에 대한 심층 문서, YouTube 비디오, 팁과 요령, 그리고 다양한 지원 채널을 제공합니다.
우리는 프로젝트 관리 자동화에 매우 관심이 많기 때문에 AI(인공지능)의 발전을 주의 깊게 지켜보고 있습니다. 우리는 또한 수천 명의 고객을 위해 작업을 더 쉽게 만들기 위해 AI 자동 분류 및 AI 요약와 같은 기능을 출시했습니다.
분명한 것은 AI가 사라지지 않을 것이며, 대부분의 산업에 놀라운 영향을 미칠 것이라는 점입니다. 프로젝트 관리도 예외는 아닙니다. 그래서 우리는 고객의 전체 라이프사이클을 지원하기 위해 AI를 어떻게 더 활용할 수 있을지 스스로에게 질문했습니다. 이는 발견, 사전 판매, 온보딩 및 지속적인 질문에 대한 지원을 포함합니다.
답은 꽤 명확했습니다: 우리는 문서에 맞춰 훈련된 AI 챗봇이 필요했습니다.
사실을 직시합시다: 모든 조직은 아마도 챗봇을 가져야 할 것입니다. 챗봇은 고객이 복잡한 문서나 웹사이트를 뒤적이지 않고도 일반적인 질문에 대한 즉각적인 답변을 얻을 수 있는 훌륭한 방법입니다. 현대 마케팅 웹사이트에서 챗봇의 중요성은 과장될 수 없습니다.
특히 소프트웨어 회사의 경우, 마케팅 웹사이트를 별도의 "것"으로 간주해서는 안 됩니다 — 그것은 당신의 제품의 일부입니다. 이는 일반적인 고객 라이프사이클에 맞기 때문입니다:
- 인지 (발견): 잠재 고객이 처음으로 당신의 멋진 제품을 발견하는 곳입니다. 당신의 챗봇은 그들에게 주요 기능과 이점을 즉시 안내하는 친절한 가이드가 될 수 있습니다.
- 고려 (교육): 이제 그들은 호기심이 생기고 더 알고 싶어합니다. 당신의 챗봇은 그들의 특정 요구와 질문에 맞춘 정보를 제공하는 개인 튜터가 됩니다.
- 구매/전환: 이것이 진정한 순간입니다 - 잠재 고객이 결정을 내리고 고객이 되는 순간입니다. 당신의 챗봇은 마지막 순간의 문제를 해결하고 "구매하기 직전" 질문에 답변하며, 거래를 성사시키기 위해 달콤한 제안을 할 수도 있습니다.
- 온보딩: 그들은 구매했습니다. 이제 무엇을 해야 할까요? 당신의 챗봇은 유용한 조수로 변신하여 새로운 사용자가 설정을 진행하고, 사용법을 안내하며, 제품의 환상적인 세계에서 길을 잃지 않도록 도와줍니다.
- 유지: 고객을 행복하게 유지하는 것이 핵심입니다. 당신의 챗봇은 24/7 대기 중이며, 문제를 해결하고, 팁과 요령을 제공하며, 고객이 사랑받고 있다고 느끼도록 합니다.
- 확장: 이제 레벨업할 시간입니다! 당신의 챗봇은 고객이 이미 제품을 사용하는 방식에 맞춰 새로운 기능, 업셀 또는 크로스셀을 부드럽게 제안할 수 있습니다. 이는 항상 대기 중인 매우 똑똑하고 강요하지 않는 판매원과 같습니다.
- 옹호: 행복한 고객은 당신의 가장 큰 응원자가 됩니다. 당신의 챗봇은 만족한 사용자에게 소문을 퍼뜨리거나 리뷰를 남기거나 추천 프로그램에 참여하도록 격려할 수 있습니다. 이는 제품에 내장된 홍보 기계와 같습니다!
구축 대 구매 결정
AI 챗봇을 구현하기로 결정한 후, 다음 큰 질문은: 구축할 것인가, 구매할 것인가? 핵심 제품에 집중하는 작은 팀으로서, 우리는 일반적으로 "서비스로서" 솔루션이나 인기 있는 오픈 소스 플랫폼을 선호합니다. 모든 기술 스택의 모든 부분에 대해 바퀴를 재발명할 필요는 없으니까요.
그래서 우리는 소매 및 오픈 소스 AI 챗봇 솔루션을 찾기 위해 시장에 뛰어들었습니다.
우리의 요구 사항은 간단했지만 양보할 수 없는 것이었습니다:
- 브랜드 없는 경험: 이 챗봇은 단순히 갖추어야 할 위젯이 아닙니다. 이는 우리의 마케팅 웹사이트와 궁극적으로 제품에 들어갈 것입니다. 우리는 우리의 디지털 공간에서 다른 브랜드를 광고하는 것에 관심이 없습니다.
- 우수한 사용자 경험: 많은 잠재 고객에게 이 챗봇은 Blue와의 첫 번째 접점일 수 있습니다. 이는 우리 회사에 대한 그들의 인식을 설정합니다. 사실, 웹사이트에서 적절한 챗봇을 구현하지 못한다면, 고객이 우리의 미션 크리티컬 프로젝트와 프로세스에 대해 어떻게 신뢰할 수 있을까요?
- 합리적인 비용: 대규모 사용자 기반과 챗봇을 핵심 제품에 통합할 계획이 있는 만큼, 사용량이 증가할 때 비용이 과도하게 발생하지 않는 솔루션이 필요했습니다. 이상적으로는 BYOK(Bring Your Own Key) 옵션을 원했습니다. 이를 통해 우리는 OpenAI 또는 다른 AI 서비스 키를 사용하여 직접 변동 비용을 지불하고, 실제로 모델을 실행하지 않는 제3자 공급업체에 대한 마크업을 피할 수 있습니다.
- OpenAI Assistants API 호환: 오픈 소스 소프트웨어를 선택할 경우, 문서 수집, 인덱싱, 벡터 데이터베이스 등을 관리하는 번거로움을 원하지 않았습니다. 우리는 OpenAI Assistants API를 사용하여 API 뒤에 있는 모든 복잡성을 추상화하고 싶었습니다. 솔직히 — 이것은 정말 잘 되어 있습니다.
- 확장성: 우리는 이 챗봇을 여러 곳에 배치하고, 연간 수만 명의 사용자가 사용할 수 있기를 원합니다. 우리는 상당한 사용량을 예상하며, 우리의 요구에 맞게 확장할 수 없는 솔루션에 묶이고 싶지 않습니다.
상업적 AI 챗봇
우리가 검토한 챗봇들은 오픈 소스 솔루션보다 더 나은 사용자 경험을 제공하는 경향이 있었습니다 — 불행히도 종종 그렇습니다. 많은 오픈 소스 솔루션이 사용자 경험의 중요성을 무시하거나 과소평가하는 이유에 대한 별도의 논의가 필요할 것입니다.
여기 몇 가지 훌륭한 상업적 제품을 찾고 계신다면 목록을 제공하겠습니다:
- Chatbase: Chatbase는 당신의 지식 기반에 맞춰 훈련된 맞춤형 AI 챗봇을 구축하고 이를 웹사이트에 추가하거나 API를 통해 상호작용할 수 있게 해줍니다. 신뢰할 수 있는 답변, 리드 생성, 고급 분석 및 여러 데이터 소스에 연결할 수 있는 기능을 제공합니다. 우리에게는 가장 세련된 상업적 제품 중 하나로 느껴졌습니다.
- DocsBot AI: DocsBot AI는 지원, 사전 판매, 연구 등을 위해 당신의 문서와 콘텐츠에 맞춰 훈련된 맞춤형 ChatGPT 봇을 생성합니다. 웹사이트에 챗봇을 쉽게 추가할 수 있는 임베디드 위젯, 지원 티켓에 자동으로 응답하는 기능, 통합을 위한 강력한 API를 제공합니다.
- CustomGPT.ai: CustomGPT.ai는 웹사이트 콘텐츠, 헬프 데스크, 지식 기반, 문서 등을 포함한 비즈니스 데이터를 수집하여 개인화된 챗봇 경험을 생성합니다. 리드가 질문을 하고 콘텐츠에 기반한 즉각적인 답변을 받을 수 있도록 하여 검색할 필요가 없습니다. 흥미롭게도, 그들은 또한 RAG(검색 증강 생성)에서 OpenAI를 이겼다고 주장합니다!
- OpenAssistantGPT: 이것은 흥미로운 상업적 제품입니다. 왜냐하면 또한 오픈 소스 소프트웨어이기 때문입니다. 약간 초기 단계인 것 같고, 가격이 현실적이지 않게 느껴졌습니다 ($27/월 무제한 메시지).
우리는 또한 InterCom Fin을 살펴보았는데, 이는 그들의 고객 지원 소프트웨어의 일부입니다. 이는 우리가 Blue를 시작한 이후로 사용해온 HelpScout에서 벗어나는 것을 의미합니다. 가능할 수도 있었지만, InterCom Fin의 가격이 너무 비쌌습니다.
그리고 이것이 상업적 제품의 많은 문제입니다. InterCom Fin은 처리된 고객 지원 요청당 $0.99를 청구하고, ChatBase는 40,000 메시지에 대해 $399/월을 청구합니다. 이는 단순한 챗 위젯에 대해 연간 거의 $5,000입니다.
AI 추론의 가격이 미친 듯이 떨어지고 있다는 점을 고려할 때, OpenAI는 가격을 상당히 대폭 인하했습니다:
- 원래 GPT-4(8k 컨텍스트)는 1K 프롬프트 토큰당 $0.03로 가격이 책정되었습니다.
- GPT-4 Turbo(128k 컨텍스트)는 1K 프롬프트 토큰당 $0.01로 가격이 책정되어 원래 GPT-4에서 50% 인하되었습니다.
- GPT-4o 모델은 1K 토큰당 $0.005로 가격이 책정되어 GPT-4 Turbo 가격에서 추가로 50% 인하되었습니다.
이는 비용이 83% 감소한 것이며, 우리는 이것이 정체되지 않을 것이라고 예상합니다.
연간 수만 명의 사용자가 사용할 수 있는 확장 가능한 솔루션을 찾고 있었기 때문에, 직접 소스에 가서 API 비용을 직접 지불하고, 비용을 마크업하는 상업적 버전을 사용하지 않는 것이 합리적입니다.
오픈 소스 AI 챗봇
앞서 언급했듯이, 우리가 검토한 오픈 소스 옵션은 "우수한 사용자 경험" 요구 사항에 대해 대부분 실망스러웠습니다.
우리는 다음을 살펴보았습니다:
- Deepchat: 이는 AI 서비스용 프레임워크 독립적인 채팅 구성 요소로, OpenAI를 포함한 다양한 AI API에 연결됩니다. 사용자가 브라우저에서 직접 실행되는 AI 모델을 다운로드할 수 있는 기능도 있습니다. 우리는 이것을 가지고 놀아보았고 작동하는 버전을 얻었지만, 구현된 OpenAI Assistants API는 여러 가지 문제로 꽤 버그가 있었습니다. 그러나 이는 매우 유망한 프로젝트이며, 그들의 플레이그라운드는 정말 잘 만들어졌습니다.
- OpenAssistantGPT: 오픈 소스 관점에서 다시 살펴보면, 이는 우리가 상당한 인프라를 구축해야 한다는 것을 의미합니다. 우리는 OpenAI의 Assistants API에 최대한 의존하고 싶었기 때문에 그렇게 하고 싶지 않았습니다.
자체 챗봇 구축하기
그래서, 우리의 모든 요구 사항에 맞는 것을 찾지 못한 채, 우리는 OpenAI Assistants API와 인터페이스할 수 있는 자체 AI 챗봇을 구축하기로 결정했습니다. 결과적으로, 이는 비교적 수월한 작업이었습니다!
우리 웹사이트는 Nuxt3, Vue3 (Blue 플랫폼과 동일한 프레임워크), 그리고 TailwindUI를 사용합니다.
첫 번째 단계는 Nuxt3에서 OpenAI Assistants API와 "대화"할 수 있는 API(응용 프로그램 프로그래밍 인터페이스)를 만드는 것이었습니다. 이는 모든 작업을 프론트 엔드에서 처리하고 싶지 않았기 때문에 필요했습니다. 이렇게 하면 우리의 OpenAI API 키가 세상에 노출되어 남용될 가능성이 있기 때문입니다.
우리의 백엔드 API는 사용자의 브라우저와 OpenAI 사이의 안전한 중개자 역할을 합니다. 다음과 같은 기능을 수행합니다:
- 대화 관리: 각 대화에 대한 "스레드"를 생성하고 관리합니다. 스레드는 당신이 말한 모든 것을 기억하는 고유한 채팅 세션으로 생각할 수 있습니다.
- 메시지 처리: 메시지를 보내면, 우리의 API는 이를 올바른 스레드에 추가하고 OpenAI의 어시스턴트에게 응답을 작성하도록 요청합니다.
- 스마트 대기: 로딩 화면을 바라보게 하지 않고, 우리의 API는 매초 OpenAI에 체크하여 응답이 준비되었는지 확인합니다. 이는 요리사에게 매 두 초마다 귀찮게 하지 않고도 주문을 지켜보는 웨이터와 같습니다.
- 보안 우선: 모든 작업을 서버에서 처리함으로써, 우리는 당신의 데이터와 우리의 API 키를 안전하게 유지합니다.
그런 다음 프론트 엔드와 사용자 경험이 있었습니다. 앞서 논의한 바와 같이, 이는 매우 중요했습니다. 왜냐하면 우리는 첫인상을 만드는 데 두 번째 기회를 얻지 못하기 때문입니다!
챗봇을 설계할 때, 우리는 사용자 경험에 세심한 주의를 기울여 모든 상호작용이 매끄럽고 직관적이며 Blue의 품질에 대한 헌신을 반영하도록 했습니다. 챗봇 인터페이스는 간단하고 우아한 Blue 원으로 시작하며, HeroIcons를 사용하여 아이콘을 표시합니다 (우리는 Blue 웹사이트 전반에 걸쳐 이를 사용합니다). 이 디자인 선택은 시각적 일관성과 즉각적인 브랜드 인식을 보장합니다.
우리는 때때로 사용자가 추가 지원이나 더 깊이 있는 정보가 필요할 수 있다는 것을 이해합니다. 그래서 챗봇 인터페이스 내에 편리한 링크를 포함했습니다. 지원을 위한 이메일 링크가 즉시 제공되어 사용자가 더 개인화된 지원이 필요할 경우 우리 팀에 직접 연락할 수 있습니다. 또한, Blue의 제공 사항에 대해 더 깊이 파고들고자 하는 사람들을 위해 포괄적인 리소스에 쉽게 접근할 수 있는 문서 링크도 포함했습니다.
사용자 경험은 챗봇 창을 열 때의 세련된 페이드 인 및 페이드 업 애니메이션으로 더욱 향상됩니다. 이러한 미세한 애니메이션은 인터페이스에 세련미를 더해 상호작용을 더 역동적이고 매력적으로 만듭니다. 우리는 또한 사용자가 챗봇이 그들의 질문을 처리하고 응답을 작성하고 있다는 것을 알 수 있도록 하는 타이핑 표시기를 구현했습니다. 이 시각적 신호는 사용자 기대를 관리하고 능동적인 커뮤니케이션의 감각을 유지하는 데 도움이 됩니다.
일부 대화가 더 많은 화면 공간을 필요로 할 수 있음을 인식하여, 우리는 대화를 더 큰 창에서 열 수 있는 기능을 추가했습니다. 이 기능은 더 긴 교환이나 상세 정보를 검토할 때 특히 유용하며, 사용자가 챗봇을 자신의 필요에 맞게 조정할 수 있는 유연성을 제공합니다.
비하인드 씬에서는 챗봇의 응답을 최적화하기 위해 몇 가지 지능형 처리를 구현했습니다. 우리의 시스템은 AI의 응답을 자동으로 파싱하여 내부 문서에 대한 참조를 제거하여, 제공되는 정보가 깔끔하고 관련성이 있으며 오로지 사용자의 질문을 해결하는 데 집중되도록 합니다.
가독성을 높이고 더 미세한 커뮤니케이션을 가능하게 하기 위해, 우리는 'marked' 라이브러리를 사용하여 마크다운 지원을 통합했습니다. 이 기능은 AI가 굵게 및 기울임 강조, 구조화된 목록, 필요할 경우 코드 스니펫을 포함한 잘 형식화된 텍스트를 제공할 수 있게 해줍니다. 이는 질문에 대한 잘 형식화된 맞춤형 미니 문서를 받는 것과 같습니다.
마지막으로, 우리는 구현에서 보안을 최우선으로 두었습니다. DOMPurify 라이브러리를 사용하여 마크다운 파싱에서 생성된 HTML을 정화합니다. 이 중요한 단계는 콘텐츠가 사용자에게 표시되기 전에 잠재적으로 해로운 스크립트나 코드가 제거되도록 보장합니다. 이는 우리가 제공하는 유용한 정보가 정보적일 뿐만 아니라 안전하게 소비될 수 있도록 하는 방법입니다.
향후 개발
이것은 시작에 불과하며, 이 기능에 대해 흥미로운 것들이 로드맵에 있습니다.
우리의 향후 기능 중 하나는 실시간으로 응답을 스트리밍하는 기능입니다. 곧 챗봇의 답변이 문자 단위로 나타나 대화가 더 자연스럽고 역동적으로 느껴지게 될 것입니다. 이는 AI가 생각하는 모습을 보는 것과 같아, 대화의 모든 단계에서 사용자와의 상호작용을 더 매력적이고 인터랙티브하게 만듭니다.
우리의 소중한 Blue 사용자들을 위해, 우리는 개인화를 작업하고 있습니다. 챗봇은 사용자가 로그인했을 때 이를 인식하고, 계정 정보, 사용 이력 및 선호도에 따라 응답을 조정합니다. 질문에 답변할 뿐만 아니라 Blue 생태계 내에서 특정 맥락을 이해하는 챗봇을 상상해 보세요. 더 관련성 있고 개인화된 지원을 제공할 수 있습니다.
여러 프로젝트를 진행 중이거나 다양한 질문이 있을 수 있음을 이해합니다. 그래서 우리는 챗봇과 여러 개별 대화 스레드를 유지할 수 있는 기능을 개발하고 있습니다. 이 기능은 사용자가 다른 주제 간에 원활하게 전환할 수 있도록 하여, 맥락을 잃지 않게 합니다 — 마치 브라우저에서 여러 탭을 여는 것과 같습니다.
상호작용을 더욱 생산적으로 만들기 위해, 우리는 현재 대화에 따라 제안된 후속 질문을 제공하는 기능을 만들고 있습니다. 이는 사용자가 주제를 더 깊이 탐구하고, 질문하지 않았던 관련 정보를 발견하는 데 도움이 되어, 각 채팅 세션을 더 포괄적이고 가치 있게 만듭니다.
우리는 또한 특정 요구에 맞춰 각기 다른 AI 어시스턴트의 모음을 만드는 것에 대해 흥미를 느끼고 있습니다. 사전 판매 질문에 답변하거나, 새로운 프로젝트를 설정하거나, 고급 기능을 문제 해결하는 데 필요한 어시스턴트를 선택할 수 있습니다. 이는 Blue 전문가 팀이 손끝에 있는 것과 같습니다. 각 전문가가 우리 플랫폼의 다양한 측면을 전문으로 하고 있습니다.
마지막으로, 우리는 사용자가 스크린샷을 직접 채팅에 업로드할 수 있는 기능을 작업하고 있습니다. AI는 이미지를 분석하고, 보이는 것에 따라 설명이나 문제 해결 단계를 제공합니다. 이 기능은 Blue를 사용하는 동안 발생하는 특정 문제에 대한 도움을 받는 것을 그 어느 때보다 쉽게 만들어, 시각적 정보와 텍스트 지원 간의 간극을 메워줍니다.
결론
우리는 AI 챗봇 개발 프로세스에 대한 이 심층 분석이 Blue에서의 제품 개발 사고에 대한 귀중한 통찰을 제공했기를 바랍니다. 챗봇의 필요성을 인식하는 것에서부터 자체 솔루션을 구축하는 것까지의 여정은 우리가 의사 결정을 내리고 혁신을 추구하는 방식을 보여줍니다.
Blue에서는 항상 사용자를 최우선으로 고려하여 구축 대 구매의 옵션을 신중하게 평가합니다. 이 경우, 우리는 우리의 특정 요구를 충족할 수 있는 비용 효율적이면서도 시각적으로 매력적인 챗봇에 대한 시장의 상당한 격차를 확인했습니다. 일반적으로 기존 솔루션을 활용하는 것을 권장하지만, 때때로 가장 좋은 경로는 고유한 요구 사항에 맞춘 것을 만드는 것입니다.
자체 챗봇을 구축하기로 한 결정은 가볍게 내려진 것이 아닙니다. 이는 철저한 시장 조사, 우리의 필요에 대한 명확한 이해, 그리고 사용자에게 가능한 최고의 경험을 제공하려는 헌신의 결과였습니다. 내부에서 개발함으로써, 우리는 현재의 요구를 충족할 뿐만 아니라 향후 개선 및 통합을 위한 기반을 마련할 수 있는 솔루션을 만들 수 있었습니다.
이 프로젝트는 Blue에서의 접근 방식을 잘 보여줍니다: 우리는 제품과 사용자에게 올바른 선택일 때는 기꺼이 소매를 걷어붙이고 무언가를 처음부터 만드는 것을 두려워하지 않습니다. 이러한 추가 노력을 기울이는 것이 고객의 요구를 진정으로 충족하는 혁신적인 솔루션을 제공할 수 있게 해줍니다.
우리는 AI 챗봇의 미래와 잠재적인 Blue 사용자 및 기존 사용자에게 가져다줄 가치를 기대하고 있습니다. 기능을 계속 개선하고 확장해 나가면서, 프로젝트 관리 및 고객 상호작용에서 가능한 것의 경계를 계속해서 밀어붙일 것입니다.
우리의 개발 프로세스를 통해 이 여정에 함께 해주셔서 감사합니다. 이것이 Blue의 모든 측면에서 우리가 취하는 사려 깊고 사용자 중심의 접근 방식을 엿볼 수 있기를 바랍니다. 계속해서 여러분을 더 잘 지원하기 위해 플랫폼을 발전시키고 향상시킬 수 있도록 더 많은 업데이트를 기대해 주세요.
관심이 있으시다면, 이 프로젝트의 소스 코드 링크를 여기에서 찾을 수 있습니다:
- ChatWidget: 이는 챗 위젯 자체를 구동하는 Vue 구성 요소입니다.
- Chat API: 이는 챗 구성 요소와 OpenAI Assistants API 간의 중간 미들웨어입니다.