Skip to content
@2024-Winter-Bootcamp-team-K

2024-Winter-Bootcamp-team-K

README.md

🕵️ AILIBI 🕵️

AI-based detective simulation game


대표 이미지

AI+ALIBI(현장 부재 증명)= AILIBI


⚠️ 주의 사항 ⚠️
이 프로젝트에서는 인공지능이 무작위로 생성한 추리 게임용 시나리오, 용의자, 증거, 영상, 이미지가 사용됩니다. 이 시나리오는 현실 사건과 전혀 연관이 없으며, 생성된 시나리오, 용의자, 증거, 영상, 이미지와 현실 사건의 연관성 혹은 유사성은 오로지 우연에 의한 것임을 밝힙니다.



📖 Table of contents


📣 Introduction

URL

🗝️ AILIBI

Medium

🔎 AILIBI Medium  


  • AI 기반 1인용 탐정 시뮬레이션
  • AI + ALIBl(형사 사건이 발생한 시간에 용의자가 그 범죄 현장에 있지 않았다는 증명)=AILIBI
  • 사용자가 사건 종류,장소,시간을 입력하면 AI(GPT-4)가 매번 새로운 시나리오,용의자,증거를 생성
  • 사용자는 시나리오의 탐정이 되어 용의자를 심문하고 증거를 탐색
  • 진범을 찾아내면 승리
  • 플레이 기록들 열람 가능

🕺🏻 Demo

Innit Animation

AILIBI에 접속하면 가장 먼저 보이는 화면입니다.


Onboarding

Login/Register

E-mail 기반 로그인 및 회원가입으로 손쉽게 로그인 할 수 있습니다.


Login & Sign up

Main

성공적인 로그인 이후 게임 플레이를 위한 메인 페이지로 이동합니다.


Login & Sign up

Make-Scenario

사용자가 탐정 스토리의 주요 배경과 사건을 설정하는 페이지입니다.
사건의 종류, 시간, 장소를 선택할 수 있습니다.


Login & Sign up

Loading

사용자 입력을 기반으로 AI의 시나리오 생성을 기다리는 페이지입니다.
평균적으로 약 1분 내외의 시간이 소요되며, 기다림을 달래 줄 2개의 미니게임(슈팅 게임, 스도쿠)이 준비되어 있습니다.




Initial-Statement

용의자들의 초기 진술을 확인할 수 있는 페이지입니다.




Scenario & Evidence

생성된 시나리오와 증거를 탐색할 수 있는 페이지 입니다.
추리 노트를 사용하여, 사용자만의 추리 내용을 작성할 수 있습니다.






Suspect

용의자 목록을 확인할 수 있는 페이지입니다.




Interrogation

AI와 Websocket을 기반으로 용의자를 심문하는 페이지입니다.
STT와 TTS로 보다 몰입도 높은 플레이를 진행할 수 있습니다.




Choose

앞서 추리한 내용을 기반으로 범인을 지목하는 페이지 입니다.
사용자의 선택에 따라 문장이 달라집니다.
성공 — You got it right!
실패 — Are you serious?




Ending-Credit

사건이 종료된 이후의 페이지로, 플레이 결과와 크레딧 화면을 볼 수 있습니다.




History

사용자가 플레이 했던 내역들을 자세하게 확인할 수 있습니다.





📗 API

API 이미지



🛠 ️System Architecture



🔑 ERD



💻 Tech Stack

Field Technology of Use
Frontend
Backend
Database
AI
DevOps
Monitoring
ETC


📊 Monitoring

Prometheus & Grafana

Django
Django Django2
Celery
Celery Celery2
cAdvisor
cAdvisor cAdvisor2
Node_Exporter
Node Exporter2
RabbitMQ
Node Exporter2
Nginx_Exporter Redis


Cloud Flare

Frontend
Node Exporter2

🔧 Logging

Loki

Nginx
Django Django2

📂 Directory Structure

AILIBI-Backend 

🗂️AILIBI-Backend
┣ 📂.github
┃ ┣ 📂ISSUE_TEMPLATE
┃ ┗ 📂workflows
┣ 📂Backend
┃ ┣ 📃__init__.py
┃ ┣ 📃asgi.py
┃ ┣ 📃celery.py
┃ ┣ 📃settings.py
┃ ┣ 📃urls.py
┃ ┗ 📃wsgi.py
┣ 📂alertmanager
┃ ┗ 📃alertmanager.yml
┣ 📂chat
┃ ┣ 📂migrations
┃ ┣ 📂templates
┃ ┣ 📃Serializers.py
┃ ┣ 📃__init__.py
┃ ┣ 📃apps.py
┃ ┣ 📃consumers.py
┃ ┣ 📃models.py
┃ ┣ 📃routing.py
┃ ┣ 📃urls.py
┃ ┗ 📃views.py
┣ 📂evidence
┃ ┣ 📂migrations
┃ ┣ 📃__init__.py
┃ ┣ 📃apps.py
┃ ┣ 📃models.py
┃ ┣ 📃serializers.py
┃ ┣ 📃urls.py
┃ ┗ 📃views.py
┣ 📂grafana/data
┃ ┣ 📂alerting/1
┃ ┗ 📃grafana.db
┣ 📂health
┃ ┣ 📃urls.py
┃ ┗ 📃views.py
┣ 📂llm
┃ ┣ 📂migrations
┃ ┣ 📃__init__.py
┃ ┣ 📃apps.py
┃ ┣ 📃urls.py
┃ ┗ 📃views.py
┣ 📂prometheus
┃ ┣ 📃alert-rules.yml
┃ ┗ 📃prometheus.yml
┣ 📂promtail
┃ ┗ 📃config.yaml
┣ 📂scenario
┃ ┣ 📂migrations
┃ ┣ 📃__init__.py
┃ ┣ 📃apps.py
┃ ┣ 📃models.py
┃ ┣ 📃scenario_urls.py
┃ ┣ 📃serializers.py
┃ ┣ 📃urls.py
┃ ┗ 📃views.py
┣ 📂staticfiles
┃ ┣ 📂admin
┃ ┣ 📂drf-yasg
┃ ┗ 📂rest_framework
┣ 📂stt
┃ ┣ 📂migrations
┃ ┣ 📃__init__.py
┃ ┣ 📃apps.py
┃ ┣ 📃urls.py
┃ ┗ 📃views.py
┣ 📂suspect
┃ ┣ 📂migrations
┃ ┣ 📃__init__.py
┃ ┣ 📃apps.py
┃ ┣ 📃models.py
┃ ┣ 📃serializers.py
┃ ┣ 📃suspect_urls.py
┃ ┣ 📃urls.py
┃ ┗ 📃views.py
┣ 📂tts
┃ ┣ 📂migrations
┃ ┣ 📃__init__.py
┃ ┣ 📃apps.py
┃ ┣ 📃tasks.py
┃ ┣ 📃urls.py
┃ ┗ 📃views.py
┣ 📂user
┃ ┣ 📂migrations
┃ ┣ 📃__init__.py
┃ ┣ 📃admin.py
┃ ┣ 📃apps.py
┃ ┣ 📃models.py
┃ ┣ 📃serializers.py
┃ ┣ 📃tests.py
┃ ┣ 📃urls.py
┃ ┣ 📃users_urls.py
┃ ┗ 📃views.py
┣ 📃.gitattributes
┣ 📃.gitignore
┣ 📃Dockerfile
┣ 📃README.md
┣ 📃README.md
┣ 📃docker-compose-blue.yml
┣ 📃docker-compose-common.yml
┣ 📃docker-compose-green.yml
┣ 📃grafana.ini
┣ 📃manage.py
┣ 📃nginx.conf
┣ 📃requirements.txt
┗ 📃start_celery_flower.sh
AILIBI-Frontend 

🗂️AILIBI-Frontend
┣ 📂.github
┃ ┣ 📂ISSUE_TEMPLATE
┃ ┗ 📂workflows
┣ 📂public
┃ ┣ 📂fonts
┃ ┣ 📂images
┃ ┣ 📂mp4
┃ ┣ 📂sounds
┃ ┣ 📃logo.png
┃ ┗ 📃vite.svg
┣ 📂src
┃ ┣ 📂assets
┃ ┃ ┗ 📃react.svg
┃ ┣ 📂components
┃ ┃ ┣ 📃EndingPage.css
┃ ┃ ┣ 📃LogInPage.css
┃ ┃ ┣ 📃SignupBox.css
┃ ┃ ┗ 📃VideoPage.css
┃ ┣ 📂hooks
┃ ┃ ┣ 📃UserContext.tsx
┃ ┃ ┗ 📃axiosInstance.ts
┃ ┣ 📂mocks
┃ ┃ ┗ 📃webSocketService.ts
┃ ┣ 📂pages
┃ ┃ ┣ 📃ChattingPage.tsx
┃ ┃ ┣ 📃ChoosePage.tsx
┃ ┃ ┣ 📃EndingPage.tsx
┃ ┃ ┣ 📃EvidencePage.tsx
┃ ┃ ┣ 📃GamePage1.tsx
┃ ┃ ┣ 📃HistoryNote.tsx
┃ ┃ ┣ 📃HistoryPopUp.tsx
┃ ┃ ┣ 📃InitChatPage.tsx
┃ ┃ ┣ 📃LeftPage.tsx
┃ ┃ ┣ 📃LoadingScenarioPage.tsx
┃ ┃ ┣ 📃LogInPage.tsx
┃ ┃ ┣ 📃LoginBox.tsx
┃ ┃ ┣ 📃MainAudioContext.tsx
┃ ┃ ┣ 📃MainPage.tsx
┃ ┃ ┣ 📃MakeScenarioPage.tsx
┃ ┃ ┣ 📃NotePage.tsx
┃ ┃ ┣ 📃PlayAudioContext.tsx
┃ ┃ ┣ 📃PlayHistoryPage.tsx
┃ ┃ ┣ 📃PlayPage.tsx
┃ ┃ ┣ 📃ResultLoadingPage.tsx
┃ ┃ ┣ 📃RightPage.tsx
┃ ┃ ┣ 📃SignupBox.tsx
┃ ┃ ┣ 📃SudokuGame.tsx
┃ ┃ ┣ 📃SuspectPage.tsx
┃ ┃ ┣ 📃TTSService.tsx
┃ ┃ ┗ 📃vite-env.d.ts
┃ ┣ 📂services
┃ ┃ ┗ 📃vite-env.d.ts
┃ ┣ 📃App.css
┃ ┣ 📃App.tsx
┃ ┣ 📃index.css
┃ ┣ 📃main.tsx
┃ ┗ 📃vite-env.d.ts
┣ 📃.gitignore
┣ 📃Dockerfile
┣ 📃README.md
┣ 📃docker-compose.yml
┣ 📃eslint.config.js
┣ 📃index.html
┣ 📃package-lock.json
┣ 📃package.json
┣ 📃postcss.config.cjs
┣ 📃tailwind.config.js
┣ 📃tsconfig.app.json
┣ 📃tsconfig.json
┣ 📃tsconfig.node.json
┗ 📃vite.config.ts

🧐 How To Start

Backend

git clone --recursive https://github.com/2024-Winter-Bootcamp-team-K/AILIBI-Backend.git

env setting in the Backend folder

  • Backend/.env
DB_ENGINE=
DB_NAME=
DB_USER=
DB_PASSWORD=
DB_HOST=
DB_PORT=

OPENAI_API_KEY=

NAVER_CLIENT_ID=
NAVER_CLIENT_SECRET=

ELEVENLABS_API_KEY=
ELEVENLABS_MODEL_ID=
TASK_1_VOICE_ID=
TASK_2_VOICE_ID=
TASK_3_VOICE_ID=

Run Docker

docker-compose -f docker-compose-common.yml -f docker-compose-blue.yml build
docker-compose -f docker-compose-common.yml -f docker-compose-blue.yml up -d
docker-compose -f docker-compose-common.yml -f docker-compose-blue.yml down

docker-compose -f docker-compose-common.yml -f docker-compose-green.yml build
docker-compose -f docker-compose-common.yml -f docker-compose-green.yml up -d
docker-compose -f docker-compose-common.yml -f docker-compose-green.yml down

Frontend

git clone --recursive https://github.com/2024-Winter-Bootcamp-team-K/AILIBI-Frontend.git

Install

npm run dev

👨‍👩‍👧‍👦 Team Members

Name 박근채 여상윤 박수용 김승민 이수연 박명남
Profile
Role Leader
Full Stack
DevOps
Design
 Backend
DevOps
 Backend
DevOps
 Frontend
Design
 Frontend
Design
 Frontend
Design
GitHub




Popular repositories Loading

  1. AILIBI-Backend AILIBI-Backend Public

    AILIBI project's Backend Repository

    Python

  2. AILIBI-Frontend AILIBI-Frontend Public

    AILIBI project's Frontend Repository

    TypeScript

  3. .github .github Public

Repositories

Showing 3 of 3 repositories
  • .github Public
    2024-Winter-Bootcamp-team-K/.github’s past year of commit activity
    0 0 0 0 Updated Jan 31, 2025
  • AILIBI-Frontend Public

    AILIBI project's Frontend Repository

    2024-Winter-Bootcamp-team-K/AILIBI-Frontend’s past year of commit activity
    TypeScript 0 0 0 0 Updated Jan 31, 2025
  • AILIBI-Backend Public

    AILIBI project's Backend Repository

    2024-Winter-Bootcamp-team-K/AILIBI-Backend’s past year of commit activity
    Python 0 0 0 0 Updated Jan 30, 2025

People

This organization has no public members. You must be a member to see who’s a part of this organization.

Top languages

Loading…

Most used topics

Loading…