AI 화면 요소 사전

질문을 보내면 AI 말풍선 자리에 점 세 개가 차례로 깜빡이는 생각 중 표시를 보여 주고, 첫 글자가 도착하면 바로 답으로 바꿔 줘. 3초가 넘으면 점 옆에 '생각 중 · 5초'처럼 걸린 시간을 붙여 줘. 표시는 role="status"와 '답을 준비하고 있어요' 글로 화면 읽기 프로그램에 알려 줘.

AI 답을 서버에서 받는 대로 말풍선에 이어 붙여 보여 줘(스트리밍). 끝에는 깜빡이는 커서를 두고, 아래에 '생성 중지' 버튼을 보여 줘. 중지하거나 다 받으면 커서와 버튼을 없애고 복사·다시 생성 버튼을 보여 줘. 화면 읽기 프로그램에는 글자마다 읽히지 않게, 다 끝난 뒤 한 번만 알려 줘.

AI가 여러 단계로 일할 때 답 위에 단계 목록을 보여 줘. 단계마다 이름(예: '항공권 검색')과 상태(대기·진행 중·완료)를 두고, 진행 중은 도는 표시, 완료는 체크로 바꿔 줘. 다 끝나면 '3단계 완료'로 한 줄로 접고 눌러서 다시 펼칠 수 있게 해 줘. 단계가 바뀔 때마다 aria-live로 '2단계 진행 중: 가격 비교'처럼 알려 줘.

AI 답 아래에 이어서 물어볼 만한 질문 3개를 둥근 칩 버튼으로 보여 줘. 칩을 누르면 그 글이 바로 내 질문으로 보내지고, 새 답이 오면 칩도 그 답에 맞게 바뀌게 해 줘. 칩은 한 줄을 넘으면 옆으로 밀어 볼 수 있게 하고, 각 칩은 <button>으로 만들어 줘.

AI 입력창 왼쪽에 클립 모양 첨부 버튼을 두고, 파일을 고르거나 입력창에 끌어다 놓으면 입력창 위에 파일 칩(이름·종류 아이콘·크기)을 보여 줘. 올라가는 동안 칩에 진행률을, 끝나면 × 지우기 버튼을 두고, 다 올라가기 전에는 보내기를 막아 줘. 파일은 20MB까지, 그보다 크면 칩을 빨갛게 하고 이유를 적어 줘.

내 말풍선에 마우스를 올리거나 길게 누르면 연필 모양 '수정' 버튼을 보여 줘. 누르면 말풍선이 입력칸으로 바뀌어 원래 글이 들어 있고, '보내기'를 누르면 그 아래 대화를 지우고 새 질문으로 답을 다시 받아 줘. 고치기 전 대화는 말풍선 아래 '‹ 1/2 ›'로 넘겨 볼 수 있게 남기고, Esc는 고치기를 취소해 줘.

AI 답 아래 도구 줄에 '다시 생성' 버튼(화살표가 도는 아이콘)을 둬. 누르면 같은 질문으로 새 답을 받아 그 자리에 보여 주고, 앞의 답은 지우지 말고 '‹ 2/2 ›' 넘김으로 오가게 해 줘. 넘김 버튼에는 aria-label='이전 답'·'다음 답'을, 숫자에는 '2개 중 2번째 답'을 읽어 줘.

AI 답에서 근거가 있는 문장 끝마다 작은 번호 칩[1]을 붙여 줘. 칩을 누르면 바로 아래에 출처 카드(제목·사이트 또는 파일 이름·쪽수·열기 링크)를 펼치고, 다시 누르면 접어 줘. 답 맨 끝에 '출처 2개' 목록을 모아 두고, 칩에는 aria-label='출처 1: 사내 규정집'처럼 읽히게 해 줘.

AI 답 아래 도구 줄에 엄지 위·엄지 아래 버튼을 둬. 하나를 누르면 채워진 모양으로 바뀌고 다른 하나는 풀려. 엄지 아래를 누르면 '사실과 달라요·너무 길어요·질문과 달라요' 칩과 의견 칸을 펼치고, 보내면 '알려 주셔서 고마워요'로 바꿔 줘. 두 버튼은 aria-pressed와 aria-label='좋은 답'·'아쉬운 답'으로 알려 줘.