생성은 AI가, AI의 UXUI는 내가
익숙하지 않은 AI를 익숙하게 만드는 UXUI 디자인기
기능은 많지만, 쓰기 어려운 AI
올 해 내내 회사에서 클라이언트 맞춤형 생성형 AI 웹사이트 구축 프로젝트에 참여했다.
이 프로젝트는 기존 서비스를 리디자인한 것이 아니라, 제로베이스에서 완전히 새로 만드는 일이었다.
그리고 이 과정을 통해 확실히 느꼈다.
AI가 아무리 똑똑해도, UI가 불친절하면 사용자는 시작조차 못 한다는 것! (like me..)
이 AI 사이트는 단순한 이미지 생성이 아니라,
세밀한 파라미터 제어를 통한 고도화된 결과물을 낼 수 있어야 했다.
덕분에 다뤄야 할 기능도 매우 많았다.
프롬프트 입력 및 스타일 선택
이미지 비율, 스타일 레퍼런스, 샘플 수, 시드값 등 세부 조절 등
생성 이력 확인 및 편집, 업스케일, 삭제 등
하나하나를 따로 보면 어렵지 않았지만,
이 모든 걸 함께 다뤄야 할 사용자 입장에선 꽤 높은 진입장벽이었다.
이 모든 걸 포괄할 UI를 설계하는 것도..
이 프로젝트에서 UI 디자이너로서 내가 가장 먼저 고민했던 것도 바로 이 지점이다.
"기능은 그대로 두되, 어떻게 하면 덜 복잡하게 느껴지게 할 수 있을까?"
진입 장벽을 낮추기 위한 UX 구조 : 랜덤 프롬프트 + 퀵 스타트
특히 처음 접속한 사용자가 아무것도 입력하지 않아도 바로 이해할 수 있는 구조가 필요했다.
그래서 우리는 메인 페이지의 UX 흐름을 다음과 같이 설계했다.
1. 랜덤 프롬프트 이미지 노출
매 접속 시마다 AI가 생성한 샘플 이미지와 프롬프트를 랜덤으로 보여줌
사용자에게 “이런 걸 만들 수 있구나”라는 명확한 기대감과 아이데이션의 출발점을 제공
복잡한 조작 없이도 서비스의 가능성을 직관적으로 전달
2. ‘퀵스타트(Quick Start)’ 진입 구조 설계
생성, 편집, 업스케일, 스타일 전환 등 주요 기능 흐름을 워크플로우 단위로 바로 진입 가능한 카드형 구조로 시각화
“어디서부터 시작할지” 막막했던 사용자를 바로 작업으로 유도
직관적인 구성으로 신규 사용자도 학습 없이 기능 사용 가능
결과적으로 사용자는 ‘무엇을 해야 할지’보다
‘무엇을 해볼 수 있을지’에 집중하게 된다.
이 UX 흐름은 단순히 메인화면에 배치된 시각 요소가 아니라,
전체 서비스 사용 경험의 흐름을 좌우하는 핵심 설계 전략이었다.
제어 인터페이스를 위한
컴포넌트 디자인 시스템 구축
기능적으로 복잡한 서비스일수록, UI는 단순하고 명확해야 한다.
특히 생성형 AI에서 사용되는 다양한 파라미터 조절 UI는
디자인 시스템 중심으로 설계하지 않으면, 사용자 혼란을 유발하기 쉽다.
그래서 다음 세 가지 원칙을 중심으로 컴포넌트 단위 디자인 시스템을 설계했다.
1. 일관된 UI 구조
슬라이더, 라디오, 버튼 등 핵심 조작 UI를 컴포넌트화
슬라이더는 어디서든 같은 위치, 같은 반응
라벨링과 기본값을 통해 초보자도 ‘어떻게 써야 할지’를 유추
2. 여러 페이지에 걸친 동일한 조작감 유지
배치되는 페이지는 다르지만, UI 및 인터랙션은 동일하게
클릭 영역, 반응 속도, 상태 변화 등을 사용자 입장에서 통일된 흐름으로 인지하도록 설계
3. 확장 가능한 디자인 시스템 중심 설계
새로운 기능이 추가돼도 기존 컴포넌트의 재조합만으로 대응 가능하도록 구조화
이로서 새로운 제어 패널이나 워크플로우가 추가되어도
일관성을 유지하면서 균일한 톤으로 대응될 수 있도록 정리되었다.
AI 서비스에서 UXUI 디자이너의 역할
강력한 기능을, 누구나 익숙하게 쓸 수 있도록 구조화하는 것.
복잡한 흐름을, 낯설지 않게 풀어내는 것.
AI는 점점 더 많은 걸 할 수 있게 될 것이다.
하지만 그 모든 기능이 사용자에게 닿는 방식은 결국
디자이너가 설계한 인터페이스에 달려 있다.
아쉽게도 이번 프로젝트는 멋진 클라이언트와 함께한 작업이었지만, 보안상 외부에 공개할 수 없어 이렇게 이미지 없이 글로만 남기게 되었습니다.
대신 유사한 방향의 사내 AI 프로젝트를 현재 진행 중이며, 연말쯤에는 해당 작업을 개인 Behance에 일부 소개드릴 수 있을 것 같네요!
그렇게 2025년도는 AI 사이트만 만들다 끝나는 저랍니다..