Wahnsinnig viel hat sich in den letzten Jahren bei Model-Driven Apps nicht verändert. Jetzt hat Microsoft seinen Low Code-Apps einen neuen Look verpasst. Um ihn auszuprobieren, mussten wir nur einen Schalter umlegen (und mit einigen Bugs klarkommen).
In Kürze
Die Model-Driven Apps werden in Waves modernisiert. Seit 2026 ist „Welle 1“ („New Look“) Pflicht und eine Rückkehr zum klassischen Look nicht mehr möglich.
Nun landet Welle 2, die „Aktualisierung von Kopfzeile und Navigation“ (Header and navigation refresh): seit September 2026 ist sie allgemein verfügbar, muss aber für jede App individuell aktiviert werden (zumindest bisher 🙂).
Was sich ändert: Die Apps bekommen eine moderne, helle App-Kopfzeile, eine schlankere Sitemap, die Befehlsleiste steht wieder in vollem Glanz voller Breite zur Verfügung, und Systembefehle wie „Diagramm anzeigen“ wandern an dritte Stelle nach „Neu“ und „Löschen“, außerdem werden die Abstände in der Befehlsleiste geringer.
Im Bedienalltag ist das ein Segen: auf Formularen bleibt nur die Befehlsleiste fixiert, der Formularkopf scrollt mit und beim Scrollen erscheint eine kompakte fixierte Kopfzeile mit Datensatzname und Registerkarten. So bleibt mehr Platz für die eigentlichen Inhalte des Formulars.
In Model-Driven Apps, die viel Inhalte zeigen, zum Beispiel unsere Verwaltungs-App in Coleida Workflow, ist das für Power User ein echter Gewinn.
Dazu gibt es neue Darstellungseinstellungen mit Anzeigedichte (aktuell in Preview, und gewohnt holprig übersetzt): Komfortabel, Gemütlich, Kompakt.
Diese neuen Anzeigemöglichkeiten sind besonders interessant für Teams mit vielen Datensätzen (Sachbearbeitung, Service, Instandhaltung), die sich nie damit abfinden konnten, dass die Kopfzeile so viel Platz einnimmt.
Den Look von Model-Driven Apps aktualisieren: das sind die Voraussetzungen
Vorher: die App mit klassischer Kopfzeile
Ich habe eine kleine Demo-App erstellt, den „Wartungsplaner“ mit fiktiven Wartungsaufträgen.
Der Wartungsplaner sieht aus wie alle Model-Driven Apps die ihr liebt (oder hasst). Besonders relevant für unser Experiment: die App hat die farbige App-Kopfzeile, der „Diagramm anzeigen“-Text ist nicht in der Befehlsleiste sichtbar und das Hilfe-Symbol ist in der Kopfzeile.
im Formular fällt auf: der Kopfbereich mit Name, Kopfzeilenfeldern und Registerkarten bleibt beim Scrollen stehen und belegt rund ein Viertel der Höhe.
Wie sieht die App in Wave 2 aus?
Schritt 1: App-Designer öffnen und die Einstellungen aufrufen
Suche eine deiner (nicht-produktiven) Model-Driven Apps aus, die du bearbeiten möchtest, und navigiere zu https://make.powerapps.com › Lösungen › Lösung öffnen › [Deine App] › Bearbeiten
Im App-Designer öffnest du in der Befehlsleiste „Einstellungen“ (Settings), dann die Registerkarte „Features“.
Hier gibt es einen Eintrag „Aktualisierung der Kopfzeile und Navigation“ (englisch „Header and navigation refresh“), der standardmäßig den Wert „Auto“ hat. Auto bedeutet: aktuell ist das Refresh ausgeschaltet, außer bei Apps aus dem Plan-Designer.
Schritt 2: Aktualisierung einschalten
Das lässt sich ändern: die Auswahl hat drei Werte: Auto, Off, On.
Wähle „On“ und klicke auf „Save“.
Toll: die Vorschau im Designer der Model-Driven Apps zeigt die neue Befehlsleiste sofort.
Schritt 3: Speichern und veröffentlichen
Die App-Einstellungen wirken natürlich erst nach dem Veröffentlichen: „Save and Publish“ oben rechts im App-Designer auswählen.
Jetzt musst du deine F5-Taste malträtieren, bis die App im Play-Modus aktualisiert wird.
Nachher: helle Kopfzeile, neue Befehlsleiste, kompakte fixierte Kopfzeile
Uns fallen sofort ein paar Änderungen auf:
- Die Kopfzeile ist hell statt farbig hinterlegt, die Symbole sind kleiner, und das Hilfe-Symbol ist verschwunden (zur Hilfe kommt man nun über die Einstellungen).
- In der Befehlszeile steht zuerst „Neu erstellen“, dann „Löschen“, dann erst „Diagramm anzeigen“ (aber letzteres mit Text).
- Im Formular ist der Kopfbereich etwas niedriger, und: er scrollt mit (🎉), aber beim Scrollen bleibt nur eine schmale Leiste mit Datensatzname und Registerkarten stehen (🎉🎉).
- Wir haben es mal nachgemessen: vorher hatte der fixierter Kopf eine Höhe von genau 245 Pixel, nun nur noch von 130 Pixeln inklusive Befehlszeile. Viiiiiel besser!
- Übrigens: eigene Farben für die Kopfzeile sind weiterhin über die „Modern Designs“ (Theme-Override) möglich.
Schritt 4: Anzeigedichte für die App freischalten
Wir haben ein interessantes Phänomen beobachtet: die Registerkarte „Darstellung“ erscheint nach dem Einschalten des Refreshs, und die Auswahl der Dichte wird brav gespeichert, es ändert aber nichts. Hö? Sollte die Änderung der Dichte nicht die Einträge kuschlig nahe zusammenrücken lassen?
Die Ursache: die App-Einstellung „Display Density“ in den „Upcoming“-Einstellungen der App steht standardmäßig auf „Off“; dann gilt immer die Dichte „Komfortabel“ und deine persönliche. Einstellungen werden ignoriert (laut Doku werden die Optionen dann ausgeblendet, bei uns waren sie trotzdem sichtbar).
Schritt 5: Persönliche Anzeigedichte wählen
Jetzt können wir die Dichte auch Benutzer-individuell einstellen:
In der App müssen wir auf das Zahnrad (Einstellungen) klicken, dann › „Persönliche Einstellungen“ › Registerkarte „Darstellung“
Hier gibt es wieder die vier Optionen: Auto (Standard der App), Komfortabel, Gemütlich und Kompakt.
Diese Einstellungen gilt für diesen Benutzer für alle Model-Driven Apps mit Welle 2 und, wird sofort gespeichert.
Ein kleiner Stolperstein ist die deutsche Oberfläche: im Oktober 2026 zeigt die Registerkarte nur Ressourcenschlüssel statt Texten („mainPage.tabTitle.appearance“, „appearanceTab.displayDensity.option.auto / comfortable / cozy / compact“); die vierte Option ragt aus dem Dialog, ist aber anklickbar.
Die Anzeigedichten im Vergleich
Wir haben ein kleines Experiment durchgeführt: die gleiche Ansicht und das gleiche Fenster (1600 × 900 Pixel) mit 20 Datensätzen im Wartungsplaner.
Ist die Einstellung Auto oder Komfortabel, sehen beide identisch aus (klar, denn der App-Standard ist Komfortabel), und es sind 15 Zeilen sichtbar.
Bei gemütlich sind 18 Zeilen sichtbar, und bei kompakt alle 20 Zeilen. Hier ist die Befehlsleiste und der Kopfbereich ebenfalls enger.
Gut zu wissen: nur die Abstände ändern sich, nicht die Größe der Bedienelemente, daher bleibt die Barrierefreiheit (Zielgrößen) der Model Driven-Apps erhalten.
Übrigens: Steuerelemente ohne Fluent-Abstandstoken (also manche Drittanbieter- und PCF-Controls) bleiben vorerst unverändert.
Stolpersteine
Einige Stolpersteine sind uns aufgefallen. Vielleicht wird Microsoft sie zeitnah abstellen, es ist ja ein Preview-Feature 😉
- Ohne „Save and Publish“ passiert nichts, danach muss man die App neu laden (Okay, das hat nichts mit Preview zu tun)
- Die Anzeigedichte wirkt erst, wenn „Display Density“ der App nicht auf „Off“ steht (Registerkarte Upcoming, macht eigentlich auch Sinn)
- Die Deutsche Oberfläche der Darstellungseinstellungen zeigt Ressourcenschlüssel (Das macht keinen Sinn)
- Das Maker-Portal folgt der Sprache des Microsoft-365-Kontos, nicht der Browsersprache; die Bezeichnungen können daher teils englisch sein
- Die „kompakten Befehle“ aus der Vorschau gibt es nicht mehr; die Befehlsleiste wird immer in der vollen Breite gezeigt
- Klassische Designs (Themes) werden nicht mehr berücksichtigt; nur die Kopfzeilenfarbe lässt sich über moderne Designs anpassen
Weiterführende Links
- Modernes, aktualisiertes Design für modellgesteuerte Apps: Welle 2, Aktualisierung von Kopfzeilen und Navigation
- Darstellungseinstellungen für modellgesteuerte Apps (Vorschau): Anzeigedichte
- App-Einstellungen im App-Designer verwalten
- Release-Plan: Optimierte Kopfzeile und Navigation
Suchst du nach Ideen, um mit Model-Driven Apps deine Geschäftsprozesse zu optimieren? Schreibe uns über das Kontaktformular an.