코딩 몰라도 앱 디자인 뚝딱… 900개 실제 앱에서 배우는 AI 나왔다

aimatters · 2026.01.30 16:42:15

디자인을 한 번도 배워본 적 없는 사람도 몇 번의 클릭만으로 전문가 수준의 모바일 앱 화면을 만들 수 있는 시대가 열렸다. 해당 논문에 따르면, 스위스 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와 클로드를 활용해 작성되었습니다.

인기 기사

번호	제목	글쓴이	작성일	조회	추천
설문	예능과 잘 맞지 않는 것 같은 스타는?	운영자	26/03/16	-	-
2195	챗GPT가 스스로를 복사하기 시작했다, 인터넷 오염이 부른 AI 자기수렴 현상	aimatters	14:55	45	0
2194	얼굴 하나로 감정, 음주, 졸음까지 읽는다, AI 단일 네트워크의 등장 [2]	aimatters	14:55	444	0
2193	AI가 AWS 클라우드 해킹을 탐지, RAG 기술이 보안 정확도를 70% 끌어올렸다	aimatters	14:55	9	0
2192	"AI를 고용하는 시대 왔다"…젠스파크, 워크스페이스 3.0 공개·ARR 2억 달러 돌파	aimatters	14:55	9	0
2191	애피어 "AI가 마케팅을 직접 실행한다"	aimatters	14:55	7	0
2190	앤트로픽이 1억 달러를 쏟아붓는 이유, 클로드를 기업 AI 표준으로 만든다	aimatters	12:59	11	0
2189	머스크 "xAI, 애초에 잘못 만들었다"…코딩 툴 폐기하고 커서 임원 영입 [9]	aimatters	12:59	1086	4
2188	"AI 활용 거부는 전략적 공백"…팔란티어 CEO, 앤트로픽의 국방부 거부에 직격탄	aimatters	12:59	12	0
2187	"TSMC 70% 수준 생산한다"…테슬라 테라팹, AI 반도체 판을 바꿀까	aimatters	12:59	14	0
2186	"사람을 그려줘"라고 했을 뿐인데, AI는 왜 항상 백인 얼굴을 만들어낼까 [3]	aimatters	03.13	109	1
2185	AI가 자신의 실수를 알면서도 고치지 못하는 이유	aimatters	03.13	37	0
2184	컴퓨터공학과 학생들은 챗GPT를 어떻게 쓰고 있을까	aimatters	03.13	39	1
2183	"회의록보다 AI한테 묻는 게 더 편해진 직장인들"	aimatters	03.13	72	0
2182	텍스트·이미지·영상·음성을 단일 공간 처리…구글, 제미나이 임베딩 2 출시	aimatters	03.13	30	0
2181	"엔비디아 없어도 돼"…메타(Meta), 2년 안에 자체 AI 칩 4종 쏟아낸다	aimatters	03.13	30	0
2180	메타(Meta), '몰트북(Moltbook)' 전격 인수	aimatters	03.13	30	0
2179	FIFA, 2026 월드컵 AI로 심판·판정·운영 싹 바꾼다	aimatters	03.13	17	0
2178	변호사 5만 명이 선택한 AI 법률 플랫폼, 기업가치 6조 원 돌파	aimatters	03.13	25	0
2177	AI가 스마트 계약 보안을 완전히 대체할 수 없다는 연구 결과가 나왔다	aimatters	03.12	25	0
2176	AI가 세계 최고 물리올림피아드에서 처음으로 만점을 받았다	aimatters	03.12	31	0
2175	엔비디아, AI 에이전트용 모델 '네모트론 3 슈퍼' 공개…속도 5배↑ 비용은 줄였다	aimatters	03.12	47	0
2174	"이보다 쉬운 설명, 이보다 깊은 통찰은 없다"… 박태웅의 AI 강의 2026, AI 격변의 현재를 해부하다	aimatters	03.12	23	0
2173	글로벌 기업 83%가 지속가능성 투자를 늘리는 진짜 이유는 AI였다	aimatters	03.12	18	0
2172	"AI 때문에 자를 수밖에 없었다"…아틀라시안, 직원 1,600명 해고	aimatters	03.12	35	0
2171	챗GPT보다 4년 먼저 에이전트 출시…젠데스크, AI 고객 서비스 스타트업 포어소트 인수	aimatters	03.12	18	0
2170	벤 애플렉의 AI 영화 후반 작업 스타트업, 넷플릭스가 6억 달러에 샀다	aimatters	03.12	24	0
2169	미국 10대 64%가 AI 챗봇을 쓰는 시대, 부모 10명 중 3명은 사실조차 모른다 [3]	aimatters	03.11	1336	4
2168	챗GPT가 스택 오버플로를 오염시키고 있다, AI가 AI를 잡아낸다	aimatters	03.11	54	0
2167	AI가 해커보다 먼저 움직인다, CISO들이 선택한 생존 전략	aimatters	03.11	32	0
2166	아마존, 헬스케어 AI 어시스턴트 전면 개방…프라임 회원 아니어도 무료 이용	aimatters	03.11	24	0
2165	포켓몬 고가 배달 로봇의 눈이 됐다…나이언틱의 AI 지도 혁명	aimatters	03.11	36	0
2164	"답할까, 거절할까, 추측할까"…애피어, AI 의사결정 신뢰성 높이는 연구 발표	aimatters	03.11	26	0
2163	"이 노래, AI가 만들었나요?"…애플 뮤직, AI 생성 음악 표시 태그 도입 [1]	aimatters	03.11	1059	3
2162	벚꽃 사진 한 장으로 개화일 뚝딱…일본 날씨 앱, AI 벚꽃 개화 예측 서비스 시작	aimatters	03.11	36	0
2161	AI 도구 '에코넥스트', 심장 전문의보다 정확하게 구조적 심장질환 잡아냈다	aimatters	03.11	25	0
2160	"병원∙약국 최저가 AI가 챙긴다"…CVS 헬스, 구글 클라우드와 AI 헬스케어 플랫폼 출시	aimatters	03.11	36	0
2159	AI가 만든 영상인지 모르고 봤다, 소라 사용자 254명이 털어놓은 충격 반응 [5]	aimatters	03.10	2534	3
2158	사진 한 장으로 내 얼굴·손동작까지 살아 움직이는 AI 영상 만든다... 클링-모션 컨트롤 출시	aimatters	03.10	72	0
2157	챗GPT 사용자 2293만 명, 그록 AI는 출시 1년 만에 3위 올라섰다	aimatters	03.10	66	0
2156	"경쟁사도 우리 편"…오픈AI·구글 직원들, 앤트로픽 국방부 소송 공개 지지	aimatters	03.10	45	0
2155	AI가 만든 코드, 멀티 에이전트 AI가 검수한다…앤트로픽, 코드 리뷰 툴 정식 출시 [3]	aimatters	03.10	1272	3
2154	오픈AI, AI 보안 스타트업 프롬프트푸 인수…에이전트 보안 강화 나선다	aimatters	03.10	49	0
2153	"3시간 경기보다 15초의 순간"…AI가 야구 콘텐츠 판을 바꾼다	aimatters	03.09	1097	1
2152	"상상이 현실이 된다"…PixAI, 차세대 AI 이미지 모델 '츠바키.2' 공개 [1]	aimatters	03.09	1286	2
2151	35만원 싸게 살 수 있다…에이서, 인텔 팬서레이크 탑재 'AI 노트북' 예약 판매 시작	aimatters	03.09	1256	0
2150	"온 디바이스 AI폰의 종결자"…갤럭시 S26, 이제는 'AI 에이전트폰'이다	aimatters	03.09	149	0
2149	AI 에이전트 스킬 마켓플레이스의 민낯, 4만 개 분석하니 절반이 중복이고 9%는 위험했다	aimatters	03.09	35	0
2148	구글 나노 바나나가 만든 가짜 흉부 X선으로 폐렴을 92% 정확도로 잡아냈다	aimatters	03.09	100	0
2147	AI 이미지 생성의 공식이 나왔다, 구조화된 프롬프트가 일관성을 95%까지 끌어올린다	aimatters	03.09	57	0
2146	앤트로픽이 '적'에서 '동반자'로…소프트웨어 주가 반등	aimatters	03.09	42	0

최근 방문

즐겨찾기

즐겨찾기 갤러리

이미지 올리기 이용안내

갤러리 이슈박스, 최근방문 갤러리

연관 갤러리

개념글 리스트

차단하기

[AI 매터스 갤러리]

갤러리 본문 영역

추천 비추천

댓글 영역

① NFT 발행

② NFT 구매

하단 갤러리 리스트 영역

왼쪽 컨텐츠 영역

갤러리 리스트 영역

페이지 이동

오른쪽 컨텐츠 영역

알림 설정

알림

디시콘 리스트

디시콘

디시콘 검색결과(0)

인기 디시콘