피그마 프로토타입대로 작동하지 않는 AI UX — '확률적 인터페이스'를 위한 디자인 시스템의 부재

결정론적 UI 패턴의 한계를 넘어, AI의 불확실성과 신뢰도를 시각화하는 '판단 UI(Judgment UI)'로의 전환 전략

현장에서 디자이너분들과 이야기하다 보면 이런 말씀을 정말 많이 하세요. “피그마로 프로토타입 다 짰고 개발팀에 넘겼는데, 실제 제품은 다르게 작동해요.” 사실 전통적인 UX에서는 상상하기 힘든 일이죠. 피그마로 그린 대로 화면이 나오고, 버튼을 누르면 정해진 페이지로 이동하는 게 당연했으니까요. 하지만 AI UX는 완전히 다릅니다. 레이아웃은 프로토타입할 수 있어도, 그 ‘행동(Behavior)’ 자체는 프로토타입할 수 없거든요 [1].

우리가 그동안 믿어온 디자인 시스템은 모든 경로가 예측 가능한 ‘결정론적 시스템’을 위해 설계되었습니다. 하지만 AI 시대의 UX는 모델의 확신도와 가변성을 다루는 ‘확률적 상태(Probabilistic States)’ 레이어를 반드시 포함해야 합니다. 이제는 “이렇게 작동해야 한다”가 아니라, “이 정도의 확률로 이렇게 작동할 수 있다”를 디자인해야 하는 시점이 온 거죠.

결정론적 UX vs 확률적 UX: 우리가 믿어온 ‘약속’의 붕괴

지금까지의 UX 디자인은 기본적으로 ‘결정론적(Deterministic)’ 구조였습니다. 사용자가 A 버튼을 누르면 시스템은 반드시 B라는 결과를 내놓는 1:1 매칭의 세계였죠. “저장 버튼을 누르면 저장이 되고, 에러가 나면 정해진 메시지가 뜬다”는 약속이 전제되어 있었습니다. 덕분에 우리는 모든 유저 저니(User Journey)를 매핑하고 엣지 케이스를 테스트하며 완벽한 설계도를 만들 수 있었습니다 [1].

그런데 AI UX는 완전히 다른 현실에서 작동합니다. 동일한 질문을 던져도 모델의 업데이트 상태, 입력된 컨텍스트, 학습 데이터에 따라 매번 다른 결과가 나올 수 있는 ‘확률적(Probabilistic)’ 구조이기 때문입니다.

“Deterministic design assumes the system is fully knowable before it ships, whereas AI UX operates in a different reality where the same query can throw up different answers.” [1]

결정론적 디자인은 출시 전에 시스템을 완전히 파악할 수 있다고 가정하지만, AI UX는 동일한 쿼리에도 다른 답변이 나올 수 있는 전혀 다른 현실에서 작동합니다.

여기서 위험한 점은 많은 팀이 여전히 전통적인 UX 기준으로 프로젝트 범위를 잡는다는 거예요. 화면 설계서와 플로우차트만으로 일정을 짜면, 런칭 후에야 “모델 확신도가 40%일 때 화면에 어떻게 보여줘야 하지?”라는 질문이 튀어나옵니다. 결국 폴백(Fallback) 경로를 다시 설계하고 UI를 수정하느라 예산과 일정이 걷잡을 수 없이 늘어나는 상황이 반복되곤 하죠 [1].

실행 UI(Execution UI)에서 판단 UI(Judgment UI)로의 패러다임 시프트

그럼 우리는 무엇을 디자인해야 할까요? 저는 여기서 ‘실행 UI’에서 ‘판단 UI’로 관점을 전환하는 것이 가장 중요하다고 봅니다.

그동안의 UI는 인간이 직접 데이터를 입력하고 규칙을 설정하는 ‘실행(Execution)’의 도구였습니다. 폼에 이름을 쓰고, 날짜를 선택하고, 저장 버튼을 누르는 식이죠. 하지만 AI가 이 실행 단계를 대신해주면서, 이제 인간의 역할은 AI가 한 일이 맞는지 ‘검토’하고 ‘가이드’하는 것으로 변하고 있습니다.

실행 UI (Execution UI): 데이터 입력, 규칙 설정 등 인간이 직접 수행하는 인터페이스. 이제는 점점 축소되는 추세입니다 [2].
판단 UI (Judgment UI): AI의 결과물을 평가하고, 수정하고, 최종 승인하는 인터페이스. 앞으로 우리가 훨씬 더 많이 투자해야 할 영역이죠 [2].

실제 사례를 들어볼까요? 예전의 비용 처리 시스템은 사용자가 영수증을 보고 일일이 항목을 입력하는 ‘실행 UI’였습니다. 하지만 AI UX에서는 AI가 영수증에서 데이터를 추출해 미리 채워놓고, 사용자는 “내가 찾은 내용이 이건데, 맞는지 확인하거나 수정해줘”라는 메시지와 함께 ‘차이점(Diff View)’을 확인하는 ‘판단 UI’로 바뀝니다 [2].

여기서 ‘판단 UI’의 구체적인 모습은 단순히 ‘확인’ 버튼 하나가 아닙니다. 예를 들어, AI가 추출한 텍스트 위에 마우스를 올리면 원본 영수증의 어느 영역에서 이 데이터를 가져왔는지 하이라이트해주는 ‘근거 시각화(Grounding Visualization)’나, 확신도가 낮은 항목만 붉은색 테두리로 표시해 사용자의 시선을 유도하는 ‘주의 집중 설계’가 포함되어야 합니다. 결국 사용자가 ‘입력’하는 시간을 줄이고, AI의 결과물을 ‘판단’하는 시간을 최적화하는 것이 AI UX의 핵심입니다.

디자인 시스템에 추가해야 할 ‘AI 상태(AI States)’ 레이어

이제 디자인 시스템 운영자분들이 고민하셔야 할 지점입니다. 기존의 Default, Hover, Active, Disabled 같은 상태값만으로는 AI의 불확실성을 담아낼 수 없습니다. 컴포넌트 레벨에서 ‘AI 상태’라는 새로운 레이어를 추가해야 합니다.

가장 먼저 도입해야 할 것은 ‘신뢰도 기반 시각화’입니다. AI가 내놓은 답이 95% 확신인지, 40% 추측인지에 따라 시각적 상태를 다르게 정의하는 거죠. 예를 들어, 확신도가 높은 필드는 일반 텍스트로 보여주고, 임계값(Threshold)보다 낮은 필드는 배경색을 연한 노란색으로 변경하거나 ‘?’ 아이콘을 배치해 “사람의 검토가 필요함”을 명시적으로 알려주는 식입니다 [2].

또한, 다음과 같은 설계 요소들이 디자인 시스템의 표준이 되어야 합니다.

1. Fallback 아키텍처: AI가 답을 내지 못하거나 확신도가 너무 낮을 때의 시나리오를 설계해야 합니다. 단순히 “결과를 찾을 수 없습니다”라는 메시지를 띄우는 것이 아니라, ‘유사한 추천 결과 제시’ $\rightarrow$ ‘수동 입력 폼으로 전환’ $\rightarrow$ ‘전문 상담원 연결’ 순으로 이어지는 단계적 폴백 경로를 컴포넌트화하여 배치해야 합니다 [1]. 2. 불확실성의 소통: 시스템이 “모른다”거나 “추측 중이다”라는 것을 사용자에게 어떻게 정직하게 알릴 것인가에 대한 가이드라인이 필요합니다. “정답은 ~입니다”라는 단정적 표현 대신, “데이터에 기반해 볼 때 ~일 가능성이 높습니다”라는 완곡한 표현의 텍스트 컴포넌트를 정의하는 식입니다 [1]. 3. 인간 개입 지점(Human-in-the-loop): AI의 자율성에 모든 것을 맡기지 않고, 결정적인 순간에 인간이 개입해 통제권을 행사할 수 있는 장치를 배치해야 합니다. 예를 들어, AI가 자동으로 메일을 발송하기 전 ‘최종 승인 단계’를 강제하는 인터럽트 UI나, AI의 추론 과정을 단계별로 펼쳐볼 수 있는 ‘아코디언 뷰’ 등이 이에 해당합니다.

짚고 넘어갈 한계와 안티패턴

의욕이 앞서다 보면 흔히 저지르는 실수들이 있습니다. 가장 대표적인 게 모든 기능을 채팅창 하나로 밀어 넣는 ‘Chat-everything’ 접근법이에요. 하지만 모든 인터랙션을 채팅으로 처리하는 건 오히려 효율성을 떨어뜨립니다. 때로는 잘 설계된 판단 UI(예: Diff View)가 백 번의 채팅보다 훨씬 빠르거든요.

또 하나 위험한 건, AI의 확률적 출력을 마치 결정론적인 정답인 것처럼 보여주는 것입니다. 사용자에게 과도한 신뢰를 줬다가 환각(Hallucination) 현상으로 오답이 나왔을 때, 사용자가 느끼는 배신감은 훨씬 큽니다.

마지막으로 에러 핸들링을 단순히 “시스템 오류가 발생했습니다”라고 처리하는 것도 안티패턴입니다. AI UX에서는 ‘서버 오류’와 ‘AI의 추론 실패(오답/환각)’를 명확히 구분해서 대응해야 합니다. 전자는 기술적 복구가 필요하지만, 후자는 프롬프트 수정이나 데이터 보강, 혹은 사용자 가이드 변경이 필요하기 때문입니다. 이 차이를 무시하고 전통적인 UX 기준으로 제품을 런칭하면, 사용자는 몇 주 안에 제품을 떠나게 될 가능성이 높습니다 [1].

물론 모든 AI 제품에 이런 복잡한 패턴이 필요한 건 아닙니다. AI가 백엔드에서 추천 랭킹이나 콘텐츠 모더레이션만 수행하고, 사용자에게 그 불확실성이 노출되지 않는다면 기존의 결정론적 UX로도 충분합니다 [1]. 핵심은 ‘모델의 확신도가 사용자의 다음 결정에 영향을 주는가’입니다.

핵심 요약

AI UX는 정해진 답을 보여주는 것이 아니라, 확률적 시스템을 설계하는 일입니다.
디자인의 중심이 직접 수행하는 ‘실행(Execution)’에서 AI의 결과물을 검토하는 ‘판단(Judgment)’으로 옮겨가고 있습니다.
디자인 시스템에 ‘확신도(Confidence)’라는 속성을 추가하고, 이에 따른 시각적 상태와 폴백 경로를 반드시 정의하세요.
피그마의 정적인 화면보다는, 모델 출력값에 따라 UI가 어떻게 변하는지 ‘가변성’과 ‘상태 전이’에 집중해야 합니다.
AI의 행동은 런칭 후에도 계속 변하므로, 지속적인 관찰과 UI 수정 사이클을 프로젝트 예산과 일정에 미리 반영해두세요.

결론적으로, AI 시대의 디자이너는 ‘완벽한 경로를 설계하는 설계자’에서 ‘시스템의 가변성을 관리하는 오케스트레이터’로 진화해야 합니다. 모든 엣지 케이스를 미리 그려내려는 강박에서 벗어나, 모델의 불확실성이 사용자에게 스트레스가 아닌 ‘합리적인 가이드’로 전달될 수 있는 유연한 프레임워크를 구축하는 것이 실무적인 핵심입니다. 결국 AI UX의 성패는 기술의 정교함이 아니라, 그 불확실성을 얼마나 체계적이고 우아하게 인터페이스에 녹여내느냐에 달려 있습니다.

References

1. [fuselabcreative.com] AI UX vs Traditional UX: Five Shifts That Break Design — https://fuselabcreative.com/ai-ux-vs-traditional-ux-design 2. [syntaxstream.substack.com] 10 UI Patterns That Won’t Survive the AI Shift — https://syntaxstream.substack.com/p/10-ui-patterns-that-wont-survive

FAQ

전통적인 UX 디자인과 AI UX 디자인의 가장 큰 차이점은 무엇인가요?

전통적인 UX는 사용자가 특정 행동을 하면 정해진 결과가 나오는 '결정론적(Deterministic)' 구조인 반면, AI UX는 동일한 입력에도 모델의 상태나 컨텍스트에 따라 결과가 달라질 수 있는 '확률적(Probabilistic)' 구조라는 점이 가장 큰 차이입니다.

'실행 UI'와 '판단 UI'는 각각 무엇을 의미하나요?

실행 UI는 사용자가 직접 데이터를 입력하고 규칙을 설정하는 인터페이스이며, 판단 UI는 AI가 생성한 결과물을 사용자가 평가, 수정, 최종 승인하는 인터페이스를 의미합니다.

AI 디자인 시스템에 추가해야 할 'AI 상태(AI States)' 레이어에는 어떤 것들이 있나요?

AI의 확신도에 따른 '신뢰도 기반 시각화', AI가 답을 내지 못했을 때의 'Fallback 아키텍처', 시스템의 불확실성을 정직하게 알리는 '불확실성의 소통', 그리고 결정적 순간에 인간이 개입하는 '인간 개입 지점(Human-in-the-loop)' 등이 포함되어야 합니다.

AI UX 설계 시 피해야 할 안티패턴은 무엇인가요?

모든 기능을 채팅창 하나로 처리하려는 'Chat-everything' 접근법, AI의 확률적 출력을 결정론적인 정답처럼 보여주는 것, 그리고 '서버 오류'와 'AI의 추론 실패'를 구분하지 않고 단순한 시스템 오류로 처리하는 것이 대표적인 안티패턴입니다.

AI UX에서 '근거 시각화(Grounding Visualization)'란 무엇인가요?

판단 UI의 일환으로, AI가 추출한 데이터가 원본의 어느 영역에서 가져온 것인지 하이라이트 등을 통해 사용자에게 시각적으로 보여줌으로써 AI의 결과물을 더 쉽게 검토할 수 있게 돕는 설계 방식입니다.

정보로부자되세요(정보부자:Infobuza.com)

피그마 프로토타입대로 작동하지 않는 AI UX — ‘확률적 인터페이스’를 위한 디자인 시스템의 부재