프로젝트 배경
⚠️ 문제점
• 정신건강 전문가 상담 접근이 어렵고 신뢰 기반 매칭 시스템 부재
• 상담 후 병원 연계·검사 안내 등 이용 흐름의 단절
✅ 프로젝트 목표
• 설문 기반 전문가 매칭 및 온라인 상담 플랫폼 MVP 구축
• 상담부터 병원 연계까지 통합된 사용자 경험 제공
• 편안하고 직관적인 UI/UX로 정신건강 서비스 접근성 향상
❗주안점
• 설문-매칭-상담-병원 연계를 하나의 흐름으로 구성
• 모바일·PC 대응 반응형 웹 구현
• 확장 가능한 구조 설계로 AI 추천 및 결제 기능 대비
• 정신건강 전문가 상담 접근이 어렵고 신뢰 기반 매칭 시스템 부재
• 상담 후 병원 연계·검사 안내 등 이용 흐름의 단절
✅ 프로젝트 목표
• 설문 기반 전문가 매칭 및 온라인 상담 플랫폼 MVP 구축
• 상담부터 병원 연계까지 통합된 사용자 경험 제공
• 편안하고 직관적인 UI/UX로 정신건강 서비스 접근성 향상
❗주안점
• 설문-매칭-상담-병원 연계를 하나의 흐름으로 구성
• 모바일·PC 대응 반응형 웹 구현
• 확장 가능한 구조 설계로 AI 추천 및 결제 기능 대비
프로젝트 성과
상담 매칭 전환율 약 65% 달성
설문 응답 사용자 중 약 65%가 실제 상담 연결 페이지까지 진입하며, 매칭 흐름의 직관성이 검증됨
사용자 이탈률 40% 이상 감소
서비스 흐름 간소화 및 설문 UI 개선 이후, 설문 도중 이탈 비율이 크게 줄어듦
핵심 기능
설문 기반 전문가 매칭 기능
사용자 설문 결과를 바탕으로 적합한 상담사 또는 의료진을 자동 매칭
상담사 프로필 조회 및 상담 유도
전문가 정보 제공을 통해 신뢰 형성 및 상담 신청 흐름 유도
콘텐츠 관리 및 병원 안내 설정
관리자가 전문가·병원 정보를 등록·수정하고, 비급여 검사 안내 구성 가능
진행 단계
기획 및 요구사항 정리
2025.02.
서비스 구조 정의, 주요 기능 및 사용자 흐름 기획
화면 설계
2025.03.
Figma 기반 UI 설계, 사용자·전문가 관점의 흐름 구성
MVP 개발
2025.04.
설문 입력, 전문가 매칭, 전문가 소개 등 핵심 기능 구현 / 관리자용 콘텐츠 관리
테스트 및 개선
2025.05.
모바일·PC 환경 테스트 및 피드백 기반 기능 개선
배포 및 마무리
2025.06.
플랫폼 배포 완료, 최종 정리 및 확장 고려한 구조 정비
프로젝트 상세
1. 포트폴리오 소개
본 프로젝트는 정신건강 분야의 전문가와 사용자를 연결하는 비대면 상담 플랫폼의 MVP 웹서비스 구축 사례입니다. 사용자는 간단한 설문을 통해 본인에게 적합한 상담사 또는 의료진과 매칭되고, 온라인 상담을 진행하거나 필요 시 협약 병원을 통해 바이오마커 기반 비급여 검사로 연계될 수 있도록 설계되었습니다.
정신건강이라는 민감한 주제에 맞춰 신뢰감 있는 콘텐츠 구조와 직관적인 UI를 중심으로 서비스 흐름을 구성하였습니다.
2. 작업 범위
- 서비스 기획 및 사용자 플로우 설계
- UI/UX 디자인 (Figma 활용)
- 반응형 웹 프론트엔드 개발 (React.js)
- 설문 기반 매칭 로직 설계 및 적용
- 전문가·병원 안내 콘텐츠 구성
3. 주요 기능
- 사용자 설문을 통한 전문가 매칭 안내
- 비대면 상담 흐름 소개 및 상담 연결
- 병원 연계 및 바이오마커 검사 안내
- 전문가 프로필 확인 및 상담 신청 유도
- 모바일·PC 대응 반응형 인터페이스
4. 주안점
- 신뢰감을 줄 수 있는 UI/UX 구성과 정서적 톤앤매너
- 설문 기반 매칭 흐름의 간결한 구성
- 비대면 상담과 의료기관 연계의 자연스러운 사용자 유도
- MVP 단계에서 명확한 서비스 구조 제시 및 확장 가능성 확보
본 프로젝트는 정신건강 분야의 전문가와 사용자를 연결하는 비대면 상담 플랫폼의 MVP 웹서비스 구축 사례입니다. 사용자는 간단한 설문을 통해 본인에게 적합한 상담사 또는 의료진과 매칭되고, 온라인 상담을 진행하거나 필요 시 협약 병원을 통해 바이오마커 기반 비급여 검사로 연계될 수 있도록 설계되었습니다.
정신건강이라는 민감한 주제에 맞춰 신뢰감 있는 콘텐츠 구조와 직관적인 UI를 중심으로 서비스 흐름을 구성하였습니다.
2. 작업 범위
- 서비스 기획 및 사용자 플로우 설계
- UI/UX 디자인 (Figma 활용)
- 반응형 웹 프론트엔드 개발 (React.js)
- 설문 기반 매칭 로직 설계 및 적용
- 전문가·병원 안내 콘텐츠 구성
3. 주요 기능
- 사용자 설문을 통한 전문가 매칭 안내
- 비대면 상담 흐름 소개 및 상담 연결
- 병원 연계 및 바이오마커 검사 안내
- 전문가 프로필 확인 및 상담 신청 유도
- 모바일·PC 대응 반응형 인터페이스
4. 주안점
- 신뢰감을 줄 수 있는 UI/UX 구성과 정서적 톤앤매너
- 설문 기반 매칭 흐름의 간결한 구성
- 비대면 상담과 의료기관 연계의 자연스러운 사용자 유도
- MVP 단계에서 명확한 서비스 구조 제시 및 확장 가능성 확보



