"기술 면접, 막막하지 않으신가요?"
Synapse(시냅스) 는 단순한 질의응답을 넘어, 사용자의 이력서와 포트폴리오를 기반으로 AI 면접관이 날카로운 꼬리 질문을 던지는 모의 면접 시뮬레이션 서비스에요.
실전과 같은 환경에서 내가 무엇을 모르는지(메타인지)를 발견하고, 경험을 구조적으로 설명하는 능력을 기를 수 있어요.
취업 준비 과정에서 신입 개발자들은 기술 면접에 큰 부담감을 느끼고 있어요.
실제 면접을 준비하기 위해 스터디원을 구하고, 시간을 맞추고, 장소를 정하는 과정은 준비 그 자체보다 더 많은 에너지를 소모하게 만들어 연습 과정을 지치게 만들어요.
또한 면접 스터디 과정에서 아직 정리되지 않은 생각이나 부족한 답변을 타인에게 공개하는 것에 심리적 부담을 느끼는 경우도 많아요.
우리는 이러한 현실적인 제약을 줄이고, 혼자서도 언제 어디서든 연습할 수 있는 환경이 필요하다고 생각했어요.
하지만, 혼자 진행하는 면접 연습에서 가장 부족한 점은 객관적인 피드백을 받을 수 없다는 점이에요. 자신의 표정, 시선 처리, 말투와 같은 비언어적 요소나 답변의 논리 구조를 스스로 인지하는 것은 쉽지 않아요.
이를 해결하기 위해 Synapse(시냅스)는 웹캠 리플레이 기능을 통해 면접 전 과정을 녹화하고, 사용자가 직접 자신의 태도와 표현을 확인할 수 있도록 셀프 피드백 도구를 제공하고 있어요.
여기에 더해 AI가 답변 내용을 분석하여 논리 전개, 구조화된 말하기, 전반적인 응답 흐름 등을 루브릭 지표로 평가하여 피드백함으로써, 보다 객관적인 면접 준비 경험을 제공하려고 노력하고 있어요.
2025-01-05 ~ 2026-02-06
"나의 경험이 면접 질문이 됩니다."
- 자기소개서 등록: 지원자의 강점과 경험이 담긴 자기소개서를 등록하면, AI가 내용을 분석해 예상 질문을 추출합니다.
- 포트폴리오 등록 (PDF 지원): PDF 포트폴리오를 업로드하면, 사용된 기술 스택과 문제 해결 과정을 파악하여 검증 질문을 생성합니다.
"실전처럼 말하면서 연습하세요."
-
Real-time STT: 사용자의 음성을 실시간으로 텍스트로 변환하여 AI 면접관과 자연스럽게 대화할 수 있습니다.
-
말하기 훈련: 실제로 내뱉는 연습을 통해 면접장에서의 자신감을 키울 수 있습니다.
"나의 면접을 객관적으로 회고합니다."
-
AI 상세 피드백: 답변의 논리성, 적절성, 구체성 등을 분석하여 구조화된 피드백 리포트를 제공합니다.
-
리플레이(Replay): 면접 녹화 영상을 통해 시선 처리, 표정, 말투 등 비언어적인 습관을 점검할 수 있습니다.
"다음 링크에서 체험할 수 있습니다!"
-
Front-end:
zod,iron-session,motion,tailwindcss,nextjs,chadcn,tw-animate-css,MSW,lucide-react -
Common:
turbo,pnpm,eslint,prettier -
DevOps(CI/CD):
docker,docker-compose,github action,NCP (Naver Cloud Platform),Vercel -
Back-end:
nest.js,TypeORM,typescript,mysql,clova studio,winston -
Collaboration:
Slack,Github
팀에서 문제 해결 과정을 고민한 기록들입니다!
프론트엔드와 백엔드 개발을 독립적으로 진행할 수 있도록 **MSW(Mock Service Worker)**를 도입하고, 환경변수 기반으로 실제 API와 Mock API를 손쉽게 전환할 수 있는 개발 환경을 구축했습니다.
Next.js의 Server/Client Component 혼재 환경에서 MSW만으로는 서버 사이드 요청을 처리할 수 없는 문제를 해결하기 위해, 클라이언트 요청은 MSW Service Worker가 브라우저 레벨에서 intercept하고, 서버 요청은 isApiMockEnabled() 함수로 분기하여 Mock 데이터를 직접 반환하는 방식으로 구현했습니다.
또한 절대 경로(https://api.web23psi.shop/...)와 상대 경로(/interview/...) 모두에서 동작하도록 MSW 핸들러를 이중으로 등록하여, 다양한 배포 환경에서도 일관된 Mock 동작을 보장했습니다.
이를 통해 백엔드 API 완성 여부와 무관하게 프론트엔드 개발과 테스트가 가능해졌으며, .env.local 파일의 환경변수 한 줄로 Mock/Real API를 즉시 전환할 수 있게 되었습니다.
작성자: 임건혁
CLOVA API는 파일 업로드를 지원하지 않고 텍스트 입력만 가능하여, 사용자에게 수십 페이지 포트폴리오를 수동으로 복사-붙여넣기 하도록 요구할 수 없었습니다. 서버 사이드 처리를 고려했으나 OCR 비용 폭증과 Vercel의 4.5MB 페이로드 제한 문제로 인해 클라이언트 사이드 처리를 결정하였습니다.
PDF.js로 텍스트 레이어를 우선 추출하되, 이미지형 PDF의 경우 Tesseract.js OCR을 사용하는 하이브리드 전략을 구현하였습니다. calculateTextQuality() 함수로 추출된 텍스트의 한글/영문/숫자 비율을 분석하여, 일정 품질 미만이거나 30자 미만일 때만 OCR을 실행하도록 최적화하였습니다.
초기 구현에서는 3.0 스케일 고해상도 렌더링과 이미지 전처리를 적용했으나 처리 속도가 과도하게 느려지고 메모리 사용량이 급증하는 문제가 발생했습니다. 결국 2.0 스케일 기본 OCR + 사용자 검수 방식을 채택하여 "적당한 품질과 빠른 속도"를 유지하고, OCR 사용 시 명확한 안내 메시지를 표시하도록 개선하였습니다.
또한 20MB 이상의 OCR 라이브러리가 초기 로딩 속도를 저하시키지 않도록 Lazy Loading을 적용하여, PDF 업로드 기능을 실제로 사용하는 시점에만 라이브러리를 동적으로 로드하도록 최적화하였습니다.
이를 통해 서버 비용 들지 않고, Vercel의 페이로드 제한 우회가 가능한 실용적인 PDF Text 추출 기능을 구현하였습니다.
작성자: 임건혁
Nest.js 서버를 개발하며, 컨트롤러에서 인증된 사용자 정보를 직접 추출하는 코드가 여러 곳에 반복되는 문제를 겪었습니다.
createParamDecorator()를 활용해 인증 사용자 정보 추출 로직을 커스텀 데코레이터로 분리하고, 컨트롤러의 책임을 명확히 한 과정을 소개합니다.
작성자: 박영규
이 문서는 Synapse의 면접 피드백의 목적, LLM 모델 선택 이유, 그리고 루브릭(Rubric) 지표를 활용한 면접 평가 방식 어떻게 설계되고 구현되었는지를 소개합니다.
작성자: 박영규
PSI 프로젝트는 모노레포 구조 내에서 백엔드와 프론트엔드가 긴밀하게 상호작용하는 환경으로, 로컬과 배포 환경(Staging/Production)의 불일치로 인한 'Flaky Test'와 데이터 간섭 문제가 빈번했습니다. 이를 해결하기 위해 CI 파이프라인 내에 프로덕션과 동일한 MySQL Service Container를 통합하고, 외래 키 제약 조건을 무시하며 데이터를 원자적으로 초기화하는 seed-db 유틸리티를 구현하여 완전한 환경 격리를 달성했습니다.
또한, 런타임 에러를 방지하기 위해 NestJS의 ValidationPipe를 엄격하게 설정(Whitelist/ForbidNonWhitelisted)하여, 잘못된 데이터가 비즈니스 로직에 진입하기 전에 차단하는 Fail Fast 전략을 구축했습니다.
비록 CI 실행 속도가 다소 느려지는 Trade-off가 있었으나, "내 로컬에서는 되는데"라는 불확실성을 제거하고 CI 파이프라인 통과가 곧 배포 안정성을 보장하는 무결점 배포 문화를 정착시켰습니다.
작성자: 임장혁
PSI의 AI 면접 시스템은 세션 정보의 정리를 위해 실시간 타임아웃(TTL)을 관리해야 합니다. 하지만 개별 세션마다 setTimeout을 생성하는 기존 방식은 Node.js 이벤트 루프에 과부하(Starvation)를 일으키고 정밀도를 떨어뜨리는 문제가 있었습니다.
이를 해결하기 위해 Min-Heap(최소 힙) 자료구조를 직접 구현하여 가장 먼저 만료될 세션을
Redis와 같은 외부 인프라 도입도 적극 고려했으나, 네트워크 I/O 오버헤드와 관리 복잡도를 피하기 위해 In-Memory 자료구조를 택했습니다. 데이터 유실 위험이라는 Trade-off는 중요 시점마다 DB에 저장하는 Write-behind 전략으로 보완했습니다. 결과적으로 불필요한 타이머 객체 생성을 막아 CPU 및 메모리 효율을 극대화하였습니다.
작성자: 임장혁
이 문서는 브라우저 음성 녹음 환경에서 발생한 마이크 입력 편차 문제를 해결하기 위해 Web Audio API의 GainNode와 FFT 기반 시각화를 적용한 과정을 정리한 부분입니다.
작성자: 강범창
프론트엔드에서 인증이 필요한 요청을 안정적으로 처리하기 위해 Zod 기반 입력 검증과 iron-session 세션 관리, Next.js 서버 액션을 활용한 BFF 유사 구조를 적용한 기록입니다.
작성자: 강범창