안녕하세요, X-Design Center에서 AI Agent UX/UI Guide 기획을 담당한 조여은입니다.

  KT는 최근 다양한 AI Agent 기반 서비스를 빠르게 확장해왔어요. 하지만 서비스마다 화면 구조와 용어, 사용자 여정이 제각각이라 사용자는 혼란을 느끼고, 새로운 서비스를 만들때마다 매번 새로운 구조를 다시 만들어야 하는 부담이 있었어요.

  그래서 “KT 전체가 공유할 수 있는 일관된 경험의 기준이 필요하다”는 공감대가 생겼고, 그 결과 AI Agent UX/UI Guide 프로젝트를 시작하게 되었어요.

  실무에서 마주한 가장 큰 어려움은 바로 UI/UX의 일관성 부족이었어요. 비슷한 역할을 하는 AI Agent인데도 화면 구조와 상태 표현이 달라 사용자 경험이 흩어졌고, 새로운 프로젝트가 시작될 때마다 기획자와 디자이너가 같은 문제를 반복적으로 해결해야 하는 비효율이 발생했어요. 이로 인해 프로젝트 리드타임이 길어지고 서비스 품질 편차가 생길 수밖에 없었죠.

  AI Agent는 이제 단순히 질의응답을 하는 수준을 넘어, 사용자의 맥락을 이해하고 목표 달성을 돕는 복잡한 상호작용으로 진화하고 있어요. 하지만 이런 변화를 체계적으로 뒷받침할 디자인 원칙이 없다면, 서비스가 늘어날수록 혼선은 더 커질 수밖에 없어요. 해외 사례를 봐도, MS와 Google 같은 글로벌 기업들도 Agent 경험을 위한 전용 UX 가이드를 제공하고 있어요. 이는 단순한 UI 정리가 아니라, 새로운 상호작용 패러다임을 조직적으로 지원하는 인프라라는 걸 보여주는 사례예요.

  이 문제들을 해결하기 위해 가이드의 목표를 이렇게 정했어요.

• 일관성(Consistency): 서비스가 달라도 사용자 입장에서 동일한 경험을 제공해요.
• 재사용성(Reusability): 공통 컴포넌트를 만들어 반복 작업을 줄이고 효율을 높여요.
• 확장성(Scalability): 새로운 유형의 Agent나 기능이 추가되더라도 유연하게 대응해요.

  즉, AI Agent UX/UI Guide는 단순한 디자인 매뉴얼이 아니라 KT의 AI Agent 경험을 장기적으로 지탱하는 인프라가 되는 것을 목표로 했어요.

  이번 AI Agent UX/UI Guide는 KT Design System(v1.0)이 12월에 배포되기 전에, 실무자들이 바로 활용할 수 있도록 선제적으로 공개한 버전(v0.5)이에요. 빠르게 현장에 적용해 피드백을 받고, 이후 KDS와 연결되는 정식 가이드로 발전하기 위한 방향성을 잡는 과정이었죠.

  그렇기 때문에 초기 버전에서는 몇 가지를 특별히 고려했어요.

  먼저 사내에 존재하는 다양한 AI Agent 유형들을 정의했어요. 그중에서도 가장 많이 쓰이는 대표 유형을 중심으로 선제 배포를 진행했어요. 이렇게 하면 적용 범위가 넓고, 현업에서 효과를 바로 체감할 수 있었어요. (해당 유형에 대한 자세한 내용은 구축 과정에서 더 설명할게요.)

  현장에서 바로 쓸 수 있도록 문서보다 즉시 활용 가능한 방식을 고민했어요. 단순한 원칙만 제시하는 게 아니라, 바로 복사 붙여놓기를 통해 작업 시간을 줄일 수 있도록 했어요.

  모든 화면을 고정 규격으로 정하기보다는, 조립식으로 결합할 수 있는 공통 요소를 먼저 정의하려고 했어요. 다양한 서비스의 모든 요소를 다루지 못하기 때문에 서비스 특성에 따라 필요한 만큼 조합해 사용할 수 있도록 했죠. 또한 공통적으로 필요한 컴포넌트가 생기면, 가이드에 추가하는 식으로 유연하게 대응하며 가이드를 발전할 수 있도록 했어요.

  즉, v0.5는 완성본이 아니라 ‘빠른 적용 + 피드백 수집 + 확장 기반 마련’에 방점이 찍힌 버전이었다고 할 수 있어요.

  먼저 기존 KT 서비스들을 분석해 AI Agent를 네 가지 유형으로 나눴어요.

• Conversational: 사용자의 자연어 입력에 기반하여 텍스트 중심의 질의응답을 주고받는 상호작용 패턴
• File & Data: 사용자가 파일이나 데이터를 입력하면, 이를 분석/요약/변환하여 결과를 제공하는 패턴
• Image & Video: 사용자가 이미지 또는 영상을 입력하거나 생성 요청하여 시각적 결과물을 제공하는 패턴
• Audio: 사용자의 음성 입력을 기반으로 텍스트 변환(STT) 또는 음성 생성(TTS)을 수행하는 패턴

그중 빠른 실무 적용과 범용성을 동시에 고려한 Conversational 유형을 중심으로 v0.5 가이드를 먼저 만들었어요.

  화면 구조만 통일하는 것은 충분하지 않았어요. 공통 컴포넌트를 만들기 위해서는 “왜 이 컴포넌트가 이렇게 만들어졌는가” 에 대한 근거가 필요했어요.

  그래서 우리는 KT Responsible AI 원칙과 고려대 산학협력 과제에서 도출된 Conversational UX 원칙을 바탕으로 컴포넌트를 설계했어요. 단순히 예쁘게 만드는 게 아니라, 신뢰할 수 있고 사용자 친화적인 원칙을 UI 요소에 녹여낸 거죠.

  이렇게 원칙에 기반해 만들어진 컴포넌트는 가이드의 신뢰도와 설득력을 높여주었어요.

  Agent 경험은 결국 사용자의 여정(User Journey)이에요. 그래서 단일 화면 단위로 디자인하는 대신, 대화의 흐름을 먼저 잡는 게 중요했어요.

  우리는 산학 과제에서 정의한 대화 단계와 실제 사용 흐름을 기준으로, 온보딩(Onboarding)에서 시작해 네비게이션(Navigation), 인풋(Input), 프로세싱(Processing), 아웃풋(Output), 그리고 포스트 리스폰스(Post-response)에 이르는 전 과정을 설계의 축으로 삼았어요. 그리고 각 단계마다 필요한 공통 컴포넌트를 대응시키고, 추가로 상태·알림·에러 처리 같은 보편적인 요소도 함께 정리했어요.

  그 결과, 가이드는 화면을 단순히 나열하는 문서가 아니라 사용자 여정을 따라가는 구조가 될 수 있었어요.

  

  서비스마다 제각각이던 Look & Feel을 통일하기 위해 UI Foundation을 추가했어요. 화면마다 달랐던 기본 요소들을 정리해 KT 서비스 어디서든 같은 리듬과 톤이 느껴지도록 하는 게 목표였죠.

• Color & Typo: 색상·폰트·간격을 토큰화해 재사용 가능하게 만들고, 서비스 간 스타일 혼선을 최소화했어요.
• Layout & Grid: 어떤 서비스에서도 동일한 리듬감을 유지할 수 있도록 공통 그리드와 여백 규칙을 정의했어요.
• Breakpoint: Desktop을 우선 기준으로 설계했지만, 모바일에서도 무너지지 않도록 반응형 전환 지점을 명확히 설정했어요.
• Iconography & Visual Assets: 아이콘·일러스트 같은 시각 자산도 기본 원칙을 맞춰, 서비스마다 따로 노는 느낌을 줄였어요.

  이렇게 UI Foundation을 정리해두니, 서비스마다 달랐던 디자인의 톤과 리듬이 하나로 맞춰져, KT 전체 서비스가 일관된 경험을 제공할 수 있는 기반이 마련되었어요.

  가이드를 텍스트로만 제공하는 데에는 분명 한계가 있었어요. 읽고 끝나는 문서가 아니라, 실무자가 바로 가져다 쓸 수 있는 도구가 필요했죠.

  그래서 Figma UI Kit을 제작했어요.

• ‘Do / Don’t’ 규칙을 함께 담아 올바른 사용법과 지양해야 할 사용법을 한눈에 볼 수 있도록 정리했고,
• 컴포넌트와 패턴을 라이브러리 형태로 제공해, 누구나 같은 자원을 복제해 쓸 수 있게 했어요.

  

  이렇게 하니, 팀마다 다르게 해석하던 요소들이 통일되었고, 새로운 프로젝트가 시작될 때도 “UI Kit을 불러오면 바로 시작할 수 있는” 속도와 일관성을 동시에 챙길 수 있었어요.

  가이드를 배포하는 것만으로는 충분하지 않았어요. 현장에서 실제로 쓰이게 하는 장치가 필요했죠.

    

• 실사용을 돕는 교육 : 주요 사옥에서 세션을 열어, 기획자·디자이너·개발자가 직접 가이드를 익히고 바로 적용할 수 있도록 했어요.
• 슬랙 문의 채널 : 궁금한 점이나 개선 아이디어를 바로 제안할 수 있는 소통 창구를 열었어요.
• 가이드 고도화 프로세스 : "실무팀 제안 → 가이드 담당 팀 검증 → 공식 업데이트"를 통해 새로운 유형이나 컴포넌트가 필요할 때, 누구나 제안할 수 있고 투명하게 반영할 수 있어요.

  이 과정을 통해, 가이드는 단순히 배포된 문서가 아니라 실무와 연결된 살아 있는 도구가 될 수 있었어요.

  단순히 화면 구조와 컴포넌트를 정리하는 것만으로는 부족했어요. 실제 적용 단계에서는 대내외 배포 범위, 문의 채널 운영, 새로운 유형이나 예외 케이스 대응 같은 운영 과제가 계속 생겼죠. 이런 부분을 임시로 대응하면 금세 일관성이 깨지기 때문에, 슬랙 채널을 통한 소통 창구 운영과 실무팀 제안 → 가이드 담당 팀 검토 → 공식 업데이트와 같은 명확한 운영 프로세스를 마련해야 한다는 걸 배웠어요.

  다양한 서비스에서 공통 요소를 정의하는 것 자체가 쉽지 않았어요. 어디까지를 “공통”으로 묶고 어디부터는 “서비스 특화”로 둘지 합의하는 데 시간이 걸렸고, 기존 서비스 리뉴얼 시 적용 범위를 어디까지 잡을지도 큰 고민이었어요. 특히 v0.5는 모든 요소를 완전히 정의한 것이 아니었기 때문에 경계가 더 모호했죠. 그래서 실무에 빠르게 적용할 수 있도록 공통 요소들을 ‘필수’로 제시하는 거시적 가이드를 설정했고, 이를 쉽게 쓸 수 있도록 UI Kit을 함께 제공했어요. 결과적으로 v0.5의 목표가 “실무 선제 대응”이라는 점이 명확해졌고, 이에 기반한 의사결정이 중요하다는 걸 배웠어요.

  가이드는 디자이너만을 위한 문서가 아니었어요. 기획자, 개발자, 운영자 등 다양한 역할의 실무자들이 어떻게 활용할 수 있을지를 고려해야 했죠. 기획자에게는 시나리오 설계 참고가 되고, 디자이너에게는 컴포넌트 재사용 가이드가, 개발자에게는 구현 기준이 되어야 했어요. 이 과정을 통해, 가이드는 특정 직군만의 문서가 아니라 조직 전체가 공유하는 언어가 되어야 한다는 점을 배웠어요.

  v0.5는 데스크톱 환경을 우선으로 만들었고, 모든 요소를 다루지는 않았어요. 앞으로는 모바일 버전 업데이트를 통해 다양한 디바이스에 대응하고, 동시에 사내에서 진행 중인 프로젝트들에 필요한 요소들을 지속적으로 보완할 예정이에요.

  v0.5에서는 가장 범용적인 Conversational 유형에 집중했어요. 다음 단계에서는 File & Data, Image, Audio 등 다른 유형까지 확장해, KT의 다양한 AI Agent 서비스 전반에 적용할 수 있는 체계를 만들어 갈 계획이에요.

  12월에 배포되는 KDS(KT Design System)에 이번 가이드가 업데이트돼요. v0.5에서 실무 적용을 통해 얻은 피드백을 반영해, 더 완성된 정식 가이드(v1.0)로 진화하게 될 거예요.

  AI Agent UX/UI Guide는 단순히 규칙을 정리한 문서가 아니에요. KT의 모든 AI Agent 경험을 하나로 잇는 공통 언어이자, 함께 만들어가는 새로운 표준이에요. 

  앞으로도 가이드는 운영 프로세스와 거버넌스, 실무 적용성, 다양한 실무자의 관점을 토대로 계속 진화할 거예요. 그리고 그 과정은 가이드 담당 팀만이 아니라, KT 전체가 참여하는 협업의 결과물이 될 거예요. 실무자들의 경험과 피드백이 더해질수록 가이드는 더 단단해지고, 그 결과 KT의 AI Agent 서비스는 더 많은 사용자에게 일관되고 신뢰할 수 있는 경험을 제공할 수 있게 됩니다.

  마지막으로, 12월 공개 예정인 KDS(KT Design System)에서 더욱 완성도 높아진 가이드를 만나보실 수 있으니 많은 기대 부탁드립니다!

프로젝트 참여 인원

김수현(X-서비스기획팀), 송다연(X-서비스디자인팀), 이소선(X-서비스디자인팀), 조여은(X-서비스기획팀)