より高品質で、より精密なAI：App Builderの新機能

App Builderの2026年7月と10月のリリースでは、AIの品質と精度が向上しました。より完成度の高いアプリの生成、依頼した部分だけを変更する編集、デザインにより忠実な結果、そして各リクエストのリアルタイムな進行状況表示を実現しています。さらに、Apex ChartsとIgnite UI for Angular 22へのアップデートも含まれます。

Georgi Anastasov Last Updated Oct 28, 2026 3min read

前回の記事以降、App Builderは2026年7月と10月に2つのリリースを提供しました。どちらも、AIからより良い結果を得るという1つの目標に焦点を当てています。7月のリリースでは、生成に使用するモデルをより新しく精度の高いものに移行し、生成を高速化しました。10月のリリースでは、AIによるアプリの生成と編集の仕組みを刷新しました。これにより、生成されるアプリの完成度が高まり、編集は依頼した内容の範囲にとどまるようになりました。

主なハイライトは次のとおりです。

最初のプロンプトからより良いアプリを - 動作するデータ、アクションが設定されたボタン、アプリの主題に合ったテーマ。
より精密な編集 - 1つのコンポーネント、アプリ内で一致するすべての要素、またはページとナビゲーションを変更し、それ以外はそのまま維持します。
デザインにより忠実な結果 - モックアップを添付すると、アプリはそのページ、テキスト、カラーパレットに従って生成されます。
進行状況の確認と制御 - 各ステップを確認し、いつでも停止でき、プロンプトの編集や再試行も可能です。
デザイナーの新機能 - Apex ChartsとCarouselのSelectアクション。

より高品質で、より精密なAI

これらの改善は、App BuilderでAIを使用するすべての場所に適用され、3つのエントリーポイントはすべて同じチャット履歴を共有します。

Create with AI（メインページ）：新しいアプリを作成します。
AI Chat（デザイナー）：開いているアプリを生成、変更したり、アプリについて質問したりします。
Edit with AI（選択したコンポーネント）：そのコンポーネントを変更したり、コンポーネントについて質問したりします。

7月のリリースでは、その基盤が築かれました。より新しく精度の高いモデル、添付画像の処理の改善、複数ビューのナビゲーション、データバインディング、データリピーターのレイアウトの改善、そして生成の高速化です。画像は、アプリを使用している間にバックグラウンドで生成が完了します。

最初のプロンプトからより良いアプリを

各アプリは、構築される前に計画されるようになりました。ページ、ナビゲーション、データ、そしてそのアプリの主題ならではの要素が計画されます。ページ名、文言、機能はリクエストの内容から決まります。

その結果、生成が完了した時点で、アプリのより多くの部分が動作するようになりました。

データは、それを使用するグリッド、チャート、リストと一致します。
入力フィールドは値を保持し、チェックボックスがオンになるまでボタンを無効のままにすることができます。
ボタンは実際のページに移動したり、ダイアログを開閉したり、SaveやExportなどのアクションでは確認メッセージを表示したりします。
テーマはアプリの主題に合い、指定した16進カラーコードを使用し、背景に対してテキストの読みやすさを保ちます。

テーマや1つのページなど、一部を完成できない場合でも、アプリの残りの部分は提供され、サマリーに不足している内容が示されます。

例

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”はカラーパレットを変更し、1つのコンポーネントの色を変更した場合はそのコンポーネントだけに影響します。また、ワークスペース内のテーマに名前で切り替えたり、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ボタンが表示されています。

リクエストが完了すると、結果、所要時間、使用したクレジットを示すステータス行が表示され、その後に変更内容の簡単なサマリーと、次のステップの提案が3つ表示されます。

例

リクエストが完了し、ステータス行、サマリー、提案が表示されています。

ステップ、所要時間、クレジットを示すステータス行、変更内容のサマリー、3つの次のステップの提案が表示された、App Builderで完了したAIリクエスト

AIクレジット

AIリクエストにはクレジットを使用します。30日ごとに100クレジットが付与され、未使用のクレジットは繰り越されません。リクエストの種類ごとに基本料金が設定されています。

リクエスト	クレジット
アプリに関する質問、または製品に関する質問	1
既存の要素の変更（アプリ全体の変更を含む）	5
ページとナビゲーションの変更	5
外観（テーマと色）の変更	7
新しいページまたはセクションの追加	10
アプリ全体の生成	20

生成されるページ、セクション、データソース、画像ごとに1クレジットが加算されます。失敗したリクエストやキャンセルされたリクエスト、そしてAIがユーザーに質問するターンは無料です。残高はチャットに表示され、各返信にはそのコストが表示されます。クレジットを使い切った場合は、チャットから1回限りの100クレジットのボーナスを受け取ることができます。