Interview Evidence는 “AI가 지원자를 평가하는 대시보드”가 아니라 “사람이 전사와 원음을 검토하는 작업 도구”처럼 보여야 한다. 사용자가 한 화면에서 모든 기능을 마주하게 하지 않고, 현재 판단에 필요한 내용만 단계별로 제공한다.
핵심 방향은 다음과 같다.
- UX는
음성 준비 → 화자 확인 → 근거 찾기의 3개 depth로 나눈다. - 결과의 세부 문맥과 오디오 재생은 네 번째 페이지가 아니라
근거 찾기안의 상세 layer로 제공한다. - 흰색과 회색을 기본으로 하고 스카이블루를 주요 동작과 현재 위치에 사용한다.
- 기능을 과장하거나 사용자 대신 판단하는 AI식 문구를 사용하지 않는다.
- 제품 요구사항은
docs/PRD.md가 우선하며, 이 문서는 구체적인 화면 구현 기준을 정의한다.
- 한 depth, 한 가지 결정: 파일 준비, 화자 지정, 근거 확인을 한 화면에 섞지 않는다.
- 근거 우선: 답변 텍스트, 타임스탬프와 원음을 순위나 유사도보다 먼저 읽히게 한다.
- 판단 중립성: 성공·실패·합격처럼 보이는 색과 문구를 검색 결과에 사용하지 않는다.
- 상태 가시성: 전사 상태, 현재 depth, 선택한 화자와 결과를 명확히 표시한다.
- 자연스러운 문장:
AI 분석,인사이트 생성,최적의 답변대신 사용자가 할 일을 평범한 한국어로 설명한다. - 낮은 밀도: 한 개의 음성과 현재 질의의 Top 3만 다루고 불필요한 지표와 장식 카드를 만들지 않는다.
Depth 1. 음성 준비
파일 선택
파일 정보 확인
RTZR 전사 시작
전사 진행 및 오류 복구
↓
Depth 2. 화자 확인
두 화자의 대표 발화 확인
지원자 화자 선택
전체 전사 내용 선택 확인
↓
Depth 3. 근거 찾기
평가 기준 입력
관련 답변 Top 3
결과 선택
현재 결과 JSON 다운로드
↓ 같은 depth 안에서 열림
결과 상세 layer
선택한 답변
답변 전후 문맥
답변 시작부터 종료 3초 후 오디오 재생
검색 상세 정보
페이지 상단에는 현재 위치만 간결하게 표시한다.
음성 준비 ─── 화자 확인 ─── 근거 찾기
- 현재 depth의 텍스트와 선만 스카이블루로 강조한다.
- 완료 체크 아이콘, 퍼센트와 게임형 stepper는 사용하지 않는다.
- 이전 depth로 돌아갈 수 있지만 이미 완료한 전사 결과는 불필요하게 버리지 않는다.
- 새 음성을 선택하거나 새 전사를 시작할 때만 이후 depth의 상태를 초기화한다.
- Streamlit multipage 라우팅을 추가하지 않고
st.session_state의 현재 depth로 화면을 전환한다.
사용자가 파일 한 개를 선택하고 실제 RTZR 전사를 완료하는 단계다. 화자 선택과 검색 UI는 이 화면에 노출하지 않는다.
Interview Evidence
면접에서 다시 확인할 답변을 찾아보세요.
음성 파일을 전사한 뒤, 평가 기준과 관련된 구간을 원음으로 확인할 수 있습니다.
[ 면접 음성 파일 선택 ]
선택된 파일
interview-sample.wav · 09:10
[ 전사 시작 ]
- 제목:
Interview Evidence - 소개:
면접에서 다시 확인할 답변을 찾아보세요. - 보조 설명:
음성 파일을 전사한 뒤, 평가 기준과 관련된 구간을 원음으로 확인할 수 있습니다. - 제품 한계:
지원자를 자동 평가하거나 점수를 매기지 않습니다. - 업로더 레이블:
면접 음성 파일 - 업로더 도움말:
한 명의 면접관과 한 명의 지원자가 대화한 파일 1개를 선택하세요. - 전사 버튼:
전사 시작 - 외부 처리 안내:
선택한 파일은 전사를 위해 RTZR로 전송됩니다.
AI 분석 시작, 스마트 인터뷰 분석, 음성을 업로드해 인사이트를 생성하세요 같은 문구를 사용하지 않는다.
- 파일명과 확인 가능한 경우 재생 시간을 표시한다.
- 자격 증명이나 파일에 문제가 있으면 버튼 가까이에 이유와 해결 방법을 표시한다.
- 전사 시작 전에는 파일을 교체할 수 있다.
- 키워드 부스팅은 핵심 MVP에서 숨긴다. 이후 추가할 경우
선택 설정expander 안에 둔다.
- 중복 제출을 막는다.
- 가짜 퍼센트 대신 실제 상태 문구만 표시한다.
음성 파일을 전송했습니다.
현재 전사 결과를 기다리고 있습니다.
- 내부 폴링 단계는 필요할 때
파일 전송 중,전사 중,완료 결과 확인 중으로 구분한다. transcribe_id는 세션에 보존하지만 기본 화면에 길게 노출하지 않는다.- 60분 제한에 도달하면 실패로 단정하지 않고
상태 조회 재개버튼을 제공한다. - 전사 완료 후 자동으로 Depth 2로 전환한다.
전사 결과를 바탕으로 어떤 화자가 지원자인지 사용자가 직접 확인한다. 지원자 역할이 확정되기 전에는 임베딩 검색을 시작하지 않는다.
화자를 확인해 주세요
지원자에 해당하는 화자를 선택하면
해당 화자의 답변만 검색 대상으로 사용합니다.
┌ 화자 1 ─────────────────────────┐
│ “이번 프로젝트에서 제가 맡은…” │
│ “초기에는 정확도를 중심으로…” │
│ [ 지원자로 선택 ] │
└─────────────────────────────────┘
┌ 화자 2 ─────────────────────────┐
│ “당시 문제를 어떻게 정의했나요?” │
│ “직접 담당한 부분은 무엇인가요?” │
│ [ 지원자로 선택 ] │
└─────────────────────────────────┘
[ 전체 전사 내용 확인 ]
- RTZR 화자 ID를
화자 1,화자 2처럼 일관된 표시명으로 변환한다. - 각 화자의 대표 발화 2~3개를 함께 보여준다.
- 대표 발화는 시간순으로 앞에서 찾되, 지나치게 짧거나 빈 발화는 제외한다.
- 대표 발화 선택은 역할을 추론하거나 자동 판정하는 기능이 아니다.
- 버튼 문구는
지원자로 선택을 사용한다. - 선택된 카드만 연한 스카이블루 배경과 스카이블루 테두리로 구분한다.
- 한 명을 선택하면 나머지 화자는 면접관으로 취급한다.
- 여러 역할을 편집하는 표나 드래그 UI는 만들지 않는다.
전체 전사 내용 확인은 같은 depth의 expander 또는 보조 영역으로 연다.- 각 항목은
MM:SS, 화자 라벨, 발화 텍스트 순서로 표시한다. - 역할 확정 전에는
화자 1,화자 2, 확정 후에는화자 1 · 지원자,화자 2 · 면접관으로 표시한다. - 검색에서 제외될 짧은 발화도 숨기지 않는다.
- 키워드 하이라이트, 단어별 타임스탬프와 편집 기능은 추가하지 않는다.
지원자로 선택버튼을 누르면 답변 구간과 문서 임베딩을 준비한 뒤 Depth 3으로 즉시 전환한다.- 화자를 변경하려면
근거 찾기에서← 화자 선택 변경으로 이전 depth로 돌아간다. - 고유 화자가 정확히 두 명이 아니면 화자 카드를 표시하지 않고 다음 안내를 제공한다.
이 버전은 두 명이 대화한 인터뷰만 지원합니다.
전사 내용은 확인할 수 있지만 관련 답변 검색은 사용할 수 없습니다.
사용자가 한 가지 평가 기준을 입력하고 관련 답변을 최대 3개까지 확인한다. 이 화면이 전사 완료 후 반복해서 사용하는 메인 작업 공간이다.
← 화자 선택 변경
확인할 내용을 입력하세요
[ 실패 원인을 어떻게 분석하고 개선했는가? ]
[ 관련 답변 찾기 ]
찾아볼 만한 답변 3개
#1 02:17–03:09
“처음에는 모델 정확도만 확인했는데 실제 운영에서는…”
[ 이 구간 듣기 ] [ 전사 문맥 보기 ]
#2 03:09–03:52
...
#3 07:58–08:31
...
- 레이블:
확인할 내용을 입력하세요 - placeholder:
예: 실패 원인을 어떻게 분석하고 개선했는가? - 도움말:
한 번에 한 가지 기준을 입력하세요. 같은 전사 결과에서 다시 검색할 수 있습니다. - 버튼:
관련 답변 찾기 - 빈 질의에서는 버튼을 비활성화한다.
- 검색 후에도 입력값을 유지한다.
- 새 질의를 제출하면 이전 결과를 교체하고 검색 기록은 쌓지 않는다.
- 진행 문구:
관련 답변을 찾고 있습니다. - 완료 문구:
찾아볼 만한 답변 3개또는 실제 결과 수에 맞는 문구 AI가 분석 중입니다,인사이트를 생성하고 있습니다,최적의 답변을 찾았습니다를 사용하지 않는다.- 결과 위에 다음 안내를 표시한다.
입력한 기준과 의미가 가까운 순서로 표시했습니다. 필요한 판단은 원문과 원음을 확인한 뒤 내려주세요.
#1 02:17–03:09
답변 텍스트 전문 또는 검토에 충분한 본문
[ 이 구간 듣기 ] [ 전사 문맥 보기 ]
[ 검색 정보 펼치기 ]
- 순위는
#1,#2,#3으로 표시한다. - 메달, 별, 트로피, 점수 게이지를 사용하지 않는다.
높은 관련성,우수,적합,추천 답변같은 평가성 라벨을 사용하지 않는다.- 유사도 숫자는 기본 카드 본문에 노출하지 않는다.
- 카드 전체를 클릭 영역으로 만들지 않고 행동 버튼을 명확히 분리한다.
- 결과가 1~2개뿐이면 빈 카드를 만들지 않는다.
- 레이블:
현재 검색 결과 내려받기 - 현재 질의와 결과가 있을 때만 활성화한다.
- 도움말:
전체 전사 내용과 음성 파일은 포함되지 않습니다. - 서버
outputs/저장 버튼은 만들지 않는다.
결과 상세는 별도 depth나 새 페이지가 아니다. Depth 3에서 결과를 선택했을 때 검색 결과 아래에 열리는 단일 상세 영역이다.
선택한 답변
02:17–03:09
재생 범위 02:14–03:12
[ 오디오 플레이어 ]
앞뒤 대화 함께 보기
면접관 “운영에서는 어떤 문제가 있었나요?”
지원자 “처음에는 모델 정확도만 확인했는데…”
검색 정보
코사인 유사도 0.782
원본 발화 12–15
- 결과 카드마다 플레이어를 반복하지 않고 상세 layer에 하나만 둔다.
이 구간 듣기를 누르면 선택 답변과 재생 범위를 갱신한다.- 답변 시작 시점부터 종료 3초 후까지 재생하며 음원 경계로 보정한다.
- 자동 재생하지 않는다.
- 브라우저 제약으로 즉시 재생되지 않으면 플레이어의 재생 버튼을 누르도록 안내한다.
전사 문맥 보기는 선택 답변의 직전 면접관 발화와 해당 답변을 우선 표시한다.- MVP에서 질문과 답변을 새로 자동 연결하거나 경계를 수정하지 않는다.
- 전체 타임라인이 필요하면 Depth 2의
전체 전사 내용 확인으로 돌아갈 수 있다.
- 정확한 코사인 유사도와 원본 발화 인덱스는 접힌 상세 정보로 제공한다.
- 레이블은
검색 정보를 사용한다. AI 점수,적합도,답변 품질,신뢰도라는 이름을 사용하지 않는다.
- 상단 depth 표시와 명시적 뒤로가기 행동을 제공한다.
- Depth 3에서
화자 선택 변경을 누르면 Depth 2로 돌아가되 전사 결과는 유지한다. - 지원자 화자를 변경하면 답변 구간, 답변 임베딩, 질의 결과와 선택 상세를 초기화한다.
- Depth 2에서 음성을 바꾸려면 Depth 1로 돌아간 뒤 명시적으로 새 파일을 선택한다.
- 새 파일 선택 또는 새 전사 시작 시 기존 화자 선택, 세그먼트, 임베딩, 검색 결과와 상세 선택을 모두 초기화한다.
- 브라우저 새로고침 뒤 상태 복원과 URL deep link는 MVP에서 지원하지 않는다.
흰색과 회색을 기본으로 하고 스카이블루를 메인 컬러로 사용한다. 밝은 스카이블루는 선택 배경에, 대비가 충분한 진한 스카이블루는 버튼과 링크에 사용한다.
| 용도 | 값 | 사용 |
|---|---|---|
| 페이지 배경 | #FFFFFF |
전체 배경 |
| 보조 배경 | #F8FAFC |
진행 상태와 보조 영역 |
| 카드·구분 영역 | #F1F5F9 |
비활성 또는 보조 표면 |
| 표면 | #FFFFFF |
입력과 선택 카드 |
| 기본 텍스트 | #0F172A |
제목과 본문 |
| 보조 텍스트 | #64748B |
설명과 메타데이터 |
| 비활성 텍스트 | #94A3B8 |
사용할 수 없는 상태 |
| 테두리 | #E2E8F0 |
입력과 구분선 |
| 용도 | 값 |
|---|---|
| 주요 버튼·링크 | #0284C7 |
| hover·pressed | #0369A1 |
| 포커스 | #38BDF8 |
| 선택 배경 | #E0F2FE |
| 선택 테두리 | #7DD3FC |
스카이블루는 다음에만 집중적으로 사용한다.
- 현재 depth
- 주요 버튼
- 선택된 화자 카드
- 선택된 검색 결과
- 링크와 키보드 포커스
검색 순위와 유사도에는 색 농도나 시맨틱 색을 매핑하지 않는다.
| 용도 | 값 | 제한 |
|---|---|---|
| 성공 | #15803D |
전사 완료와 다운로드 준비 같은 작업 상태만 |
| 경고 | #A16207 |
조회 중단과 제약 안내 |
| 오류 | #DC2626 |
사용자가 복구해야 하는 오류 |
상태 색은 본문 전체나 결과 카드 배경으로 사용하지 않는다.
- 시스템 산세리프와 Streamlit 기본 폰트를 사용한다.
- 페이지 제목: 30~34px, semibold
- depth 제목: 24~28px, semibold
- 섹션 제목: 18~22px, semibold
- 본문: 15~16px, line-height 1.55 이상
- 메타데이터와 타임스탬프: 13~14px
- 답변 텍스트를 본문보다 작게 만들지 않는다.
- 영문 부제나 숫자에 별도 장식 글꼴을 사용하지 않는다.
- 본문 최대 너비는 약 880~960px로 유지한다.
- 주요 블록 간 간격은 32
40px, 내부 요소 간 간격은 1220px를 기준으로 한다. - 기본 정렬은 좌측이며 마케팅 랜딩처럼 모든 내용을 중앙 정렬하지 않는다.
- 기능보다 사용자의 행동을 설명한다.
- 앱이 판단하거나 정답을 알고 있는 것처럼 말하지 않는다.
- 영어식 제품 용어를 억지로 번역하지 않는다.
- 한 문장에
분석,AI,인사이트,스마트,최적을 반복하지 않는다. - 오류는 원인과 다음 행동을 함께 설명한다.
- 기술명은 사용자가 설정하거나 문제를 해결할 때만 노출한다.
| 피할 문구 | 사용할 문구 |
|---|---|
| AI 기반 인터뷰 인사이트 | 다시 확인할 답변 찾기 |
| AI 분석을 시작하세요 | 음성 파일을 전사해 주세요 |
| AI 분석 시작 | 전사 시작 |
| AI가 답변을 분석 중입니다 | 관련 답변을 찾고 있습니다 |
| 인사이트 생성 | 관련 답변 찾기 |
| 최적의 답변을 발견했습니다 | 찾아볼 만한 답변을 찾았습니다 |
| 분석 결과를 확인하세요 | 원문과 원음을 확인해 주세요 |
| 높은 관련성 | 1번째 검색 결과 |
| 지원자 적합도 | 사용하지 않음 |
| AI 점수 | 사용하지 않음 |
| 위치 | 문구 |
|---|---|
| 제품 소개 | 면접에서 다시 확인할 답변을 찾아보세요. |
| 제품 한계 | 지원자를 자동 평가하거나 점수를 매기지 않습니다. |
| 화자 선택 | 지원자에 해당하는 화자를 선택하면 해당 화자의 답변만 검색 대상으로 사용합니다. |
| 질의 입력 | 확인할 내용을 입력하세요 |
| 검색 버튼 | 관련 답변 찾기 |
| 검색 진행 | 관련 답변을 찾고 있습니다. |
| 결과 제목 | 찾아볼 만한 답변 N개 |
| 결과 안내 | 입력한 기준과 의미가 가까운 순서로 표시했습니다. 필요한 판단은 원문과 원음을 확인한 뒤 내려주세요. |
| 재생 행동 | 이 구간 듣기 |
| 문맥 행동 | 전사 문맥 보기 |
| 다운로드 | 현재 검색 결과 내려받기 |
- 색만으로 depth, 화자, 상태와 선택을 구분하지 않는다.
- 모든 입력에 화면에 보이는 레이블을 제공한다.
- 키보드 포커스 표시를 제거하지 않는다.
- 버튼은
계속,확인만 쓰지 않고 행동 결과를 설명한다. - 오류 메시지는 문제가 발생한 입력이나 동작 가까이에 둔다.
- 타임스탬프는
MM:SS로 표시하고 원본 밀리초는 JSON과 상세 정보에만 둔다. - 자동 재생, 자동 스크롤, 깜빡이는 상태와 장식 애니메이션을 사용하지 않는다.
- 모바일에서는 한 열을 유지하며 화자 카드와 결과 카드가 화면 밖으로 넘치지 않게 한다.
- Streamlit 기본 spinner와 status
- depth 전환 시 기본 렌더링
- 버튼과 링크의 짧은 hover 상태
그 외 fade, slide, glow, pulse 같은 장식 애니메이션은 추가하지 않는다.
| 금지 사항 | 이유 |
|---|---|
| 한 화면에 업로드·화자 선택·검색을 모두 노출 | depth를 나눈 목적을 무너뜨림 |
AI 평가 점수, 합격 가능성, 답변 품질 표시 |
제품 목적과 다르고 오판을 유도함 |
| 유사도를 큰 숫자·게이지·차트로 강조 | 절대 평가 점수처럼 보임 |
| 결과별 성공·실패 색상 | 검색 관련성과 평가 판단을 혼동함 |
| 모든 내용을 동일한 둥근 카드로 표현 | 정보 계층이 사라지고 템플릿처럼 보임 |
| glass morphism, gradient text, gradient orb | 검토 도구에 불필요한 장식 |
보라색 중심 AI 브랜딩과 Powered by AI 배지 |
합의한 색상과 판단 중립성에 어긋남 |
| 네온 글로우와 지속 애니메이션 | 긴 전사문 검토를 방해함 |
| 가짜 진행률 | RTZR 처리 시간을 정확히 예측할 수 없음 |
| fixture 또는 샘플 모드 선택 UI | 사용자 앱은 실제 RTZR 호출만 사용함 |
서버 outputs/ 저장 UI |
브라우저 다운로드와 혼동되고 개인정보가 잔존함 |
- 시작 화면에는 파일 준비와 전사에 필요한 내용만 있는가?
- 전사가 끝난 뒤 화자 확인 depth로 자연스럽게 이동하는가?
- 대표 발화만으로 지원자 화자를 구분할 수 있는가?
- 근거 찾기 화면에서 현재 지원자와 질의를 알 수 있는가?
- 결과가 AI 평가나 추천처럼 보이지 않는가?
- 결과 상세가 별도 페이지가 아니라 같은 depth에서 열리는가?
- 결과 선택 후 답변 시작부터 종료 3초 후의 원음을 재생할 수 있는가?
- 흰색·회색·스카이블루 체계가 일관되며 텍스트 대비가 충분한가?
- 고정 문구가 카피 원칙을 따르는가?
- 뒤로 이동할 때 불필요한 재전사 없이 상태가 보존되는가?
- 검색 결과가 3개 미만일 때 빈 장식을 만들지 않는가?
- 오류 메시지에 복구 행동이 있고 비밀정보는 없는가?