DS SOFT / Portfolio
← 홈으로
에듀테크 · AI · 게이미피케이션

RoSpeak
Roblox 기반 AI 외국어 학습 앱

청소년(초·중등)을 위한 Roblox 게임 기반 외국어 학습 앱. 음성인식과 AI 코칭으로 영어·일본어·중국어·한국어를 게임처럼 학습할 수 있는 에듀테크 서비스. 보호자 연동 기능을 통해 학습 모니터링과 보상 설정이 가능한 가족 참여형 교육 플랫폼입니다.

React SPA Firebase Gemini AI Android 앱 음성인식
서비스 바로가기 ↗ 다른 프로젝트 보기

📋 프로젝트 개요

서비스 카테고리
에듀테크 / AI / 게이미피케이션
메인 타깃
청소년 (초·중등), Roblox 유저
학습 언어
영어, 일본어, 중국어, 한국어
개발 범위
풀스택 개발 (화면 설계 ~ 앱 배포)
지원 환경
반응형 웹 (모바일 퍼스트) + Android (Capacitor, Google Play)

🔧 작업 범위

화면 설계 및 UI/UX

다크 테마, 글래스모피즘 기반 디자인

Front-end 개발

React SPA

서버 구축

Firebase 인프라 — 인증, Firestore DB, Cloud Functions, 호스팅

AI 서비스 연동

Google Gemini API 발음 코칭

광고 시스템

AdMob 리워드 광고 구축

앱 빌드 및 배포

Capacitor 기반 Android 네이티브 앱, Google Play 배포

⚡ 주요 기능

핵심 학습 시스템

게이미피케이션

보호자 연동

오프라인 지원

📱 주요 페이지

역할 선택 — 학생/보호자
메인 홈 — 시나리오 카드 그리드, 일일 진행
시나리오 연습 — 3단계 씬, 음성인식, AI 피드백
퀴즈 리뷰 — 빈칸 채우기, 번역 문제
학습 완료 — 보상 화면
학습 통계 — XP, 레벨, 스트릭
래플/보상 — 래플 티켓, 추첨 이력
보호자 대시보드 — 자녀 학습 현황, 목표 보상

🎯 주안점

게이미피케이션 설계

하트·XP·스트릭·래플 등 다층 보상 구조로 학습 지속률 극대화

AI 기반 학습 경험

Gemini API를 활용한 개인 맞춤형 발음 피드백으로 능동적 학습 유도

가족 참여형 구조

보호자가 실시간 학습 모니터링하고, 스트릭 목표 달성 시 Robux 보상 설정 가능

오프라인 우선 설계

localStorage와 Firestore 오프라인 캐시 이중 활용으로 네트워크 불안정 환경 대응

API 키 보안

Gemini API 키를 Cloud Functions 서버사이드에서만 관리하여 클라이언트 노출 방지

다국어 콘텐츠 구조화

시나리오·발음·키워드·팁을 언어별로 구조화하여 4개 언어 확장에 유연 대응

🛠 기술 스택

Front-end

React JavaScript CSS (Glassmorphism) Capacitor

Back-end / Infra

Firebase Auth Firestore Cloud Functions Firebase Hosting

AI / API

Google Gemini API Web Speech API

광고 / 배포

AdMob Google Play