📘 MBTI 성격 유형 테스트
사용 설명서 & 가이드

🔮 MBTI 성격 유형 테스트는 총 25개의 예비 문항 중에서 매번 18개의 질문을 랜덤하게 추출하여 진행됩니다. 각 문항은 5지선다형으로 구성되어 있으며, 응답자의 선택에 따라 E/I, S/N, T/F, J/P 4가지 지표에 점수가 누적됩니다. 최종 결과는 16가지 MBTI 유형 중 하나로 도출되며, 성격 특징, 잘 맞는 유형, 상세 설명까지 제공됩니다.

✨ 특장점 : 매번 다른 질문 구성으로 반복 테스트 가능, 직관적인 UI/UX, 결과 이미지 저장, 카카오톡 공유 지원, 모바일 완전 최적화.

📋 상단 영역

🎯 MBTI 성격 유형 테스트 타이틀과 함께 18문항 5지선다형 안내, 진행률 표시줄 및 답변한 문항 수를 실시간으로 확인 가능합니다.

❓ 질문 카드

각 질문은 “1. 질문 내용” 형태로 표시되며, 5개의 선택지가 가로 터치에 최적화된 버튼 형태로 제공됩니다. 선택지에는 이모지와 함께 직관적인 설명이 포함되어 있습니다.

🎮 하단 네비게이션

◀ 이전 : 이전 문항으로 이동 (첫 문항에서는 비활성화)
다음 ▶ / ✨ 결과 보기 ✨ : 마지막 문항에서는 결과 보기 버튼으로 변경되며, 현재 문항을 반드시 선택해야 활성화됩니다.

📊 결과 화면

MBTI 4글자 유형 (예: INFP, ESTJ)이 대형으로 표시되고, 해당 유형의 상세 설명, 주요 성격 특징(키워드), 잘 맞는 MBTI 유형, 지표별 점수(E/I, S/N, T/F, J/P 수치)가 나타납니다.

📸 이미지 저장 : 결과 카드를 PNG 이미지로 저장 (html2canvas 라이브러리 기반)
💬 카카오톡 공유 : 모바일 공유 시트 또는 웹 공유 기능으로 결과 공유
🔄 다시 테스트하기 : 전체 초기화 후 새로운 질문 세트로 재시작

🧩 랜덤 문항 구성 : 총 25개의 마스터 질문 풀(pool)에서 매번 18개를 무작위로 선정합니다. 또한 각 질문의 5가지 선택지 순서도 매 테스트마다 랜덤하게 섞입니다 — 응답 편향을 줄이기 위한 설계입니다.

📊 MBTI 점수 시스템 : 각 선택지에는 E/I, S/N, T/F, J/P 차원별로 가중치가 부여되어 있습니다 (예: +0.8 ~ -0.8 범위). 18개 답변을 모두 합산한 뒤, 각 축의 총점이 0 이상이면 E / S / T / J, 0 미만이면 I / N / F / P로 결정됩니다.

결과가 도출되면 미리 정의된 16가지 MBTI 유형별 상세 설명, 특징, 궁합 정보가 매칭됩니다.

테스트 완료 후 아래와 같은 맞춤형 정보를 제공합니다:

• ✨ MBTI 4자리 코드 (예: ENFJ, ISTP)
• ✨ 유형별 상세 설명 : 성격 특성, 강점, 관계 스타일 등
• ✨ 주요 성격 특징 : 4~5가지 핵심 키워드 (예: 리더십, 공감 능력, 분석력)
• ✨ 잘 맞는 MBTI 유형 : 가치관 및 소통 방식이 유사한 추천 유형
• ✨ 지표별 점수 : 각 축의 상세 수치 (예: E/I: 2.3, S/N: -1.2 등)

이미지 저장 (PNG)

결과 영역에 있는 📸 이미지 저장 버튼을 누르면 html2canvas 라이브러리가 결과 카드를 고해상도 이미지로 변환하여 자동 다운로드합니다. 저장된 이미지는 SNS, 메신저 등에서 자유롭게 공유할 수 있습니다.

카카오톡 / 공유

모바일 기기에서는 💬 카카오톡 공유 버튼을 눌러 Web Share API를 통해 메시지, 메일, 카카오톡 등으로 결과를 공유할 수 있습니다. (데스크톱 환경에서는 기본 공유 대화상자가 지원되지 않을 수 있으나 이미지 저장을 권장)

💡 팁 : 결과 이미지에는 MBTI 유형, 설명, 궁합 정보 및 테스트 브랜드가 포함되어 있어 깔끔하게 저장됩니다.

✅ 지원 브라우저 : Chrome, Safari, Samsung Internet, Firefox, Edge (최신 버전)
✅ 모바일 최적화 : iOS/Android 모두 반응형 레이아웃, 터치 친화적 디자인 적용
✅ 사용 라이브러리 : html2canvas (이미지 저장), Web Share API (카카오톡 공유 지원)
✅ 저장 방식 : 모든 데이터는 클라이언트 측에서 처리 (별도 서버 저장 없음, 프라이버시 보호)

• 📌 질문이 로딩되지 않아요 : 인터넷 연결 확인 후 새로고침. JavaScript가 차단되지 않았는지 확인하세요.
• 📌 결과 이미지가 잘려요 : html2canvas 렌더링 이슈일 수 있습니다. 화면을 아래로 살짝 스크롤 후 다시 저장 버튼을 눌러보세요.
• 📌 '공유' 버튼이 동작하지 않음 : HTTP 환경이 아닌 HTTPS 또는 로컬에서 발생할 수 있습니다. Web Share API는 보안 컨텍스트에서만 활성화됩니다.
• 📌 진행률이 올바르게 표시되지 않음 : 문항을 모두 다시 선택하면 정상 반영됩니다. 모든 질문에 답변했는지 확인하세요.