AI Product · Full-Stack Engineer · Portfolio

AI 프로덕트 풀스택 개발자

사용자의 문제를 제품 요구사항으로 정리하고 Next.js/React UI, API·데이터·AI 파이프라인, 결제·분석·배포까지 연결해 실제 운영 가능한 서비스로 완성합니다.

Next.jsReactTypeScriptRAGPostgreSQLDockerGitHub ActionsVercelRailwayAWSGCP Cloud RunCloudflareCloudinary
Republic of Koreaspingferry@gmail.com

01 · Live Product Wall

라이브 제품

AI Character Chat

Chat OZ

서비스 화면 준비 중Chat OZ 카드가 화면에 들어오면 live preview를 연결합니다.
Live · 01

기억·검색·페르소나를 분리해 맥락 손실을 줄인 캐릭터 대화 아키텍처

Report & Consultation

Saju

서비스 화면 준비 중Saju 카드가 화면에 들어오면 live preview를 연결합니다.
Live · 02

다단계 API·결제·RAG 컨텍스트를 하나의 상담형 리포트 흐름으로 묶은 구조

AI Image Studio

Studio

서비스 화면 준비 중Studio 카드가 화면에 들어오면 live preview를 연결합니다.
Live · 03

느린 이미지 생성 작업을 큐·워커·자산 상태로 분리한 제작 파이프라인

Store Info Hub

Store

서비스 화면 준비 중Store 카드가 화면에 들어오면 live preview를 연결합니다.
Live · 04

작은 문제를 좁게 정의하고 정보 구조·동기화·배포까지 빠르게 제품화한 사례

02 · Core Strengths

강점

01
End-to-End Ownership기획부터 배포·운영까지

아이디어를 요구사항으로 정리하고 UI, API, 데이터, AI 연동, 배포까지 이어 붙여 실제 사용 가능한 제품 상태로 마무리합니다.

02
Team Leading팀 리딩

개발 방향과 우선순위를 정리하고, 팀 단위 출시에서 일정·품질·운영 이슈를 함께 조율합니다.

03
Payments인앱 · 구독 · 웹 결제

iOS·Android 인앱 결제, 구독, 웹 결제의 권한·상태·해금 흐름을 제품 UX와 백엔드 상태에 맞춰 설계합니다.

04
Metrics-Driven트래킹 · 지표 기반 개발

GA4, Firebase Analytics, Amplitude, Airbridge, Google Ads를 이벤트 택소노미와 퍼널 판단으로 연결합니다.

05
Ads & Rewards광고 · 보상형 리워드

AdMob 미디에이션, 리워드 광고, 오퍼월, SSV 보상 콜백처럼 수익화와 사용자 보상을 동시에 다루는 흐름을 구현합니다.

06
LLM · RAG · PipelineLLM · RAG · LangChain

LLM 호출을 기능 단위로 끝내지 않고, RAG·메모리·프롬프트·후처리·검증 가능한 콘텐츠 청크로 제품 품질을 관리합니다.

04
Live Services
07
Capability Domains
E2E
End to End
RAG
Context Engineering

03 · Capability Matrix

기술 역량

01 / 07

AI Product & Conversation

LLM 호출에 머무르지 않고 맥락·기억·검색·후처리·검증 데이터를 하나의 제품 흐름으로 설계합니다.

AI SDK · GeminiRAG 파이프라인Upstash Vector · bge-m3LangChain캐릭터 페르소나세션 · 장기 메모리프롬프트 · 생성 후처리
02 / 07

Web Frontend

모바일 퍼스트 웹, 라이브 임베드, 상태 기반 인터랙션, 반응형 UI를 실제 서비스 수준으로 구현합니다.

Next.js App RouterReact 19TypeScriptTailwind CSSFramer MotionPlaywrightlucide-react
03 / 07

Backend & Data

API 계약, 상태 흐름, 인증·권한, 결제 상태, 검색/캐시 저장소를 서비스 기준으로 설계합니다.

Next.js Route HandlersPython · FastAPIPostgreSQLUpstash RedisUpstash VectorREST API 설계인증 · 세션 · 권한인앱 · 구독 · 웹 결제Queue · Worker
04 / 07

Mobile Extension

웹 제품을 앱·WebView·네이티브 기능으로 확장할 때 필요한 브리지와 런타임 제약을 다룹니다.

Flutter · DartReact Native · ExpoKotlin · JavaSwift · iOSJetpack ComposeWebView Bridge · MethodChannelBLE · MQTT
05 / 07

Analytics & Tracking

SDK 설치가 아니라 이벤트 구조 · 퍼널 · 전환 측정을 제품 판단에 연결합니다.

GA4Firebase AnalyticsAmplitudeAirbridgeGoogle AdsAdMob · SSV이벤트 택소노미 · 퍼널
06 / 07

Infrastructure & Delivery

Docker 컨테이너화부터 GitHub Actions CI/CD, 다중 클라우드 배포, CDN · DNS · 캐싱까지 전달 계층을 직접 구성합니다.

Docker 컨테이너화GitHub Actions CI/CDVercel · Railway 배포AWS EC2 · ECS · CloudFront · SNSCloudflare · DNS · CDNGCP Cloud Run
07 / 07

Media Optimization

이미지 품질 · 로딩 속도 · 저장/트래픽 비용의 균형을 설계합니다.

CloudinaryCloudflare CDNNext Image · 커스텀 로더원본 · 파생 · 썸네일캐시 정책

04 · Case Studies

프로젝트

AI Character Chat

Chat OZ

Live 보기

캐릭터 페르소나, 사용자 맥락, 세션 기억, 장기 메모리, RAG 컨텍스트 주입을 분리해 대화 품질을 관리하는 캐릭터챗 제품입니다.

고민
캐릭터 말투, 이전 대화, 사용자 상태가 한 프롬프트에 섞이면 응답 일관성과 재현성이 무너지는 문제를 다뤘습니다.
판단
페르소나·세션 기억·장기 메모리·검색 컨텍스트를 레이어로 나누고, 삽입 순서와 신뢰 경계를 명확히 했습니다.
성과
대화 품질을 감으로 고치는 대신 데이터, 검색, 상태 흐름으로 조정할 수 있는 제품 구조를 만들었습니다.
  • 캐릭터 페르소나와 말투 계약 설계
  • 사용자, 캐릭터, 세션, 장기 기억의 책임 분리
  • 이전 맥락 검색과 응답 컨텍스트 주입
  • 라이브 iframe 임베드와 자산 전달 정책까지 제품 단위로 연결
Next.js App RouterReactTypeScriptRAGMemoryCloudflare CDN

Report & Consultation

Saju

Live 보기

여러 API와 도메인 데이터를 조합하고 RAG 설계로 해석 품질과 응답 일관성을 보강한 사주 리포트/상담 서비스입니다.

고민
상담, 견적, 생성, 결제 해금, 상태 조회, 상세 리포트가 섞이면 사용자가 어디까지 진행했는지 흐려지는 문제가 있었습니다.
판단
quote, create, unlock, status, detail 단계를 명확히 나누고 도메인 API와 RAG 컨텍스트를 상태 흐름에 맞춰 조합했습니다.
성과
상담형 UX와 결제 후 리포트 접근을 한 흐름으로 유지해, 복잡한 비즈니스 상태를 사용자가 이해 가능한 제품 경험으로 정리했습니다.
  • 상담형 UX와 리포트 생성 흐름
  • quote, create, unlock, status, detail 비즈니스 상태
  • 도메인 데이터와 외부/내부 API 조합
  • RAG 설계로 해석 일관성 보강
Next.js App RouterTypeScriptAPI OrchestrationRAGPaymentsReports

AI Image Studio

Studio

Live 보기

AI 이미지 생성, 후처리, 저장, 공개 갤러리까지 이어지는 제작 도구입니다.

고민
이미지 생성은 지연·실패·후처리·썸네일·공개 상태가 얽혀 있어 동기 요청만으로는 안정적인 제작 경험을 만들기 어렵습니다.
판단
요청 응답, 생성 큐, 백그라운드 워커, 원본/후처리본/썸네일 저장, 공개 갤러리 상태를 각각 분리했습니다.
성과
AI 작업의 긴 대기 시간을 제품 UX가 견디게 만들고, 이미지 품질·저장 비용·운영 상태를 함께 관리할 수 있게 했습니다.
  • 이미지 생성 요청과 처리 상태 분리
  • 백그라운드 작업과 워커 기반 확장
  • 원본, 후처리본, 썸네일 자산 관리
  • 공개 갤러리와 콘텐츠 상태 관리
ReactViteTypeScriptQueueWorkerDockerCloud RunCloudinary

Store Info Hub

Store

Live 보기

직접 필요해서 만든 앱/스토어 정보 허브로, 여러 정보를 한눈에 확인하는 간결성과 빠른 탐색에 초점을 맞췄습니다.

고민
필요한 스토어/앱 정보를 빠르게 비교해야 하는 개인 문제를 과한 기능으로 키우지 않는 것이 핵심이었습니다.
판단
정보 구조를 작게 고정하고, Next.js 화면 구성과 동기화 흐름을 가볍게 설계해 탐색 속도를 우선했습니다.
성과
작은 문제를 공개 가능한 제품으로 빠르게 완성하며 기획, 구현, 배포 사이클을 짧게 돌리는 능력을 보여줍니다.
  • 한눈에 보는 정보 구조
  • 가벼운 화면과 빠른 탐색
  • 개인 필요에서 출발한 실용 제품
  • 작은 문제를 빠르게 제품화한 사례
Next.js App RouterReactTypeScriptSyncInformation ArchitectureCloudflare CDN

05 · Career

회사 경력

AI Character · Interactive Story

GLAZE

NationA

AI 캐릭터 대화와 분기형 인터랙티브 스토리(웹툰·노벨 플레이 RPG)를 결합한 UGC 플랫폼.

  • 캐릭터 페르소나 기반 대화
  • 분기형 인터랙티브 스토리
  • 크리에이터 퍼블리싱(UGC)
  • Web · Android · iOS 멀티플랫폼
AI ChatInteractive StoryUGCWeb · Android · iOS

AI Persona Generation

위닛

lumanlab

AI로 ‘부캐’(페르소나)를 생성·관리하는 모바일 앱.

  • AI 기반 부캐(페르소나) 생성
  • 개인화 캐릭터 관리
  • Android · iOS 출시
AI PersonaMobileAndroid · iOS

Infant Development Check

LUCES

lumanlab

영유아의 월령별 발달 수준을 검사하는 아동 발달 평가 앱. (前 ‘엘턴’)

  • 월령별 발달 과제 검사
  • 아이 발달 상태 확인·기록
  • iOS · Android 출시
FlutterChild DevelopmentAndroid · iOS

ABA · Behavior Log

Kaban

lumanlab

아이의 문제 행동을 정의·기록하고 통계로 분석하는 ABA 기록 도우미.

  • 문제 행동 정의·기록
  • 통계 그래프로 행동 패턴 분석
  • 다중 아동·그룹 관리, 수업 노트
행동 기록통계 분석Android · iOS

Baby Care Diary

우리아기 다이어리

lumanlab

아기의 일상과 성장을 기록·관리하는 육아 다이어리 앱.

  • 아기 일상·성장 기록
  • 육아 데이터 관리
  • iOS · Android 출시
육아 기록MobileAndroid · iOS
Experience Archive14 projects
Healthcare내부 APK

마인드배터리

병동 욕창·낙상 케어 안전관리 시스템, MDM 보안 SDK 연동·Dio 기반 API 구조 (Flutter)

FlutterBloCDioMDM SDK
Healthcare내부 APK

솜데이

병동 욕창·낙상 케어 안전관리 시스템, MethodChannel↔MDM SDK 연동·상태 기반 UI (Flutter)

FlutterBloCDioMDM SDK
Healthcare내부 APK

시선따라

병동 욕창·낙상 케어 안전관리 시스템, ScreenUtils 해상도 대응·Tree형 API 통신 구조 (Flutter)

FlutterBloCDioScreenUtils
Healthcare내부 APK

통증 다이어리

암 환자 통증·증상 보고, Compose + 상태 Hoisting, MQTT 폐쇄망 Push

KotlinJetpack ComposeMQTTKoin
Healthcare운영

스마트 돌봄 (사운드 캐치)

실시간 비언어 음성분석 SDK·1분 주기 전송, 지자체 시범사업 운영

KotlinSound SDKRetrofitService
Industrial IoT내부 APK

작업자 안전관리

실내 위치측위·블루투스 SOS 비콘, 심박·낙상 실시간 파싱

Kotlin/JavaBluetoothGPSFirebase
Healthcare · RTLSHospital

용인세브란스 방문자 추적

실시간 실내 위치추적 SDK, Android BLE Advertiser·iOS 지오펜싱

위치추적 SDK 특허 등록

AndroidiOSBLEGeofencing
HealthcareGoogle Play

보드미

치매 보호자 심리·건강 관리, 네이티브 Bluetooth 생체밴드·전문가 매칭

FlutterBluetoothWebViewBloC
HealthcareGoogle Play

AvecMom

임산부 감정상태(우울·불안) 측정·개선, MediaPlayer 음성 가이드

Kotlin/JavaFirebaseMediaPlayerMVC
Payments · ARGoogle Play

소다플레이

위치기반 리워드, ARCore 보상, 코인지갑 Intent 쿠폰 결제·삼성 월렛

Kotlin/JavaARCoreRxJavaGPS
LifestyleGoogle Play

쥬비스 다이어트

운동 전후 비교·칼로리 그래프, 고객 VOC·성능 대응

Kotlin/JavaFirebaseMVC
MessagingGoogle Play

두루톡

보상형 메신저 UI 전면 리뉴얼·Java→Kotlin, 실시간 번역·채팅 개선

Kotlin/JavaSocketRxJavaRetrofit
Kiosk키오스크 설치

지하철 키오스크

터치 키오스크 UI, 공공데이터 지하철·버스·관광 연동

JavaMVC공공데이터
TelecomField 장비

VoLTE

음성·영상·VoLTE 품질 및 데이터 속도 측정 (Field 측정 장비)

JavaHTTPThread/Handler

06 · Architecture Notes

아키텍처

Live iframe 정책

포트폴리오는 스크린샷이 아닌 실제 iframe으로 제품을 보여줍니다. 각 서비스는 Content-Security-Policy의 frame-ancestors로 포트폴리오 도메인만 부모 프레임으로 허용하고, chat-oz.com의 X-Frame-Options: DENY는 embed 경로에서만 풀어 다른 사이트의 임베드는 막습니다.

CSPframe-ancestorsX-Frame-Options

RAG와 기억 기반 대화

캐릭터챗은 페르소나, 사용자 맥락, 세션 기억, 장기 메모리, RAG 검색 결과를 분리된 레이어로 다뤄 대화 일관성과 개인화를 동시에 유지합니다.

RAGMemoryConversation

이미지 생성 처리 흐름

Studio는 오래 걸리는 이미지 생성·후처리를 큐와 백그라운드 워커로 분리해, 요청 응답과 실제 처리를 떼어 놓고 원본·후처리본·썸네일 자산을 단계별로 관리합니다.

QueueWorkerImage Pipeline

이미지 최적화와 비용 효율

이미지는 품질, 로딩 속도, 저장 비용, CDN 트래픽 비용을 함께 고려해 뷰포트에 필요한 크기·품질만 전달합니다. 파생본·썸네일·캐시 정책으로 사용자 체감 속도와 운영 비용을 같이 잡습니다.

CDNCachingCost

배포 & CI/CD 파이프라인

실행 환경을 Docker로 컨테이너화하고, GitHub Actions로 빌드·검증·배포를 자동화합니다. 서비스 성격에 따라 Vercel(프론트), Railway(백엔드 API), AWS·GCP Cloud Run(컨테이너 워크로드)으로 배포 대상을 나눠 운영합니다.

DockerGitHub ActionsCI/CD

네트워크 · 엣지 전달

Cloudflare로 DNS·CDN·캐싱을 두고, 서비스별 도메인과 임베드 경로의 프레임/보안 정책을 일관되게 관리합니다. 정적 자산은 엣지에서, 동적 처리는 각 런타임에서 처리하도록 경로를 분리합니다.

CloudflareDNSEdge

Contact

AI 제품을 실제 서비스로 만들 사람이 필요하다면

예쁜 데모에서 멈추지 않고, 요구사항 정리부터 UI, API, RAG, 결제, 분석, 배포, 운영 이슈까지 끝까지 연결하는 일을 좋아합니다.

Live Proof

말보다 실제 제품

Chat OZ, Saju, Studio, Store처럼 직접 열어볼 수 있는 라이브 서비스로 판단할 수 있습니다.

Product Depth

AI를 기능이 아니라 흐름으로 설계

RAG, 메모리, 큐, 워커, 결제, 지표, 모바일 확장까지 제품 맥락 안에서 연결합니다.

Execution

혼자서도 끝까지 밀어붙이는 실행력

기획, 구현, 배포, 운영, QA를 한 흐름으로 묶어 모호한 아이디어를 검증 가능한 서비스로 바꿉니다.

메일에는 만들고 싶은 제품, 지금 막힌 지점, 확인하고 싶은 역량 중 하나만 적어주세요. 빠르게 맥락을 잡고 이야기하겠습니다.

Ready to talk맥락 빠르게 확인

Name

Hakmyung Kim

Email

spingferry@gmail.com

Location

Republic of Korea