Skip to content

kimys5278/4dLand_PocAPP

Repository files navigation

4D Block POC APP

2024 IMSCC 국제 수리 창의력 대회 - 우수상(2위)

image image

포디블록을 활용한 교육 자료용 어플리케이션입니다.
블록쌓기와 블록 구성놀이로 구성된 AI 모델을 활용한 어플리케이션 개발이 주된 목표입니다.
블록 쌓기는 정해진 조합을 판단하여 어린이들이 4D블록으로 만든 모양을 만들고, AI 모델은 그 모양에 10개 조합중 어떤 조합으로 만들어 졌는지 판단하여 결과를 제시합니다.
기본,계단,모아,틀어,지그재그,세워,교차,돌려,기댐,비스듬 10가지 조합이 있습니다.
4D블록으로 구조를 만든 후, POC앱으로 사진을 찍으면 어떤 조합이 쓰여졌는지, 몇 개의 조합인지 AI 모델 분석을 통하여 결과를 제공합니다. 실제 4D 블록은 전국 각 초등학교와 교육센터에서 사용중입니다. (주) 포디랜드 인턴을 하면서 제작한 포디랜드 본사의 포디 블록을 활용한 교육 자료용 POC 테스트 앱 입니다. 포디랜드에서 전국 초등학교,고등학교에서 시행하는 포디블록을 사용한 블록 쌓기 교육과 구성놀이 교육을 디지털화 시키는 프로젝트 입니다. 대면으로 진행하는 교육 시스템을 디지털화 시켜 학생들이 개인적으로 창의력 학습을 진행시키고, 수리 능력을 키우는 데에 목표를 하고 있습니다. 블록 쌓기와 구성놀이가 메인 기능이며 블록 쌓기는 정해진 조합을 판단하여 어린이들이 4D블록으로 만든 모양을 만들고, AI 모델은 그 모양에 10개 조합 중 어떤 조합으로 만들어 졌는지 판단하여 결과를 제시합니다. 구성놀이는 제시한 사물을 격자판에 학생들이 배치하면 이미지로 변환하여 제공합니다. 실제 포디 랜드에서 출시 하기 전 AI모델과 백엔드 서버가 잘 연결되어 작동하는지에 대한 테스트 앱 입니다.


주요기능

  • 블록 쌓기 와 구성놀이 기능에 대한 설명서를 제공하여 학생들이 기능을 사용하기 전 블록 쌓기 조합과 구성 놀이 방법을 습득할 수 있습니다.
  • Yolov8로 학습된 블록 쌓기 모델을 바탕으로 서비스 내에서 조합 별 갯수나 사물을 제시합니다.
  • 블록 쌓기가 완성되면 사진을 찍어 업로드 하면 조합 별 갯수와 정확도를 사용자에게 반환합니다.
  • 구성놀이 기능은 서비스 내에서 제시한 사물을 바탕으로 격자판에 블록을 배치하면 이미지처리 서버에서 격자판의 블록을 이미지로 변환하여 제공합니다.
  • 모든 결과는 데이터베이스에 저장됩니다.
  • 사용자마다 자신이 사용한 기능들의 결과를 날짜 별로 확인할 수 있습니다.

담당역할

메뉴얼제작

  • 포디랜드 내 개발팀이 없어 비전공자들도 이해하기 쉽게 개발 과정 및 aws ec2에 대한 간략한 메뉴얼 작성
  • 포디랜드 RDS 데이터베이스 인스턴스 구축한 과정 메뉴얼로 작성
  • 포디랜드 회사 내 컴퓨터에 Heidisql을 다운로드하고, 데이터베이스 접속 및 데이터 베이스 관리 방법 메뉴얼 제작

백엔드

  • 회원 가입 및 로그인
    • SpringSecurity, JWT를 활용한 회원가입 로그인,카카오로그인 개발
    • RefreshToken을 이용하여 사용자 인증 세션을 지속적으로 유지하고, 토큰 만료 시 자동 갱신을 통해 보안을 강화
    • 로그인 한 사용자는 JWT토큰을 헤더로 전송하여 로그인 유무 반환
  • 블록 쌓기 AI, 구성놀이 이미지 처리 모델 Fast API로 서빙 후 WebClient를 이용하여 스프링부트와 연결
  • JPA와 Query DSL를 활용하여 결과 페이지 조회 기능 구현

AI

  • Yolov8를 활용한 이미지 데이터 학습
    • 블록 조합 이미지를 RoboFlow를 통해 라벨링 작업
    • AI 모델 정확도를 평균 70~85%
    • 클라이언트 반환을 위하여 학습 모델 FastAPI로 서빙
  • AI 결과 반환 API
    • FastAPI에서 AI 인식 결과를 Spring Boot Wec Client를 통해 서버로 전송하고, 최종 결과를 클라이언트에 반환
    • AI 모델 결과 정확도를 문자열로 변환하여 결과 반환.
  • FastAPI로 서빙하여 스프링부트와 연결

배포

  • AI서버와 스프링부트 서버는 Docker컨테이너로 격리되어 운영됩니다.
  • AWS EC2에 도커 컨테이너를 올려 서버를 배포 하였습니다.

느낀점

  • 두 가지 메인 기능 테스트 앱이라 CI/CD 파이프라인 구축을 하지 않고, 진행한 점이 아쉬웠습니다.
  • AI서버와 스프링부트 서버를 연결하는 작업을 처음하여 여러 가지 방법론을 생각하며 진행하였습니다.
  • 회사 입장에서 생각하며 진행한 프로젝트여서 많은 것을 배웠습니다.

예시

image

플로우 차트 생성

image

  1. 클라이언트에서 스프링부트로 이미지를 업로드합니다.
  2. 스프링부트에서 업로드된 이미지(AI 모델 적용 전) S3 Before 폴더에 저장합니다.
  3. 스프링부트에서 이미지를 FastAPI로 넘겨줍니다.
  4. FastAPI는 이미지를 받은 후, 학습된 Yolov8 모델을 이미지에 적용합니다.
  5. 적용한 이미지는 s3 After 폴더에 저장합니다.
  6. FastAPI에서 AI모델을 적용한 이미지와 이미지에 대한 결과 데이터를 스프링부트로 다시 반환합니다.
  7. 스프링부트는 FastAPI에서 온 데이터를 RDS(MariaDB)에 저장합니다.
  8. 스프링부트는 FastAPI에서 온 데이터를 클라이언트에 반환합니다.

결과

image
image

시연 영상

KakaoTalk_Video_2024-11-08-07-50-34.mp4

About

4dLand기업 POC앱개발

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published