AI는 어디에 둘까? UI 속 위치가 만드는 사용자 경험

본문은 요즘 IT와 번역가 Yuna가 함께한 샤랑 샤르마(Sharang Sharma)의 글 <Where should AI sit in your UI?>을 번역한 글입니다. 그는 10년 넘게 프로덕트 디자인 분야에서 활동하며, 공학과 예술을 넘나들며 도구와 사용자 경험의 관계를 탐구해 왔습니다. 이 글에서는 AI가 UI에서 어디에 배치되느냐에 따라 사용자는 그것을 단순 도우미로 볼지, 창의적 파트너로 인식할지 달라진다고 말합니다. 또 다양한 레이아웃을 통해 AI의 ‘위치’가 경험을 어떻게 설계하는지를 보여줍니다.

필자에게 허락을 받고 번역했으며, 글에 포함된 링크는 원문에 따라 표시했습니다.

거대 언어 모델(LLM)과 AI 에이전트의 등장은 챗봇처럼 익숙한 UI 패턴을 한층 고도화시켰습니다. 하지만 이제는 새로운 인터페이스 레이아웃의 물결이 본격적으로 나타나고 있습니다. 진짜 기회는, AI를 단순한 보조 도구로 두는 것이 아니라 복잡하고 목적 지향적인 인터페이스 안에 더 깊숙이 녹여내는 데 있습니다. 우측 패널 어시스턴트, 무한 캔버스, 의미 기반 스프레드시트 같은 공간적 UI 선택은 단순한 디자인 결정이 아니라, 사용자가 AI를 어떻게 발견하고, 신뢰하며, 상호작용할지를 근본적으로 정의하는 요소입니다.

이 글에서는 최근 주목받는 7가지 UI 레이아웃을 통해, 각 구조 속에서 AI가 어떤 역할을 맡고 있으며, 그에 따라 사용자의 행동과 기대가 어떻게 변화하는지를 살펴봅니다. 핵심은 AI의 위치, 상호작용 방식, 역할이 어떻게 UX를 재정의하는지에 있습니다.

1. 작은 창에서 말을 걸면 답해주는 고객 상담 챗봇

화면 오른쪽 아래에 떠 있는 챗봇은 ‘Zendesk’나'Intercom'과 같은 플랫폼을 통해 오랫동안 고객지원의 기본 UI로 사용되어 왔습니다.

화면 내 배치

우측 하단에 고정된 위치는 사용자가 쉽게 발견할 수 있으면서도, 전체 화면을 방해하지 않는 자연스러운 시각 요소로 작동했습니다.

상호작용 방식

챗봇 위젯은 보조적이며 비동기적인 인터페이스로, 사용자가 필요할 때 열고 닫을 수 있습니다. 빠르게 질문하고 간단히 해결하는 가벼운 지원 요청에 적합하죠.

역할

이 구조에서 AI는 여전히 정해진 작업을 반응형으로 처리하는 조력자로 인식됩니다. 과거에는 규칙 기반으로만 작동했지만, 이제는 문맥을 기억하고, 답변을 개인화하며, 주문 조회나 비밀번호 재설정과 같은 백엔드 업무도 자동으로 수행할 수 있게 되었습니다.

한계

공간 제약이 크기 때문에, 다단계 추론이나 창의적인 공동 작업처럼 더 복잡한 흐름에는 적합하지 않습니다.

2. 글 쓰는 중 조용히 제안하는 인라인 도우미

Notion,Grammarly AI처럼, 인라인 프롬프트는 텍스트나 콘텐츠 영역 안에서 바로 등장해 사용자의 흐름을 방해하지 않으면서도 생산성과 편집 효율을 높여줍니다.

화면 내 배치

이런 프롬프트는 밑줄, 마우스 오버 아이콘, 팝오버 등 눈에 잘 띄지 않는 방식으로 나타납니다. 타이핑하거나 텍스트를 선택하거나 마우스를 올리는 등의 사용자 행동에 반응해 자연스럽게 드러나죠.

상호작용 방식

인라인 프롬프트는 동적으로 작업을 보조하는 도구로 작동합니다. 사용자는 제안을 바로 수락하거나 수정하고, 되돌리거나 다시 생성할 수 있습니다. 별도 인터페이스 전환 없이 즉시 반응하며 AI와 상호작용할 수 있기 때문에, 작업 흐름을 끊지 않고 주도권도 유지할 수 있습니다.

역할

이 구조에서 AI는 세심하게 보조하는 “정확한 어시스턴트”로 인식됩니다. 문장을 매끄럽게 바꾸거나 단락을 요약하고, 실시간 입력을 바탕으로 텍스트나 코드 조각을 완성하기도 하죠. 예를 들어, Grammarly는 사용자가 작성 중인 문장의 어조, 스타일, 대상, 목적까지 파악해 문맥에 꼭 맞는 제안을 제공합니다.

한계

이런 방식은 개방형 탐색이나, 넓은 맥락 이해와 단계적인 논리가 필요한 복잡한 작업에는 잘 맞지 않습니다.

3. 화면 위에 같이 그려나가는 무한 캔버스 협업자

무한 캔버스(Infinite Canvas)라는 개념은 2000년, 스콧 맥클라우드가 『Reinventing Comics』에서 처음 제안했습니다. 그는 종이 페이지의 제약에서 벗어나 어떤 방향으로든 자유롭게 이어지는 디지털 스토리텔링을 상상했죠. 이 아이디어는 이후 ‘TLDraw’,‘Figma’, ‘Miro’ 같은 도구로 확장되며, 사방으로 펼쳐지는 이차원 작업 공간을 통해 시각적 사고와 탐색 기반 워크플로우를 지원하는 UI 형태로 발전했습니다.

화면 내 배치

AI 기능은 포스트잇, 텍스트, 도형 등 캔버스 오브젝트 위에 마우스를 올리거나 선택할 때처럼 맥락에 따라 자연스럽게 나타나는 방식으로 노출됩니다.

상호작용 방식

사용자는 특정 요소에 비동기적으로 프롬프트를 입력해 텍스트를 생성하거나, 레이어 이름을 바꾸고, 레이아웃을 제안받을 수 있습니다. 전체 흐름을 끊지 않고, 원하는 위치에 AI를 호출할 수 있어 작업 몰입도를 유지하기에 좋습니다. 특히 챗 기반 인터페이스와 달리, 하나의 캔버스 안에서 여러 LLM 호출을 병렬로 실행할 수 있다는 점이 강점입니다. 예를 들어, TLDraw에서는 스케치, 텍스트, 라벨 등을 자유롭게 배치한 뒤, 여러 영역에서 AI를 각각 호출해 주변 콘텐츠와 상호작용하도록 설계할 수 있죠.

역할

이 구조에서 AI는 선형 흐름보다 공간적 맥락에 반응하는 “창의적 협업자”로 인식됩니다. 아이디어 생성, 콘텐츠 다듬기, 레이아웃 구성, 시각적 보완 등에 관여하며, 캔버스 자체를 하나의 프롬프트 공간으로 삼아 사용자와 함께 작업을 완성해 나가는 동료처럼 기능합니다.

한계

다만 이런 구조는 버전 관리가 중요하거나, 문서 전체 맥락을 인식해야 하는 작업에는 적합하지 않을 수 있습니다. 무한 캔버스 기반의 AI는 보통 국소적인 객체 단위로 작동하기 때문에, 전체 작업 공간을 포괄하는 이해나 논리적 일관성 유지에는 다소 약한 측면이 있습니다.

4. 중앙에서 뭐든 도와주는 만능 AI 어시스턴트

이 인터페이스는 AI를 사용자 경험의 중심에 배치한 구조로, 전체 너비의 세로형 창에 입력창과 대화 흐름이 쌓이는 형태로 구성됩니다. ‘ChatGPT’, ‘Perplexity’,‘Midjourney(Discord 기반)’ 등에서 자주 볼 수 있으며, 프롬프트 입력을 중심으로 자유롭게 상호작용하는 방식에 최적화되어 있습니다.

화면 내 배치

전체적으로 단순한 인터페이스에 입력창이 중심에 배치되어, 사용자가 자연스럽게 대화를 시작할 수 있도록 설계되어 있습니다. 플레이스홀더 텍스트, 이전 대화 내용, 예시 프롬프트 등이 탐색을 유도하죠.

상호작용 방식

사용자는 자유롭게 질문하거나 명령어를 입력한 뒤, 후속 질문이나 조건 조정, 프롬프트 수정을 통해 출력을 반복적으로 다듬어갑니다. 속도나 흐름을 사용자가 직접 조절할 수 있어, 스스로 주도하는 탐색이 가능합니다.

역할

이 구조에서 AI는 글쓰기, 코딩, 디자인, 리서치 등 다양한 영역을 지원하는 “만능 어시스턴트”로 인식됩니다. 넓은 활용 범위와 높은 적응력, 창의적인 대응이 주요 강점으로 작용하죠.

한계

다만 이 구조는 앱 제작이나 폼 작성, 복잡한 의사결정처럼 단계가 명확한 작업이나 구조화된 워크플로우에는 적합하지 않습니다.

5. 왼쪽에서 아이디어를 함께 발전시키는 창작 파트너

이 레이아웃에서는 AI 어시스턴트가 화면 왼쪽의 고정 패널에 배치되어, 콘텐츠, 코드, 구조화된 출력물을 함께 만들어가는 지속적인 협업 엔진으로 작동합니다. ChatGPT Canvas,Lovable 같은 도구들이 이 구조를 채택해 복잡하고 반복적인 작업 흐름을 효과적으로 지원하고 있죠.

화면 내 배치

왼쪽 패널은 ‘사용자의 F자형 시선 흐름’에 자연스럽게 위치하여 협업 흐름을 방해하지 않고 기능을 지속적으로 제공합니다. 대화창, 프롬프트 설정, 세션 기록 등이 이곳에 함께 구성되어 있어 AI와의 상호작용을 언제든 끊김 없이 이어갈 수 있습니다.

상호작용 방식

사용자는 프롬프트를 입력하고 결과를 수정하거나 재요청하면서, 오른쪽 작업 공간에 실시간으로 결과가 반영되는 구조에서 반복적으로 결과를 다듬습니다. 대화와 작업 공간이 나뉘어 있어, 대화 기반 창작 과정이 자연스럽게 이어집니다.

역할

여기서 AI는 단순 보조가 아닌, 전략적 공동 창작자로 인식됩니다. 아이디어를 함께 발전시키고, 작업을 구조화하며, 방향을 제시하는 등 사용자의 사고 과정을 함께 구체화하는 동료에 가깝죠. 또한, 문맥을 이해하고 상황에 맞는 대응을 제공하는 능력도 강조됩니다.

한계

이 구조는 단순 작업에는 오히려 과할 수 있고, 모바일 환경처럼 화면이 좁을 경우 사용성이 떨어질 수 있습니다. 특히 모호한 프롬프트를 입력하면, Lovable과 같은 코드 생성기에서 발생하는 예상치 못한 오류가 생길 수 있습니다.

6. 오른쪽에서 맥락 읽고 조용히 도와주는 전문가

이 레이아웃에서는 AI 어시스턴트가 화면 오른쪽의 접이식 패널에 배치되어, 사용자가 복잡한 주요 작업에 몰입한 상태에서도 필요할 때마다 조용히 호출할 수 있는 맞춤형 도우미로 작동합니다.Microsoft Copilot(Office 앱), GitHub Copilot, Gmail Gemini, Cursor 등에서 이 구조가 점점 보편적으로 사용되고 있죠.

화면 내 배치

오른쪽 패널은 시야의 주변부에 위치해 작업 흐름을 방해하지 않으면서도 언제든 호출할 수 있는 접근성을 제공합니다. 필요할 때만 열 수 있어 부담 없이 활용할 수 있죠.

상호작용 방식

사용자는 특정 순간에 AI를 호출해 요약, 초안 작성, 변환, 디버깅 등 다양한 작업을 요청합니다. 이 구조는 사용자의 리듬을 존중하며, 요청이 있을 때만 응답하는 비주도형 구조입니다.

역할

여기서 AI는 단순한 비서가 아닌, “깊이 있는 문맥 전문가”로 인식됩니다. 상황에 맞춰 분석하고 추론을 바탕으로 맞춤형 지원을 제공하죠. 예를 들어, 프레젠테이션 자동 생성, 커뮤니케이션 정리, 대규모 코드베이스의 이해와 지원 등 고난도 작업에서 실질적인 도움을 주는 능력이 특징입니다.

한계

반면 이 구조는 프롬프트 입력이 중심이 되는 AI 기반 환경에는 적합하지 않습니다. 사용자가 주도적으로 AI에게 요청하며 시작하는 구조가 아니기 때문이죠. 또한 인터페이스가 눈에 잘 띄지 않아, AI에 익숙하지 않은 사용자라면 존재 자체를 인지하지 못할 수도 있습니다.

7. AI가 채워주는 스마트 스프레드시트

이제 스프레드시트가 단순한 표나 계산용 도구를 넘어, 질문을 던지고 정보를 탐색하며 의미를 이해하는 지능형 작업 공간으로 진화하고 있습니다. 예를 들어, AnswerGrid,Elicit 같은 도구는 기존의 익숙한 표 형식을 기반으로, AI가 내용을 분석하고 생성하는 동적인 시스템으로 바꾸고 있죠.

존 마에다는 이런 흐름을 ‘시맨틱 스프레드시트(Semantic Spreadsheet)’, 즉 의미를 이해하는 스프레드시트라는 개념으로 설명했습니다. 이 개념에서는 각 셀이 단순히 수식만 계산하는 것이 아니라, 셀 안의 내용이 어떤 의미인지 이해하고, 문맥에 맞춰 스스로 반응하거나 정보를 제안하는 똑똑한 셀로 작동합니다. 말하자면, 스프레드시트 안에 작은 AI들이 셀마다 들어가 있는 셈이죠.

화면 내 배치

행, 열, 셀로 구성된 전통적인 스프레드시트 구조는 그대로 유지하면서, 상단 입력창에 질문이나 프롬프트를 입력하면 각 셀이 자동으로 관련 데이터를 수집해 채워 넣는 방식입니다.

상호작용 방식

사용자는 원하는 질문을 입력하거나 컬럼 기준을 설정해 결과를 받아볼 수 있습니다. 그리드의 이면에서는 여러 AI가 동시에 웹을 탐색하고, 정보를 분석해, 셀마다 정리된 결과를 삽입하죠. 즉, 스프레드시트 전체가 프롬프트이자 출력 창이 되는 구조입니다.

역할

여기서 AI는 “분산형 리서치 에이전트”로 작동합니다. AnswerGrid에서는 실시간 웹 정보를 수집하고, Elicit는 과학 논문을 바탕으로 ‘살아있는 문서’를 생성하며, 각 행의 내용을 자동으로 분석하고 정리해 줍니다. 이러한 구조에서는 각 셀이 하나의 작은 에이전트처럼 작동하며, 전체적으로 보면 지능형 시스템을 구성하는 하나의 단위로 기여하는 셈이죠.

한계

이 구조는 리서치, 데이터 분석, 구조화된 정보 정리에 매우 유용하지만, 원하는 결과의 구조를 명확히 설정할 수 있어야 합니다. 또한 스프레드시트나 데이터 워크플로에 익숙하지 않은 사용자에게는 진입 장벽이 높게 느껴질 수 있습니다.

마치며

LLM은 더 이상 단순한 질문에 답하는 도구가 아닙니다. 이제 우리는 이를 새로운 컴퓨팅 매체로 바라보기 시작해야 합니다. GUI, 웹, 모바일 인터페이스가 디자인의 기준을 완전히 바꿨던 것처럼, LLM 역시 제품 속 지능이 어떤 위치에, 어떤 방식으로 동작해야 하는지에 대한 기준을 다시 세우고 있죠. AI가 무엇을 말하느냐보다, 어디에 놓이고, 어떻게 호출되며, 어떤 흐름으로 사용자를 이끄는가가 더 중요해지고 있습니다.

챗봇, 사이드 패널, 의미 기반 그리드, 무한 캔버스 같은 UI 구성은 단순한 스타일이 아니라, AI의 역할과 신뢰도, 활용성까지 결정짓는 핵심 설계 요소입니다. 앞으로는 AI가 무엇을 할 수 있는지만큼, 어떤 방식으로 사용자 경험 안에 녹아들어야 하는지를 고민하는 일이 중요해질 것입니다.

<원문>

Where should AI sit in your UI?

©위 번역글의 원 저작권은 Sharang Sharma에게 있으며, 저작권법의 보호를 받는 바, 무단 전재와 복사, 배포 등을 금합니다