🔮 AI와 타로라,, 이 조합,, 깔끼할지도,,?

2023 Winter Techeer SW Bootcamp(2023.12.26 ~ 2024.02.03)에서 6주간 진행한 프로젝트 'TAIROT - AI 타로 심리 상담 서비스'를 소개하는 글입니다.

🙌 TAIROT을 소개합니다

TAIROT은 AI와 TAROT을 결합한 합성어로, ChatGPT를 활용해 사용자 고민 기반의 타로 카드 해석을 제공하고 긍정적인 조언을 제시하는 AI 타로 심리 상담 서비스입니다.

타로는 먼 과거부터 현재까지 꾸준히 인기가 많은 점성술 중 하나로, 미래에 대한 불확실성이나 다양한 고민으로부터 좋은 해답을 찾기 원하는 사람들에게 여전히 많은 수요를 보이고 있습니다.

그러나 타로 상담을 받기 위해서는 직접 가게에 방문해야 하는 다소 수고로운 방법이나, 타로 유튜브 영상을 통해 제한적인 상황에서 진행하는 방법 등이 있습니다.

우리는 이러한 번거로움을 극복하여 사용자의 접근성과 편리성을 높이고, AI 타로 마스터와 비대면으로 상담을 진행함으로써 사용자가 부담감을 덜고 보다 솔직하게 고민을 나눌 수 있기를 기대하며 이번 TAIROT 프로젝트를 기획하고 진행하게 되었습니다.

💁‍♀️ 기능 설명

랜딩, 로그인, 회원가입

상담 결과를 저장하고 확인할 수 있는 마이페이지 기능을 위해 로그인 기능을 구현했습니다.

운세 선택

TAIROT은 '오늘의 운세, 연애운, 우정운, 재물운, 소망운' 총 5개의 운세 카테고리를 제공합니다. 각각의 운세 별로 상담을 진행해 줄 타로 마스터가 존재합니다.

타로 가이드라인 제공, 고민 작성

운세를 선택하고 나면 타로 마스터가 '타로 상담 주의사항 및 진행 방법'을 설명해줍니다. 타로 마스터의 설명을 잘 읽고 난 후 고민을 작성합니다.

카드 선택, 해석 결과

운세별로 선택 가능한 카드의 개수를 다르게 설정했습니다. 오늘의 운세는 1장, 연애운과 우정운은 5장, 재물운과 소망운은 3장의 카드를 선택할 수 있습니다. 카드를 모두 선택하고 나면 자동으로 다음 페이지로 넘어가고 사용자 고민에 기반한 카드별 해석 및 종합 해석을 제공합니다.

ChatGPT를 사용하여 해석을 제공하는 과정에서, 사용자에게 타로 마스터와 실시간으로 대화하는 듯한 경험을 제공하여 사용자가 더욱 몰입할 수 있는 환경을 조성하고 싶었습니다.

따라서 OpenAI에서 제공하는 스트리밍 옵션과 소켓 통신을 이용하여 실시간으로 한 글자씩 텍스트를 출력했고, TTS(Text To Speech)를 버퍼에 한 문장씩 임시 저장 후 소켓 통신으로 프론트단에 전달하여 텍스트가 출력되는 동시에 음성도 출력되도록 구현했습니다.

결과 공유

내가 뽑은 카드와 종합 결과를 바탕으로 나만의 결과 카드가 생성되고 마이페이지에 자동으로 저장됩니다. '링크 공유하기' 버튼을 통해 결과 상세 페이지 링크를 카카오톡으로 공유할 수 있습니다.

마이페이지 리스트, 결과 조회

마이페이지 리스트에서 나의 타로 상담 내역을 확인할 수 있습니다. 목록의 카드 이미지를 클릭하고 결과 상세 페이지를 통해 당시 나의 고민, 내가 뽑은 카드, 카드별 해석, 종합 결과를 확인할 수 있습니다.

DEMO (Sound ON!)

⚙️ 시스템 아키텍처

Infra는 AWS 서비스를 기반으로 구축했고, 클라우드 컴퓨팅 서비스인 EC2를 통해 호스팅을 진행했습니다.

CI/CD는 GitHub 웹훅과 Jenkins를 활용해 구성했습니다. Jenkins를 통한 지속적인 배포와 Docker Compose를 활용한 여러 컨테이너의 효율적 관리를 통해 서비스 배포와 네트워크 설정의 간소화는 물론 로컬과 프로덕션 환경의 일관성을 유지했습니다.

Frontend는 HMR(Hot Module Replacement)을 이용하여 컴포넌트의 변경 사항을 실시간으로 반영하는 Vite와 컴포넌트 기반으로 코드 재사용성을 높이는 React를 사용했습니다.

Backend는 개발의 자유도와 접근성이 높은 Node.js를 사용했습니다. 사용자가 뽑은 타로 카드에 대한 해석을 GPT에 요청하고, 그에 대한 답변을 실시간으로 받고 전달하는 과정에서 Socket.IO를 사용했습니다.

Web Server는 NGINX를 사용했습니다. Node.js 애플리케이션의 프록시 서버로 기능하며 웹 트래픽을 효율적으로 관리하고, SSL/TLS 암호화를 통해 보안을 강화했습니다.

Metric Monitoring은 Grafana, Prometheus, 그리고 cAdvisor를 조합하여 시스템을 구축했습니다. 서버의 이상 징후를 실시간으로 감지하고 Slack과 연동한 실시간 알림을 통해 에러 대응 처리 속도를 크게 향상시켰습니다.

Log Monitoring은 ELK Stack(ElasticSearch, Logstash, Kibana + Filebeat)을 사용했습니다. 로그를 효과적으로 수집, 처리 및 분석하여 문제 발생 시 신속한 진단 및 근본 원인 분석을 가능하게 했습니다. 메트릭 모니터링과 더불어 시스템 성능 모니터링을 강화하고, 전반적인 시스템 관리와 운영의 효율성을 높였습니다.

💌 회고

2023 테커 동계 실리콘밸리 소프트웨어 부트캠프(2023.12.26 - 2024.2.3)에 참여해 6주 동안 팀원들과 하루에 약 5시간씩 숙면하며 End-to-end 프로젝트 개발 과정에 몰입했고, 그 결과 최종 발표회에서 전체 14팀 중 공동 2위라는 유종의 미를 거둘 수 있었습니다.

부트캠프에 지원하기 전, 백엔드 개발자로 취업 준비를 하며 실무 경험이 매우 부족하다는 것을 깨닫고 잠깐 갈피를 잡지 못하던 시기가 있었습니다. 그러던 차에 이 부트캠프를 알게 되었고 간절함과 절실함이 컸던 만큼 최선을 다해 과정에 녹아들 수 있었습니다.

그동안 단순히 CRUD API 구현만 경험해봤다면, 이번 부트캠프를 통해서는 인프라를 어떻게 구축하고, 자동 배포 과정을 어떻게 구성하며, 웹 서버에 보안을 어떻게 적용하는지 등을 직, 간접적으로 보고 배울 수 있었습니다. 그리고 이를 적용하는 과정에서 새롭게 배우고 알게 된 내용을 팀원들과 공유하는 시간을 가지며, 검색해서 찾은 내용을 코드에 바로 적용하는 것에 급급하던 저를 누군가에게 설명하기 위해 공식 문서를 참조하고 더 많은 자료를 찾아본 뒤 문서화하여 말할 수 있는 능력을 기르게 해주었습니다.

한 프로젝트를 기획하고 개발하여 배포하는 전 과정을 경험하며 전체적인 개발 프로세스를 알게 되었고 그동안 막연히 부족하다고 생각해왔던 점들을 명확히 직시하게 되었습니다. 이를테면 서버 관련 개념 및 연동 방법이나 데이터를 더 효율적으로 관리하기 위한 스키마 설계 방법 등에 대한 지식과 경험이 많이 부족하다는 것을 깨달았습니다. 이러한 깨달음은 저로 하여금 새로운 성장 동력을 얻게 했고 제가 걷고자 하는 길에 확신을 갖게 해주었습니다.

Team F! 6주 동안 너무 고생 많았고 좋은 사람들과 재밌고 치열하게 프로젝트 할 수 있어서 너무 뜻깊고 감사했습니다!! 우리 좀만 더 행복하고,,ㅎㅎ 다시 또 힘차게 달려보아요~!~! 히히💛

👨‍👩‍👧‍👦 Visit Our Service

Website   https://tairot.online (서비스 운영 중지)
GitHub   https://github.com/2023-winter-techeer-sw-bootcamp-TeamF
Medium   https://medium.com/@jswing5267/development-of-tarot-psychological-counseling-site-using-gpt