ATLASDESIGN REFERENCE GALLERY
ATLAS GALLERY / 2026.10

AI·대화형 서비스

각 항목을 클릭하면 시각 예시·비교·원문을 볼 수 있습니다.

채팅 말풍선 Chat Bubble

대화 메시지를 발신자별로 시각적으로 구분.

AI·대화형 서비스에 해당하는 화면·상태·상호작용을 명세할 때 사용한다.

동일한 명칭도 플랫폼·디자인 시스템마다 세부 동작이 다를 수 있다. 키보드·보조기술·오류 상태를 함께 설계한다.

참고 문서

채팅 입력기 Chat Composer

프롬프트·메시지를 작성하고 첨부하는 영역.

AI·대화형 서비스에 해당하는 화면·상태·상호작용을 명세할 때 사용한다.

동일한 명칭도 플랫폼·디자인 시스템마다 세부 동작이 다를 수 있다. 키보드·보조기술·오류 상태를 함께 설계한다.

참고 문서

스트리밍 응답 Streaming Response

완료된 메시지 대신 생성 중인 응답을 단계적으로 노출.

AI·대화형 서비스에 해당하는 화면·상태·상호작용을 명세할 때 사용한다.

동일한 명칭도 플랫폼·디자인 시스템마다 세부 동작이 다를 수 있다. 키보드·보조기술·오류 상태를 함께 설계한다.

참고 문서

토큰 단위 렌더링 Token-by-token Rendering

생성되는 토큰 조각을 순차적으로 화면에 추가.

AI·대화형 서비스에 해당하는 화면·상태·상호작용을 명세할 때 사용한다.

동일한 명칭도 플랫폼·디자인 시스템마다 세부 동작이 다를 수 있다. 키보드·보조기술·오류 상태를 함께 설계한다.

참고 문서

마크다운 렌더링 Markdown Rendering

마크다운 내용을 제목·표·코드 등으로 변환해 표시.

AI·대화형 서비스에 해당하는 화면·상태·상호작용을 명세할 때 사용한다.

동일한 명칭도 플랫폼·디자인 시스템마다 세부 동작이 다를 수 있다. 키보드·보조기술·오류 상태를 함께 설계한다.

참고 문서

코드 블록 Code Block

복사·하이라이트 등을 지원하는 코드 출력 영역.

AI·대화형 서비스에 해당하는 화면·상태·상호작용을 명세할 때 사용한다.

동일한 명칭도 플랫폼·디자인 시스템마다 세부 동작이 다를 수 있다. 키보드·보조기술·오류 상태를 함께 설계한다.

참고 문서

출처 표시 칩 Citation Chip

AI 응답의 근거 자료를 연결하는 작은 UI 표시.

AI·대화형 서비스에 해당하는 화면·상태·상호작용을 명세할 때 사용한다.

동일한 명칭도 플랫폼·디자인 시스템마다 세부 동작이 다를 수 있다. 키보드·보조기술·오류 상태를 함께 설계한다.

참고 문서

출처 패널 Source Panel

AI가 활용한 근거 문서·링크를 모아 보여줌.

AI·대화형 서비스에 해당하는 화면·상태·상호작용을 명세할 때 사용한다.

동일한 명칭도 플랫폼·디자인 시스템마다 세부 동작이 다를 수 있다. 키보드·보조기술·오류 상태를 함께 설계한다.

참고 문서

도구 실행 카드 Tool Call Card

AI가 호출한 외부 도구의 작업 상태·결과를 표시.

AI·대화형 서비스에 해당하는 화면·상태·상호작용을 명세할 때 사용한다.

동일한 명칭도 플랫폼·디자인 시스템마다 세부 동작이 다를 수 있다. 키보드·보조기술·오류 상태를 함께 설계한다.

참고 문서

에이전트 활동 피드 Agent Activity Feed

도구 실행·진행 단계 등을 시간 순서로 표시.

AI·대화형 서비스에 해당하는 화면·상태·상호작용을 명세할 때 사용한다.

동일한 명칭도 플랫폼·디자인 시스템마다 세부 동작이 다를 수 있다. 키보드·보조기술·오류 상태를 함께 설계한다.

참고 문서

실행 승인 화면 Approval Gate UI

AI가 변경·발송 등 실제 동작 전 사용자 승인을 요청.

AI·대화형 서비스에 해당하는 화면·상태·상호작용을 명세할 때 사용한다.

동일한 명칭도 플랫폼·디자인 시스템마다 세부 동작이 다를 수 있다. 키보드·보조기술·오류 상태를 함께 설계한다.

참고 문서

사용자 개입형 UI Human-in-the-loop UI

자동화 흐름에 승인·수정·재시도 단계를 배치.

AI·대화형 서비스에 해당하는 화면·상태·상호작용을 명세할 때 사용한다.

동일한 명칭도 플랫폼·디자인 시스템마다 세부 동작이 다를 수 있다. 키보드·보조기술·오류 상태를 함께 설계한다.

참고 문서

응답 재생성 Regenerate Response

이전 요청으로 새로운 답변을 다시 생성.

AI·대화형 서비스에 해당하는 화면·상태·상호작용을 명세할 때 사용한다.

동일한 명칭도 플랫폼·디자인 시스템마다 세부 동작이 다를 수 있다. 키보드·보조기술·오류 상태를 함께 설계한다.

참고 문서

생성 중단 Stop Generation

스트리밍 응답을 사용자가 즉시 멈추는 동작.

AI·대화형 서비스에 해당하는 화면·상태·상호작용을 명세할 때 사용한다.

동일한 명칭도 플랫폼·디자인 시스템마다 세부 동작이 다를 수 있다. 키보드·보조기술·오류 상태를 함께 설계한다.

참고 문서

프롬프트 추천 Prompt Suggestion

사용 가능한 질문·명령 예시를 제안.

AI·대화형 서비스에 해당하는 화면·상태·상호작용을 명세할 때 사용한다.

동일한 명칭도 플랫폼·디자인 시스템마다 세부 동작이 다를 수 있다. 키보드·보조기술·오류 상태를 함께 설계한다.

참고 문서

후속 질문 추천 Follow-up Suggestion

현재 답변과 연결되는 다음 탐색 경로 제공.

AI·대화형 서비스에 해당하는 화면·상태·상호작용을 명세할 때 사용한다.

동일한 명칭도 플랫폼·디자인 시스템마다 세부 동작이 다를 수 있다. 키보드·보조기술·오류 상태를 함께 설계한다.

참고 문서

대화 기록 Conversation History

과거 대화를 목록·검색·재진입 방식으로 관리.

AI·대화형 서비스에 해당하는 화면·상태·상호작용을 명세할 때 사용한다.

동일한 명칭도 플랫폼·디자인 시스템마다 세부 동작이 다를 수 있다. 키보드·보조기술·오류 상태를 함께 설계한다.

참고 문서

기억 상태 표시 Memory Indicator

사용자 컨텍스트의 적용·저장 상태를 알림.

AI·대화형 서비스에 해당하는 화면·상태·상호작용을 명세할 때 사용한다.

동일한 명칭도 플랫폼·디자인 시스템마다 세부 동작이 다를 수 있다. 키보드·보조기술·오류 상태를 함께 설계한다.

참고 문서

확신도 표시 Confidence Indicator

시스템 추정의 불확실성을 적절히 설명하는 UI.

AI·대화형 서비스에 해당하는 화면·상태·상호작용을 명세할 때 사용한다.

동일한 명칭도 플랫폼·디자인 시스템마다 세부 동작이 다를 수 있다. 키보드·보조기술·오류 상태를 함께 설계한다.

참고 문서

AI & Conversational Services

Open an entry for its visual reference, comparisons and source-language text.

Chat Bubble 채팅 말풍선

A visual container distinguishing conversation messages by sender.

Specifying AI and conversational-service interfaces.

Detailed behavior can differ across platforms and design systems despite identical names. Design keyboard, assistive-technology, and error behavior together.

Reference

Chat Composer 채팅 입력기

The area for composing prompts or messages and adding attachments.

Specifying AI and conversational-service interfaces.

Detailed behavior can differ across platforms and design systems despite identical names. Design keyboard, assistive-technology, and error behavior together.

Reference

Streaming Response 스트리밍 응답

Progressively revealing a response while it is being generated rather than waiting for completion.

Specifying AI and conversational-service interfaces.

Detailed behavior can differ across platforms and design systems despite identical names. Design keyboard, assistive-technology, and error behavior together.

Reference

Token-by-token Rendering 토큰 단위 렌더링

Adding generated token fragments to the interface in sequence.

Specifying AI and conversational-service interfaces.

Detailed behavior can differ across platforms and design systems despite identical names. Design keyboard, assistive-technology, and error behavior together.

Reference

Markdown Rendering 마크다운 렌더링

Displaying Markdown as formatted headings, tables, code, and other content.

Specifying AI and conversational-service interfaces.

Detailed behavior can differ across platforms and design systems despite identical names. Design keyboard, assistive-technology, and error behavior together.

Reference

Code Block 코드 블록

A code display area that may support copying and syntax highlighting.

Specifying AI and conversational-service interfaces.

Detailed behavior can differ across platforms and design systems despite identical names. Design keyboard, assistive-technology, and error behavior together.

Reference

Citation Chip 출처 표시 칩

A compact interface element linking an AI response to supporting material.

Specifying AI and conversational-service interfaces.

Detailed behavior can differ across platforms and design systems despite identical names. Design keyboard, assistive-technology, and error behavior together.

Reference

Source Panel 출처 패널

A panel collecting the source documents or links used by an AI system.

Specifying AI and conversational-service interfaces.

Detailed behavior can differ across platforms and design systems despite identical names. Design keyboard, assistive-technology, and error behavior together.

Reference

Tool Call Card 도구 실행 카드

A card showing the status or result of an external tool called by an AI system.

Specifying AI and conversational-service interfaces.

Detailed behavior can differ across platforms and design systems despite identical names. Design keyboard, assistive-technology, and error behavior together.

Reference

Agent Activity Feed 에이전트 활동 피드

A chronological feed of tool executions and other agent progress events.

Specifying AI and conversational-service interfaces.

Detailed behavior can differ across platforms and design systems despite identical names. Design keyboard, assistive-technology, and error behavior together.

Reference

Approval Gate UI 실행 승인 화면

An interface asking for user approval before an AI takes a consequential action.

Specifying AI and conversational-service interfaces.

Detailed behavior can differ across platforms and design systems despite identical names. Design keyboard, assistive-technology, and error behavior together.

Reference

Human-in-the-loop UI 사용자 개입형 UI

An interface placing approval, editing, or retry steps within an automated flow.

Specifying AI and conversational-service interfaces.

Detailed behavior can differ across platforms and design systems despite identical names. Design keyboard, assistive-technology, and error behavior together.

Reference

Regenerate Response 응답 재생성

Generating a new response to a previous request.

Specifying AI and conversational-service interfaces.

Detailed behavior can differ across platforms and design systems despite identical names. Design keyboard, assistive-technology, and error behavior together.

Reference

Stop Generation 생성 중단

An action allowing the user to immediately stop a streaming response.

Specifying AI and conversational-service interfaces.

Detailed behavior can differ across platforms and design systems despite identical names. Design keyboard, assistive-technology, and error behavior together.

Reference

Prompt Suggestion 프롬프트 추천

Suggested examples of usable questions or commands.

Specifying AI and conversational-service interfaces.

Detailed behavior can differ across platforms and design systems despite identical names. Design keyboard, assistive-technology, and error behavior together.

Reference

Follow-up Suggestion 후속 질문 추천

Suggested next steps or queries related to the current response.

Specifying AI and conversational-service interfaces.

Detailed behavior can differ across platforms and design systems despite identical names. Design keyboard, assistive-technology, and error behavior together.

Reference

Conversation History 대화 기록

A system for listing, searching, and reopening earlier conversations.

Specifying AI and conversational-service interfaces.

Detailed behavior can differ across platforms and design systems despite identical names. Design keyboard, assistive-technology, and error behavior together.

Reference

Memory Indicator 기억 상태 표시

An indicator showing whether user context is being applied or saved.

Specifying AI and conversational-service interfaces.

Detailed behavior can differ across platforms and design systems despite identical names. Design keyboard, assistive-technology, and error behavior together.

Reference

Confidence Indicator 확신도 표시

An interface that appropriately communicates uncertainty in a system estimate.

Specifying AI and conversational-service interfaces.

Detailed behavior can differ across platforms and design systems despite identical names. Design keyboard, assistive-technology, and error behavior together.

Reference