KI in Canvas

Kann KI eine echte Canvas App bauen? Der ehrliche Praxistest (MCP)

Canvas Apps sind meine bevorzugte App-Art, weil andere sie nutzen können, ohne eine teure Premium-Lizenz zu haben. Der große Nachteil: Bisher musstest du jedes Steuerelement händisch einfügen, positionieren und jede Formel selbst schreiben. Das kostet Zeit. Genau hier setzt der MCP-Server an. Er verbindet eine KI (Claude oder Copilot) mit deiner Power App, sodass du in wenigen Sätzen komplette Apps erstellen oder bestehende Apps bearbeiten lassen kannst. Ich zeige dir Schritt für Schritt, wie du den MCP-Server einrichtest und deine erste App von der KI bauen lässt.

MCP steht für "Model Context Protocol". Es verbindet dein Modell (die KI) mit dem Context (deiner Power App) über feste Regeln (die Protocols). Kurz gesagt: Die KI bekommt einen kontrollierten Zugang zu deiner App.

Schritt 1: .NET Version installieren

Bevor du starten kannst, brauchst du zuerst eine .NET-Version 10.0 oder höher auf deinem PC. Prüfe deine aktuelle Version über PowerShell mit:

dotnet --version

Ist keine oder eine zu alte Version installiert, lädst du die aktuelle über winget herunter:

winget install Microsoft.DotNet.SDK.10

Bestätige die Installation anschließend mit „Y".

Danach schließt du PowerShell, öffnest eine neue Instanz und prüfst die Version erneut:

dotnet --version

Schritt 2: Claude installieren

Als Nächstes installierst du Claude Code über PowerShell. Der Befehl lädt das Installationsskript und führt es direkt aus:

irm https://claude.ai/install.ps1 | iex

Claude wird installiert (1) – allerdings mit dem Hinweis, dass der Path noch nicht gesetzt ist (2). Solange das so ist, können andere Programme nicht auf Claude zugreifen.

Schritt 3: Path-Variable setzen

Damit Windows Claude findet, musst du den Installationspfad in die Umgebungsvariablen eintragen. Suche in der Windows-Suchleiste nach „Umgebungsvariablen für dieses Konto bearbeiten" (1) . Im Fenster machst du einen Doppelklick auf „Path" (2), klickst auf „Neu" und fügst genau den Pfad ein, den PowerShell dir vorher angezeigt hat (3).

Bestätige zweimal mit „OK".

Öffne danach eine neue PowerShell-Instanz und prüfe, ob der Path korrekt ist (4):

claude --version

Erscheint eine Version, ist der Path richtig gesetzt.

Schritt 4: Bei Claude anmelden

Jetzt musst du dich anmelden, um deinen bezahlten Account nachzuweisen. Öffne Claude in PowerShell (1), wähle deine Einstellungen (zum Beispiel „Dark Mode") (2) und dann „Claude account with subscription" (3). Es öffnet sich ein Browserfenster.

Melde dich mit deinem Claude-Account an und gib den Verifizierungscode aus der E-Mail ein. Autorisiere den Zugriff und kopiere den Authentifizierungscode zurück in PowerShell (4).

Schritt 5: Projektordner anlegen

Claude fragt, ob es dem aktuellen Ordner vertrauen soll. Bei mir war das der System-Ordner mit allen Programmen. Lege am besten einen eigenen Projektordner an. Mit „Escape" verlässt du Claude und landest wieder in PowerShell.

cd ~

mkdir PowerApp-Projekt

cd PowerApp-Projekt

claude

Damit öffnest du Claude erneut, diesmal aber im Context deines Projektordners.

Schritt 6: Claude-Plugins installieren

Zum Schluss brauchst du zwei Claude-Plugins. Das erste holst du dir aus dem Marketplace („Power Platform Skills"), das zweite ist das „Canvas Apps"-Plugin. Beide installierst du im User-Scope, das reicht für unsere Zwecke völlig aus.

/plugin marketplace add microsoft/power-platform-skills

/plugin install canvas-apps@power-platform-skills

Damit ist die Einrichtung abgeschlossen.

Schritt 7: Gemeinsame Dokumentenerstellung aktivieren

Wechsle jetzt in die App, die du bearbeiten möchtest. Damit KI und MCP-Server wirklich zugreifen können, musst du die „gemeinsame Dokumentenerstellung" aktivieren. Das findest du über die drei Punkte oben unter „Einstellungen" → „Updates". Aktiviere diese Aktion und speichere die App.

Schritt 8: Datenquelle in der App hinzufügen

Wichtig: Datenquellen fügt der MCP-Server bewusst nicht hinzu. Das ist Absicht, weil dabei nach Credentials gefragt wird und darauf soll die KI keinen Zugriff bekommen. Verbinde deine Datenquelle also selbst, in meinem Beispiel eine SharePoint-Liste namens „Schulungskatalog".

Schritt 9: MCP-Server mit der App verbinden

Jetzt verbindest du die App mit dem MCP-Server. In Claude startest du die Konfiguration über: 

/configure canvas-mcp

Claude fordert dich danach auf, die URL einzufügen. Kopiere die komplette URL zur App im Entwicklermodus, füge sie ein und bestätige mit „Enter". Danach kannst du die Verbindung testen z.B. mit:

Liste alle Bildschirme auf

Als Ergebnis siehst du die vorhandenen Screens (bei mir „Screen 1").

Schritt 10: Galerie per Prompt erstellen lassen

Jetzt kannst du über PowerShell der KI Anweisungen übergeben, um dich bei der Entwicklung unterstützen zu lassen. In meinem Beispiel lasse ich eine „Gallery" (eine Liste zum Anzeigen der Daten) mit den Daten aus „Schulungskatalog" einfügen. Mit dem Zusatz „bitte keine Planung" verhinderst du, dass dir die KI vorher eine Planung zeigt.

Füge eine Galerie mit den Daten aus Schulungskatalog ein. Bitte keine Planung.

Optional gibst du ein Referenzbild vor, wie die App aussehen soll. In PowerShell fügst du ein Bild mit „Alt" + „V" ein. Nach kurzer Zeit ist die KI fertig.

Schritt 11: Ergebnis prüfen und weiter anpassen

Im Ergebnis ist die Galerie korrekt mit der SharePoint-Liste verbunden: Überschriften, farblich hinterlegte Kategorien, eine Bewertung und die Teilnahmequote als Prozentsatz. Perfekt ist das noch nicht, aber den Großteil der Arbeit hat die KI übernommen. Von hier aus hast du zwei Wege:

• Änderungen händisch im Studio vornehmen.
• Weitere Anpassungen erneut per PowerShell prompten.

Genauso lassen sich ganze Kanban Boards, Kalender oder Genehmigungs-Apps aufbauen.

Mein Fazit

Meiner Meinung nach hält der MCP-Server sein Versprechen. Ich habe ihn wochenlang für echte Anwendungsfälle genutzt – Genehmigungs-Apps, Kanban Boards, Kalender – und ihn auch mit Power Automate und SharePoint-Formularen verbunden. Er hat mir enorm viel Zeit gespart und gute Ergebnisse geliefert. Ein Nachteil bleibt: Nicht in jedem Unternehmen darfst du .NET, Claude und Plugins so einfach installieren. In dem Fall lohnt sich der Blick auf die integrierte Vibe-Coding-Plattform von Power Apps (Tutorial: https://www.powerappstrainer.de/blog/vibe-coding).

Ich hoffe, diese Anleitung hilft dir dabei, deine erste Canvas App per KI zu erstellen.

Melde dich gerne für meinen Newsletter an, in dem ich dir Tipps und Tricks rund um Power Apps & Power Automate zusende.

 Hier geht's zum Detailvideo: