/SWING

AI 기반 이미지를 활용해 게임으로 영어를 공부하는 서비스

Primary LanguageJavaScript

SWING - Study With Image N Game!

🚀 SWING은 즐겁게 영어 공부하고 싶은 당신을 위해 탄생했습니다.
AI와 함께 세가지 이미지 게임으로 놀면서 영어를 공부할 수 있다니 참 재밌을 것 같지 않나요?
단어, 작문을 활용한 게임으로 영어 공부에 몰입하고, 혼자 하는 공부가 지겨울 땐 친구들과의 그림 대결도 즐겨보세요!

서비스 페이지: SWING


서비스 소개 영상: SWING UCC


프로젝트 기간

SSAFY 2학기 특화PJT(2023.02.20 ~ 2023.04.07)


서비스 개요

  • SWING은 AI가 접목된 3가지 게임을 통해 영어와 친하지 않은 사람들도 재미있게 영어 공부를 할 수 있는 서비스입니다.

주요 기능

게임1: Sentency

Sentency

  • 게임 진행 순서
    1. 게임이 시작되면 한 장의 이미지와 해당 이미지를 설명하는 한글 문장이 유저에게 주어집니다.
    2. 유저는 주어진 이미지와 문장을 참고하여 이미지를 설명하는 영어 문장을 작성합니다.
    3. 유저가 입력한 문장과 정답 문장의 유사도가 90% 이상일 경우 정답 처리됩니다.
    4. 5번 연속으로 틀릴 경우 게임이 종료됩니다.
  • 게임 특징
    1. 유사도 기반 정답 처리로 유저가 완벽한 문장을 만들지 못하더라도 게임을 계속 진행할 수 있도록 하여 흥미를 이어갈 수 있도록 고안했습니다.
    2. 틀리더라도 일부 단어가 정답 문장의 단어와 위치까지 일치할 경우 해당 단어는 유저에게 공개됩니다.
  • 사용된 AI 기술
    1. 이미지 캡셔닝(Image Captioning): CLIP과 GPT를 활용하여 300장의 이미지에 대한 캡션을 만들어 게임에 활용했습니다.
    2. 문장 유사도: Sentence BERT pretrained 모델로 문장의 임베딩 벡터를 구하고 이를 코사인 유사도로 검사했습니다.

게임2: Hi-Five

Hi-Five

  • 게임 진행 순서
    1. 게임이 시작되면 5장의 물체 이미지가 겹쳐진 상태로 유저에게 주어집니다.
    2. 유저는 이미지들이 어떤 물체인지 영어로 맞힙니다.
    3. 5개의 물체를 모두 맞히면 게임이 종료됩니다.
  • 게임 특징
    1. 동의어(ex. cell phone, handy)를 고려하여 유사도가 85% 이상인 경우 정답으로 처리합니다.
    2. 유저가 입력한 단어와 유사도가 40% 이상 85% 미만인 물체 이미지가 있으면 해당 이미지를 좌우로 흔들어 힌트를 줍니다.
  • 사용된 AI 기술
    1. 단어 유사도: Sentence BERT pretrained 모델로 단어의 임베딩 벡터를 구하고 이를 코사인 유사도로 검사했습니다.

게임3: Speedoodle

Speedoodle

  • 게임 진행 순서
    1. 2명 이상 6명 이하 유저들이 게임방에 모여 게임을 시작합니다.
    2. 게임이 시작되면 모든 유저들에게 동일한 키워드가 주어지고, 유저들은 키워드를 그림으로 표현합니다.
    3. AI가 그림을 해당 키워드로 인식한 순서대로 순위가 매겨집니다.
    4. 5라운드로 진행되며, 각 라운드의 통과 시간을 종합하여 최종 순위가 매겨집니다.
  • 게임 특징
    1. Easy, Hard 중 하나를 택하여 게임을 진행합니다. Easy 모드는 키워드가 바로 주어지고, Hard 모드는 키워드에 대한 영어 설명이 주어집니다.
    2. 게임 히스토리(등수, 그림)를 히스토리 페이지에서 확인할 수 있습니다.
  • 사용된 AI 기술
    1. 이미지 분류: keras 라이브러리의 MobileNetV2Quick Draw Dataset 이미지를 학습시켜 분류 모델을 만들었습니다.

오답 노트

Review Note

  • 오답 노트에는 Sentency 게임에서 틀린 문장, Hi-Five에서 틀린 단어가 자동으로 등록되어 있습니다.
  • 각 문장과 단어의 한글, 영어 설명을 확인할 수 있습니다.
  • 오답 문장과 단어로 복습 테스트를 진행할 수 있습니다. 또한 테스트를 통과하면 Sentency 게임에 한 번 더 참여할 수 있는 쿠폰이 주어집니다.

히스토리

  • Speedoodle 게임 히스토리를 확인할 수 있습니다.
  • 게임 등수와 라운드마다 유저와 유저 친구들이 그린 그림들을 볼 수 있습니다.

기타 기능

  • 회원가입/로그인: 카카오톡 소셜 로그인
  • 프로필 수정: 닉네임, 프로필 사진
  • 회원정보 수정: 회원 탈퇴

Architecture

Architecture


기술 스택

  • 협업, 버전관리: imgimg
  • 언어: imgimgimg
  • FE/BE framework:
  • DB:
  • 배포: img
  • CI/CD:
  • 디자인:

프로젝트 산출물


팀원 소개

팀원소개