디자인을 한 번도 배워본 적 없는 사람도 몇 번의 클릭만으로 전문가 수준의 모바일 앱 화면을 만들 수 있는 시대가 열렸다. 해당 논문에 따르면, 스위스 ETH 취리히(ETH Zurich) 연구팀이 개발한 ‘UI 리믹스(UI Remix)’는 생성형 AI와 실제 앱 디자인을 결합해 누구나 쉽게 앱 화면을 만들 수 있게 돕는 시스템을 발표했다.
인기 앱 900개에서 직접 고르는 AI… “다운로드 수·평점 보고 골라요”
UI 리믹스는 실제 사용되는 모바일 앱 약 900개의 화면 디자인을 학습했다. 연구팀은 모빈(Mobbin), 인터랙션 마이닝(Interaction Mining), 모바일뷰(MobileViews) 같은 디자인 자료 모음에서 음식, 여행, 생활, 뉴스, 교육 등 다양한 분야의 인기 앱 196개를 선별했다. 각 화면에는 구글 플레이 스토어에서 가져온 평점, 다운로드 수, 만든 회사 정보가 함께 붙어있다.
시스템의 핵심은 텍스트와 이미지를 함께 이해하는 AI 기술에 있다. 사용자가 “음식 배달 앱 같은 화면”이라고 입력하면, AI가 이 문장을 숫자 데이터로 바꾸고, 저장된 900개 앱 화면과 비교해서 가장 비슷한 상위 10개를 골라낸다. 성능 평가에서 이 시스템은 사용자가 원하는 것의 88%에서 상위 5개 결과 안에 적절한 화면을 포함시켰다. 특히 색상 조합이나 앱 종류를 찾을 때는 92%의 정확도를 보였다.
화면을 만드는 과정에서는 GPT-5 모델을 활용한다. 사용자가 말한 내용, 현재 작업 중인 화면 코드, 선택한 참고 화면을 한꺼번에 AI에게 보내면, AI가 HTML/CSS 코드를 만들어낸다. 여기서 중요한 점은 전체 코드를 처음부터 다시 만드는 게 아니라 바뀐 부분만 수정한다는 것이다. 이 방식 덕분에 초기 버전보다 작업 시간이 약 3분에서 1분으로 줄어들었다.
“전체 바꾸기”와 “버튼만 바꾸기” 모두 가능… 원하는 대로 조합
UI 리믹스는 세 가지 모드로 작동한다. 채팅 모드에서는 평소 말하듯이 “레스토랑 앱 메뉴 화면 만들어줘”라고 입력하면 첫 디자인이 나온다. 검색 모드는 “음식 배달 앱처럼”이라고 검색하면 실제 앱 화면들을 보여준다. 특정 버튼이나 메뉴를 선택하고 검색하면 그 부분과 비슷한 디자인만 골라서 보여준다. 적용 모드에서는 마음에 드는 화면을 자기 디자인에 반영할 수 있다.
가장 특별한 기능은 ‘전체 바꾸기’와 ‘부분 바꾸기’다. 전체 바꾸기는 화면 전체에 적용된다. 예를 들어 레스토랑 앱을 만들다가 “음식 배달 앱 찾아 줘”라고 검색해서 마음에 드는 디자인을 고른 뒤 “이 색깔로 바꿔줘”라고 하면 전체 화면의 색상이 바뀐다. 부분 바꾸기는 특정 요소만 수정한다. 예약 버튼이 마음에 안 들면 그 버튼을 클릭하고 “빨간색 예약 버튼 찾아 줘”라고 검색한 후, 결과 중 하나를 확대해서 원하는 부분을 손가락으로 그려 표시하고 “이 스타일로 해줘”라고 하면 그 버튼만 바뀐다.
연구팀의 성능 평가에서 시스템은 색상 조합 찾기에서 92%, 앱 종류 찾기에서 92%의 정확도를 보였다. 레이아웃 찾기는 88%, 특정 구성 요소 찾기는 80%였다. 이는 AI가 디자인의 스타일적 특징과 의미를 제대로 이해한다는 뜻이다.
24명 실험서 “디자인 목표 달성” 크게 향상… 평균 16분 만에 완성
ETH 취리히 연구팀은 디자인을 전혀 배우지 않은 24명을 대상으로 효과를 검증했다. 참가자들은 학생, 교사, 연구원 등이었고, AI 도구 사용 경험은 6개월에서 3년 이상까지 다양했다. 실험은 두 가지 시스템으로 진행됐다. 기본 시스템은 텍스트로만 지시하는 방식이고, UI 리믹스는 모든 기능을 갖춘 버전이다.
참가자들은 각 시스템으로 레스토랑 메뉴 화면과 뉴스 앱 화면을 만들었다. 과제당 최대 25분이 주어졌고, 각 과제 후 7점 만점으로 평가했다. 전체 세션 후에는 10분간 인터뷰를 진행했다.
결과는 명확했다. UI 리믹스는 “디자인 목표 달성 지원”에서 평균 5.92점으로 기본 시스템의 4.79점보다 높았다. “효과적인 디자인 수정 지원”도 5.83점 대 4.67점으로 앞섰다. 특히 “더 많은 디자인 대안 탐색 지원”에서는 6.58점 대 4.17점으로 가장 큰 차이를 보였다. “개인 앱 만들 때 사용하고 싶다”와 “다른 창작 작업에 사용하고 싶다”는 것에 서도 UI 리믹스가 훨씬 높은 점수를 받았다.
사용 패턴을 분석한 결과 참가자들은 과제당 평균 3.75회 검색했고, 전체 바꾸기 1.33회, 부분 바꾸기 약 3회를 했다. 6명은 5개 이상의 관련 화면을 찾아봤고, 21명은 처음 5번의 조작 안에 최소 1회 검색을 사용했다. 이는 참가자들이 디자인 초기부터 적극적으로 예시를 참고했다는 뜻이다.
평점과 다운로드 수 같은 정보는 신뢰 형성에 큰 역할을 했다. 24명 중 17명이 실험 중 앱 평점, 다운로드 수, 만든 회사 정보를 적극적으로 확인했다. 6명은 평점이 높으면 그 디자인을 더 믿고 선택했다고 답했다. 한 참가자는 “다운로드 수와 평점을 보면, 숫자가 높으면 ‘이게 좋은 디자인이구나’라고 생각하게 된다”고 설명했다. 다만 7명은 이런 정보보다 화면이 예쁜지가 더 중요했다고 답해, 사람마다 판단 기준이 다름을 보여줬다.
“AI가 답 주는 게 아니라 고민하게 만든다”… 디자인 방식 자체가 바뀐다
연구팀은 UI 리믹스가 두 가지 방식으로 작동한다고 분석했다.
첫째, 예시를 보며 내 생각을 구체화한다. 참가자들은 “깔끔한 레스토랑 메뉴”처럼 막연한 목표로 시작했지만, “깔끔함”이 구체적으로 뭘 의미하는지 설명하기 어려워했다. 여러 예시를 보고 비교하면서 “이 레이아웃이 더 단순해서 좋다”는 식으로 자기 생각을 말로 표현할 수 있게 됐다. 전문가들이 작업하며 자기 생각을 다듬어가는 과정과 비슷하다.
둘째, 다른 사람들의 평가가 신뢰를 만든다. 평점, 만든 회사, 다운로드 수를 보여주면 사용자가 “많은 사람이 이 디자인을 좋아했으면 괜찮겠지”라고 판단할 수 있다. 이는 디자인 품질을 판단할 전문 지식이 없는 초보자에게 특히 중요했다. 검색 결과가 단순히 AI가 만든 결과물이 아니라 “믿을 만한 디자인 참고 자료”로 느껴진 것이다.
연구팀은 반복 작업이 점진적 개선을 돕는다고 강조했다. 검색하고 적용하는 과정을 반복하면서 사용자는 여러 대안을 탐색하고 더 확신 있게 수정할 수 있었다. 전체 바꾸기는 초기에 아이디어를 넓히는 데 도움이 되고, 부분 바꾸기는 세부 사항을 다듬는 데 유용했다. 전문가가 큰 그림과 세부 사항을 오가며 작업하는 방식을 비전문가도 경험할 수 있게 된 것이다.
연구팀은 “AI의 역할을 명령 실행자에서 함께 고민하는 파트너로 바꿔야 한다”고 제안했다. 사용자가 목표를 명확히 말할 수 있다고 가정하는 대신, UI 리믹스는 사용자가 탐색하며 원하는 걸 찾아가도록 도왔다. AI의 가치는 디자인을 자동으로 만드는 게 아니라 사용자의 고민을 돕는 데 있다. 참고할 예시를 보여주고, 여러 번 수정할 수 있게 하고, 사용자가 자기 선택에 대해 생각하게 만드는 것이다. 연구팀은 “얼마나 정확하게 만드느냐보다, AI와 협업하며 사용자가 얼마나 효과적으로 자기 아이디어를 검토하고 다듬을 수 있느냐가 중요하다”고 강조했다.
FAQ (※ 이 FAQ는 본지가 리포트를 참고해 자체 작성한 내용입니다.)
Q1. UI 리믹스는 어떤 AI 기술을 사용하나요?
A. UI 리믹스는 텍스트와 이미지를 함께 이해하는 AI 기술을 사용합니다. 사용자가 말로 설명하면 그 내용을 숫자 데이터로 바꾸고, 저장된 실제 앱 화면들과 비교해서 가장 비슷한 디자인을 찾아냅니다. 그 후 GPT-5라는 AI가 선택된 예시와 사용자 요구사항을 합쳐서 HTML/CSS 코드를 만듭니다. 이때 전체 코드를 다시 만드는 게 아니라 바뀐 부분만 수정해서 속도가 빠릅니다.
Q2. 디자인을 한 번도 안 배워도 정말 쉽게 쓸 수 있나요?
A. 24명의 비전문가 실험에서 참가자들은 5분 설명 듣고 바로 사용했습니다. 평균 약 16분 만에 레스토랑 메뉴나 뉴스 앱 화면을 완성했고, 7점 만점에 사용 편의성 6.08점, 직관성 6.04점을 줬습니다. 평소 말하듯이 원하는 디자인을 설명하고, 나온 실제 앱 예시 중 마음에 드는 걸 골라서 적용하는 방식이라 코딩을 몰라도 사용할 수 있습니다.
Q3. 다른 AI 디자인 도구와 뭐가 다른가요?
A. 기존 도구들은 사용자가 말로 지시하면 AI가 결과물을 만들어주는 방식입니다. UI 리믹스는 여기에 실제 앱 900개의 디자인을 검색하고 참고하는 기능을 더했습니다. 각 예시에는 평점, 다운로드 수, 만든 회사 정보가 표시돼서 신뢰성을 판단할 수 있습니다. 또한 전체 화면을 바꾸는 기능과 버튼 하나만 수정하는 기능을 모두 지원해서 원하는 대로 세밀하게 조정할 수 있습니다.
기사에 인용된 논문 원문은 arXiv에서 확인 가능하다.
논문명: UI Remix: Supporting UI Design Through Interactive Example Retrieval and Remixing
이미지 출처: 이디오그램 생성
해당 기사는 챗GPT와 클로드를 활용해 작성되었습니다.
