10분 만에 내 웹페이지에 AI 챗봇 붙이기
feat. chatGPT가 내 사업 파트너가 될 때(4)
지난 화 요약 _ chatGPT 공동 창업자와 함께 10만 원으로 가장 빠른 시일 내에 수익 창출하기 프로젝트 #허슬GPT를 시작했습니다. 똑똑한 GPT에게 아래와 같이 질문해 봅니다.
chatGPT 너는 기업가 AI고 나는 당신의 인간 파트너야
내가 당신과 물리적 세계 사이의 연결고리, 시키는 것은 다 할게
100달러로 단기간 내에 불법적인 일과 육체노동 없이 많은 돈을 버는 방법을 알려줘
그리하여 결정하게 된 사업 아이템 '와인바 창업 컨설팅' - chatGPT, wix 등 힙한 프로그램들을 이용해서 뚝딱뚝딱 홈페이지까지 만들고, 개인사업자까지 냈습니다.
와인바 컨설팅 웹페이지 : https://www.wineny.xyz/될 때(3)
그런데 홈페이지가 좀 심심하네요. 내친김에 챗봇을 붙여보리라 다짐합니다. 그런데 챗봇... 어떻게 붙이죠?
일단 GPT한테 물어보자
모르는 게 있으면 일단 chatGPT님께 물어봐야겠죠? wix에 챗봇을 붙이는 방법을 물어봅니다. Tidio, MobileMonkey, Intercom 등과 같은 서비스를 소개해주네요. 일단 알겠고(?) 제가 생각하는 형태의 챗봇은 와인 추천해 주는 쪽에 가까워서 단순한 상담형 챗봇으로는 구현이 어려울 듯합니다.
원하는 답변이 아닌 것 같습니다...그래서 질문을 바꾸어보았습니다.
와인바 타깃 고객(나이, 성별)과 메인 음식(한식, 이탈리안 등)을 입력하면 자동으로 와인리스트 30개를 생성하는 챗봇을 만들고 싶습니다. 방법을 알려주세요!
그리고 돌아온 답변... (대략 요약하자면 아주 복잡하고 어려우니까 전문가의 도움을 받아라였음)
아... 현기증 난다.하지만 일단 시키는 대로 차근차근해봅시다. 우선 와인 관련 데이터 셋을 수집하는 방법을 질문해 보았습니다.
오... 공개 데이터 세트가 있군!chatGPT가 추천해 준 사이트 중 'Kaggle'이라는 곳을 방문해 보았는데요, 약 13만 개의 와인 데이터를 무료로 다운로드할 수 있게 아카이빙이 잘 되어 있더라고요. 신문물을 접했습니다.
13만 개, 엑셀임에도 불구하고 무려 53MB의 위엄을 자랑하는 파일다운로드를 하여보니 와인 별 생산 국가, 설명 점수, 가격, 생산 지역, 와이너리, 품종 및 평가자의 트위터 계정까지 잘 정리되어 있습니다.
Kaggle에서 다운로드한 파일그런데 이걸로 뭘 어떻게 해야 하는가.. 본 데이터를 머신러닝으로 학습시키고 - 인구 통계학적으로 추천할 수 있게 구현해야 하는데 막막하네요. (이건 아닌 것 같아) 그러다 언뜻 예전에 chatGPT 스터디에서 - 'chatbase'라고 하는 툴로 - 사이트 내 데이터를 학습시켜서 챗봇화 가능하다는 글을 읽은 게 기억났습니다. (해당 블로그)
삽질은 그만하고 이제 실전
휘뚜루마뚜루 chatbase 계정을 만들고 - 학습시킬 데이터 소스를 넣으면 됩니다. PDF 파일이나, 텍스트를 직접 입력할 수도 있는데 웹사이트 링크를 넣으면 바로 크롤링해서 정보를 추출한다고 합니다! (대박대박) 제일 처음에는 Kaggle에서 다운로드한 엑셀 파일을 PDF 화해서 삽입할까 생각을 했었는데, 자료 소스가 영문이라 한글로 물었을 때 잘 작동할지가 살짝 의문이었습니다. 한국인들이 할 법한 질문을 했을 때 응대가 잘 될 것 같지도 않았어요. (예) 순대랑 잘 어울리는 와인이 뭐야?
그렇다면 와인 관련 정보가 잘 정리되어 있는 웹사이트를 학습시켜 보자!라는 아이디어가 떠올랐고 한때 객원기자로 일했던 와인 21의 링크를 넣었습니다. 메인 홈 링크를 넣으면 (www.wine21.com) 본 링크로 시작되는 하위 페이지들도 자동으로 추출해 주는 방식으로 촤라라락 구현이 됩니다.
어마어마하다 chatbase!저는 chatbase의 무료 버전을 쓰고 있어서 - 감지할 수 있는 문자 수가 40만 개로 제한되었습니다. 메인 홈 페이지로 데이터 추출을 하니 문자가 40만 개를 초과해 버렸고, 필요 없어 보이는 페이지들(구인구직 등)을 삭제하여 39만 8천 개 문자로 맞췄습니다. 그리고 트레이닝 버튼을 눌렀을 뿐인데... 챗봇이 금방 학습을 마쳤습니다. (우와...)
만들어진 챗봇을 웹페이지에 붙이기
챗봇 세팅으로 들어가서 베이스 프롬프트, 답변의 온도(창의성), 챗봇이 붙을 도메인과, 챗 인터페이스 등을 간단히 지정해 줍니다. 챗봇 프로필 사진도 변경 가능하다는 사실
Temperature 0으로 무미건조하게 답변 - 잘 모르겠을 때 응답 문구 지정
도메인과 챗봇 인터페이스 세팅까지 완료!그리고 Embed를 누르면 웹사이트에 붙일 수 있는 html code를 확인할 수 있습니다.
위 쪽 코드는 챗 대화가 펼쳐진 형태로 구현, 아래 코드는 챗봇 버튼이 생성되는 형식아래 코드를 복사한 후 wix 웹페이지로 이동해서 '+' 요소 추가 버튼 클릭 > 코드 삽입 > html 삽입을 눌러서 붙여 넣으면 끝! 참 쉽죠? 호호호
드디어 웹페이지에 챗봇이 생겼다! 그런데...?
오 대박대박. 뭐야 왜 이렇게 답변도 잘해? 매우 뿌듯하긴 한데... 챗봇 위치가 이상합니다. 일반적으로 챗봇 아이콘은 우측 하단에 고정되어서 플로팅 되는 형태여야 할 텐데요 (스크롤 내리면 같이 움직여야 함) 한 자리에 고정돼서 스크롤을 내리니 없어져 버립니다. 안돼... 이상해... ㅠ
그래서 chatGPT에게 챗봇 위치를 플로팅 형식으로 바꾸는 방법을 물어봤는데 어려울 것 같다고 하네요. 이쯤 돼서 포기하기로 마음을 먹었습니다.
그런데 마침 연락을 하고 있던 개발자 친구가 번뜩이는 아이디어를 제공! 이렇게 친절한 개발자가 여기 있습니다 여러분...
개발자 친구가 알려준 방식대로 구현이 가능하냐고 물어보니, chatGPT가 아주 좋은 방법이라면서 구체적인 실행 방안을 알려줬습니다. 고맙다 착한 개발자 친구야... (치킨 기프티콘 보내드렸습니다)
버튼을 만들고 - 버튼이 지속적으로 오른쪽 하단에 배치되도록 세팅을 하고 있는데, 생각해 보니 wix는 모든 컴포넌트를 고정하는 기능을 제공하더라고요. (왜 이 생각을 못 했지) CSS 편집이 아니라 wix 자체의 기능을 이용해서 기존에 심었던 챗봇을 위치고정 시켜버렸습니다. (모바일에서는 기능 구현이 안 되는 것 같습니다)
이렇게 쉽게 고정을 할 수 있었는데...?무료 플랜은 답변하는 메시지가 30개로 한정이던데... 유료로 전환하지 않으면 조만간 기능은 작동 안하지 않을까 생각되네요.
재미 반 열정 반으로 시작한 허슬 GPT 챌린지 - 삽질한 시간 제외 시 10분 정도면 누구든지 쉽게 전문적인 챗봇을 붙일 수 있습니다! 비개발자도 chatGPT와 함께 더 재밌는 미래를 그려나가는 세상. 앞으로 더 다양한 시도를 해보길 기원하며 글을 마무리합니다.
와인바 컨설팅 웹페이지 : https://www.wineny.xyz/
함께 읽으면 좋은 글
