더 높은 품질, 더 정밀한 AI: App Builder의 새로운 기능

App Builder의 2026년 7월 및 10월 릴리스는 AI의 품질과 정밀도를 향상시킵니다. 더 완성도 높은 앱 생성, 요청한 부분만 변경하는 편집, 디자인에 더 가까운 결과, 그리고 각 요청의 실시간 진행 상황 표시를 제공합니다. 또한 Apex Charts와 Ignite UI for Angular 22 업데이트도 포함되어 있습니다.

Georgi Anastasov Last Updated Oct 28, 2026 7min read

지난 게시물 이후 App Builder는 2026년 7월과 10월에 두 차례의 릴리스를 제공했으며, 두 릴리스 모두 AI로부터 더 나은 결과를 얻는 데 초점을 맞추고 있습니다. 7월 릴리스에서는 생성에 사용되는 모델을 더 새롭고 정확한 모델로 전환하고 생성 속도를 높였습니다. 10월 릴리스에서는 AI가 앱을 생성하고 편집하는 방식을 재설계하여, 생성된 앱의 완성도가 높아지고 편집은 요청한 내용에만 적용됩니다.

주요 내용은 다음과 같습니다.

첫 프롬프트부터 더 나은 앱 - 작동하는 데이터, 동작이 연결된 버튼, 주제에 맞는 테마.
더 정밀한 편집 - 하나의 구성 요소, 앱 전체에서 일치하는 모든 요소, 또는 페이지와 네비게이션을 변경하고 나머지는 그대로 유지합니다.
디자인에 더 가까운 결과 - 목업을 첨부하면 앱이 해당 디자인의 페이지, 텍스트, 색상 팔레트를 따릅니다.
진행 상황 확인 및 제어 - 각 단계를 확인하고, 언제든지 중지하고, 프롬프트를 편집하거나 다시 시도할 수 있습니다.
디자이너의 새로운 기능 - Apex Charts와 Carousel의 Select 액션.

더 높은 품질, 더 정밀한 AI

이러한 개선 사항은 App Builder에서 AI를 사용하는 모든 곳에 적용되며, 세 가지 진입점은 모두 동일한 채팅 기록을 공유합니다.

Create with AI (메인 페이지): 새 앱을 시작합니다.
AI Chat (디자이너): 열려 있는 앱을 생성하거나 변경하거나, 앱에 대해 질문합니다.
Edit with AI (선택한 구성 요소): 해당 구성 요소를 변경하거나, 구성 요소에 대해 질문합니다.

7월 릴리스는 그 토대를 마련했습니다. 더 새롭고 정확한 모델, 첨부 이미지 처리 개선, 멀티 뷰 네비게이션, 데이터 바인딩 및 데이터 리피터 레이아웃 개선, 그리고 더 빨라진 생성 속도가 포함되며, 이미지는 앱을 사용하는 동안 백그라운드에서 생성이 완료됩니다.

첫 프롬프트부터 더 나은 앱

이제 각 앱은 구축되기 전에 먼저 계획됩니다. 페이지, 네비게이션, 데이터, 그리고 주제에 맞는 고유한 요소가 계획됩니다. 페이지 이름, 문구, 기능은 사용자의 요청에서 결정됩니다.

그 결과, 생성이 완료되었을 때 앱의 더 많은 부분이 작동합니다.

데이터가 이를 사용하는 그리드, 차트, 목록과 일치합니다.
입력 필드는 값을 유지하며, 체크박스가 선택될 때까지 버튼을 비활성화 상태로 유지할 수 있습니다.
버튼은 실제 페이지로 이동하거나, 대화 상자를 열거나 닫거나, Save 또는 Export와 같은 작업의 경우 확인 메시지를 표시합니다.
테마는 주제에 어울리고, 지정한 16진수 색상을 사용하며, 배경 대비 텍스트의 가독성을 유지합니다.

테마나 단일 페이지와 같은 일부를 완료할 수 없는 경우에도 앱의 나머지 부분은 제공되며, 요약에 누락된 내용이 표시됩니다.

예시

Create a modern AeroNova drone store and service website focused on the AeroNova Mini, Flip, and Neo drone lines. Showcase featured drones with large product imagery, sample specifications and pricing, comparisons, accessories, and purchase actions, while also highlighting professional maintenance and repair services with clear service options and booking actions. Make the experience feel premium, technical, and adventurous, with strong visual hierarchy, immersive drone photography, polished product sections, and a design inspired by aerial exploration rather than a generic ecommerce layout.

디자인에서 시작하기

기존 디자인에서 애플리케이션을 시작할 때에도 동일한 품질 개선 사항이 적용됩니다. 이제 AI는 디자인을 더 면밀히 분석하여, 애플리케이션을 생성하기 전에 뷰, 네비게이션, 구조, 텍스트, 데이터, 테마, 타이포그래피를 추출합니다.

여러 이미지를 첨부하면 각 이미지가 개별 페이지의 기준이 될 수 있습니다. 반복되는 카드와 테이블 행은 디자인의 필드 이름을 그대로 사용하는 작동하는 데이터가 됩니다. 결과는 디자인을 충실히 따르지만, 픽셀 단위까지 완벽하게 복제되지는 않습니다.

예시

Create an app that follows the attached image design.

이 예시에 사용된 참조 디자인

더 정밀한 편집

AI를 사용한 편집이 정밀도를 높이도록 재설계되었습니다. 각 요청은 직접 수정한 변경 사항을 포함한 앱의 현재 상태를 기반으로 처리됩니다. AI는 목적을 달성하는 데 필요한 최소한의 변경만 수행하고, 앱의 나머지 부분은 그대로 유지합니다.

다음과 같은 변경을 요청할 수 있습니다.

요청 내용	요청 예시
구성 요소 변경, 추가, 이동 또는 제거	”Make the Save button green”, “Add a Save button to the form”
데이터 또는 바인딩 변경	”Show only name and price on this grid”
상태 추가	”Add a checkbox that has to be selected before the Place Order button is enabled”
일치하는 모든 요소 변경	”Make every card outlined”
페이지 및 네비게이션 변경	”Rename the Dashboard page to Home”
여러 변경 사항 결합	”Rename the app and add a Reports page”

캔버스에서 구성 요소를 선택한 상태에서는 “this”가 해당 구성 요소를 가리킵니다. 이름이 여러 구성 요소와 일치하는 경우, AI는 추측하지 않고 어떤 구성 요소를 의미하는지 묻습니다.

예시

Change this button’s text to “Book a Service Appointment” and style it with an orange background and white text.

앱에 저장된 데이터에 “add a supplier column”처럼 필드를 추가해도 기존 행은 유지됩니다. 버튼을 선택한 상태에서 “go to Orders instead”라고 요청하면 버튼의 이동 대상이 변경됩니다.

페이지를 추가, 이름 변경, 순서 변경 또는 제거하면 네비게이션도 이에 맞게 업데이트되며, AI는 페이지를 제거하기 전에 확인을 요청합니다. 여러 변경 사항이 포함된 메시지는 순서대로 단계별로 실행되며, 일부를 수행할 수 없는 경우 요약에 제외된 내용이 표시됩니다.

예시

Add a simple footer to every page with a centered container and the text ”© 2026 AeroNova. All rights reserved.”

앱에 맞는 페이지 및 섹션 추가

새 페이지와 섹션에도 동일한 품질 개선 사항이 적용됩니다. 이제 “Add a Reports page showing this month’s orders” 또는 “add a section showing revenue on the Dashboard”와 같은 요청은 앱 전체를 구축할 때와 같은 방식으로 새 부분을 구축하며, 작동하는 데이터, 동작이 연결된 버튼, 어울리는 색상을 갖춥니다. AI는 먼저 기존 페이지를 읽기 때문에 새 부분은 기존 레이아웃과 문구를 따르며, 앱의 나머지 부분은 변경되지 않습니다. 섹션은 기존 섹션의 위, 아래 또는 사이에 추가할 수 있으며, 새 페이지는 네비게이션에 추가됩니다.

예시

Add a Flight Academy page with beginner, intermediate and advanced drone training courses. Show each course’s description, duration and price, with a Book Course button.

앱 스타일 변경

테마 변경은 요청한 범위 내에서만 적용됩니다. “Make it darker” 또는 “use our brand blue”는 색상 팔레트를 변경하며, 하나의 구성 요소 색상을 변경하면 해당 구성 요소에만 영향을 줍니다. 또한 작업 공간에 있는 테마를 이름으로 지정해 전환하거나, AI Chat에 이미지를 첨부하고 “make it look like this”라고 요청할 수도 있습니다.

예시

Make the app darker and use our brand blue.

앱에 대해 질문하기

이제 앱 자체에 대해 질문할 수 있습니다. “What does this button do?”, “Why is this table empty?” 또는 특정 변수를 사용하는 구성 요소가 무엇인지 물어볼 수 있습니다. AI는 앱의 페이지 및 버튼 이름을 사용하여 현재 앱을 기준으로 답변하며, 앱은 전혀 변경되지 않습니다.

제품 관련 질문도 이제 Ignite UI를 다루며, 출처 링크가 함께 제공됩니다.

각 요청 확인 및 제어

이제 진행 상황이 “Reading your app’s current state - 5 pages” 또는 “Writing the pages - 3 of 4”와 같은 실시간 단계 목록으로 채팅과 캔버스에 표시됩니다. 언제든지 요청을 중지하거나, 요청을 편집하여 다시 실행하거나, 실패한 요청을 다시 시도할 수 있습니다.

예시

요청이 진행 중이며, 채팅에는 실시간 단계 목록이, 캔버스에는 동일한 단계가 표시되고 Stop 버튼이 있습니다.

요청이 완료되면 결과, 소요 시간, 사용된 크레딧을 보여주는 상태 줄이 표시되고, 이어서 변경 사항에 대한 간단한 요약과 세 가지 다음 단계 제안이 표시됩니다.

예시

요청이 완료되어 상태 줄, 요약, 제안이 표시됩니다.

단계, 소요 시간, 크레딧을 보여주는 상태 줄, 변경 사항 요약, 세 가지 다음 단계 제안이 표시된 App Builder의 완료된 AI 요청

AI 크레딧

AI 요청에는 크레딧이 사용됩니다. 30일마다 100크레딧이 제공되며, 사용하지 않은 크레딧은 이월되지 않습니다. 각 요청 유형에는 기본 가격이 있습니다.

요청	크레딧
앱에 대한 질문 또는 제품 관련 질문	1
앱 전체 변경을 포함한 기존 요소 변경	5
페이지 및 네비게이션 변경	5
외관(테마 및 색상) 변경	7
새 페이지 또는 섹션 추가	10
앱 전체 생성	20

생성된 페이지, 섹션, 데이터 소스, 이미지마다 1크레딧이 추가됩니다. 실패하거나 취소된 요청은 무료이며, AI가 사용자에게 질문하는 턴도 무료입니다. 잔액은 채팅에 표시되며, 각 응답에는 해당 비용이 표시됩니다. 크레딧을 모두 사용한 경우 채팅에서 100크레딧의 일회성 보너스를 받을 수 있습니다.