Generera en sida med naturligt språk

Använd naturligt språk för att skapa en generativ sida som skapas med hjälp av AI. Generativa sidor är en AI-driven upplevelse som är utformad för att förenkla, påskynda och förbättra din appdesignprocess i modellbaserad app. Genom att interagera med appagenten skapar du fullständigt funktionella sidor i dina modelldrivna appar genom att beskriva vad du behöver på naturligt språk och ange vilka Microsoft Dataverse tabeller som ska refereras till. Du kan till och med bifoga en bild av hur du vill att sidan ska se ut.

När du har beskrivit sidan bearbetar systemet sedan dina krav och specifikationer och genererar intelligent React-kod som täcker både front-end-användarupplevelsen genom att välja rätt komponenter och bestämma den bästa layouten och motsvarande affärslogik. Genom en interaktiv konversationsupplevelse kan du förfina siddesignen i realtid och justera element, layout och funktionalitet så att den perfekt matchar din vision.

Utvecklingsmetoder

Du kan skapa generativa sidor med två metoder:

• Power Apps (make.powerapps.com): Enligt beskrivningen i den här artikeln kan skapare skapa och iterera på generativa sidor direkt i webbläsaren med hjälp av en konversationsgränssnittsupplevelse
• VERKTYG för AI-kodgenerering: Utvecklare som föredrar att arbeta med lokala utvecklingsverktyg och direkt åtkomst till TypeScript- och React-kod kan använda externa verktyg som Claude Code för att utveckla generativa sidor lokalt med en kod-första-metod och CLI-baserad distribution. Mer information: Skapa och redigera generativa sidor med AI-kodgenereringsverktyg

Förutsättningar

• Power Platform-miljön måste finnas i regionen USA. Den här funktionen är för närvarande inte tillgänglig i andra regioner än.

Skapa en generativ sida i modellbaserade appar

1. Logga in på Power Apps.

2. Öppna en modellbaserad app för redigering.

3. I appdesignern väljer du Lägg till en sida>Beskriv en sida.

   En generativ upplevelse i helsidesformat öppnas.

4. I textrutan skriver du en beskrivning av den typ av sida som du vill skapa. Beskrivningen bör innehålla funktionskrav och eventuellt UX-specifikationer. Du kan till exempel ange Skapa en sida som visar kontoposter som ett galleri med kort med ett modernt utseende och känsla. Inkludera namn, entitetsbild högst upp och webbplats, e-post, telefonnummer. Gör galleriet rullningsbart med hjälp av data från Kontotabellen.

5. Lägg till tabeller och bilder efter behov genom att välja Lägg till data>Lägg till data. Du kan länka upp till sex Dataverse-tabeller. I skärmbilden läggs kontotabellen till.

6. Du kan också ladda upp en eller flera bilder för att vägleda användargränssnittet för din genererade sida genom att välja Lägg till data>Bifoga bild. Detta kan vara en enkel skiss på en servett eller en bild med högre upplösning. Bilden kan representera strukturen eller layouten för hela sidan som du vill skapa eller det kan vara visuella objekt för ett visst avsnitt eller en viss komponent som du vill efterlikna.

   Anteckning

   Om du vill att den genererade sidan ska visa en viss bild kan du (1) inkludera bilden i en refererad Datatable-tabell och låta agenten hämta bilden därifrån, (2) vara värd för bilden offentligt och ge agenten URL:en, eller (3) lägga till bilden som en webbresurs och ge agenten URL:en för webbresursen.

7. Du kan också aktivera eller inaktivera verktyget Inkludera bilder (förhandsversion) så att agenten kan använda bilder från ett kuraterat, säkert bibliotek med 25 000 stockbilder som stöd för användningsfall som standardbilder/platshållarbilder, dekorativa bakgrunder, statiska innehållsblock och rikare tomma eller feltillstånd.

8. Du kan också välja den AI-modell som du vill använda för att generera sidan.

9. När du är klar med att beskriva sidan väljer du Generera sida.

Agenten påbörjar en byggprocess i flera steg som du kan observera i realtid:

• Tankeströmning: Agenten inleder med att beskriva sin tolkning av din uppmaning, inklusive listade krav, antaganden och en genomförandeplan.
• Kodgenerering: Därefter skrivs den underliggande koden för din sida baserat på planen.
• Transpilering: Den genererade koden överförs sedan för att säkerställa kompatibilitet och korrekt återgivning.
• Slutlig återgivning: Slutligen visas den slutförda användarupplevelsen.

Om användarupplevelsen inte visas i slutet av den här processen kan du visa den genom att välja fliken Förhandsversion .

Visa den genererade koden, iterera och publicera

När du har genererat sidan har du flera alternativ för att förfina och slutföra den:

1. Visa och redigera den genererade koden Välj fliken Kod för att visa koden som genereras av appagenten.

   Du kan förfina utdata på två sätt:

   • Iterativt chatta med appagenten för att åtgärda fel, justera layouten eller lägga till funktioner.
   • Redigera koden manuellt genom att välja Redigera på fliken Kod. När du har gjort några ändringar kan du välja Spara för att checka in ändringarna som en ny iteration eller Avbryt om du vill ignorera ändringarna.

   Lär dig mer om dataApi-objektmetoder som används för dataåtgärder

2. Jämför iterationer När du har slutfört två eller flera iterationer med agenten kan du välja Jämför på fliken Kod för att visa ett koddiff mellan den aktuella och föregående iterationen.

   Anteckning

   Den här funktionen är för närvarande endast tillgänglig från och med den andra iterationen i den aktuella sessionen.

3. Bifoga en skärmbild för snabbreferens I chattmiljön väljer du Bifoga>lägg till skärmbild för att ta med en skärmbild av den aktuella förhandsversionen med din nästa interaktion med appagenten. En skärmbild är användbar för att justera de visuella objekten på sidan. Du kan också bifoga andra bilder för att förfina de visuella objekten på hela sidan eller en viss del av sidan.

4. Sök efter hjälpmedelsproblem (ny) Efter varje iteration av kodgenereringen genomsöker Hjälpmedelsassistenten längst ned på skärmen den genererade koden som utvärderar den med avseende på tillgänglighet. Du kan se en statusuppdatering på hög nivå direkt på skärmen och kan välja att öppna de detaljerade resultaten i en panel. Välj Automatisk korrigering för att skicka eventuella överträdelser direkt till agenten för att försöka lösa problemet automatiskt.

5. Spara och publicera I kommandofältet väljer du Spara för att undvika att förlora förloppet på sidan. När du är nöjd med sidan väljer du Spara och Publicera för att publicera alla väntande ändringar för appen, inklusive eventuella generativa sidor.

Lägga till generativa sidor i lösningar

Generativa sidor är lösningsmedvetna och kan läggas till i en lösning (via en app) för att underlätta flyttning mellan miljöer. Gör följande för att lägga till en generativ sida i en lösning:

1. Lägg till appen som innehåller dina generativa sidor i en lösning
   • I Power Apps väljer du Solutions i det vänstra navigeringsfönstret och öppnar önskad lösning.
   • Välj Lägg till befintlig > Appmodellstyrd > app.
   • Välj den app som innehåller de generativa sidorna.
2. Exportera lösningen (som administrerad eller ohanterad)
   • Se till att appwebbplatskartan ingår i lösningen. Om inte, bör det begäras under beroendekontroller.
   • Generativa sidor (visas som projektrader för UX-agent ) begärs också baserat på deras beroende av webbplatskartan.

Efter exporten kan du importera appen och generativa sidor till en annan miljö. När den öppnas i designern i målmiljön är endast den första prompten och den publicerade koden tillgänglig. Den fullständiga agentkonversationen överförs inte med sidan.

Begränsningar

Det här är de nuvarande begränsningarna för generativa sidor:

• Sidan kan ansluta till endast Dataverse-tabeller (upp till 6 för en enskild sida). Inga andra datakällor kan användas.
• Din fråga kan innehålla högst 50 000 tecken.
• Endast innehåll på amerikansk engelska stöds.
• Samarbete stöds inte. Se till att endast en utvecklare arbetar med en generativ sida i taget för att undvika oavsiktliga konflikter.
• Endast dessa datatyper stöds:
  • Alternativ
  • Currency
  • Customer
  • Datum och tid
  • Endast datum
  • Decimaltal
  • Flyttalsnummer
  • Image
  • Sökning
  • Flerradig text
  • Tillstånd
  • Tillståndorsak
  • Text
  • Heltal
  • Ja/Nej
  • Unik identifierare

Vanliga frågor

Kan jag börja designa min app i plandesignern och sedan använda generativa sidor?

Ja, även om det för närvarande inte finns någon direkt integrering mellan planer och generativa sidor kan du använda planer för att definiera tabeller och appar och sedan växla till den modelldrivna appdesignern för att skapa önskade generativa sidor.

Behövs det några extra avgifter eller krediter för att använda generativa sidor?

Nej, skaparupplevelsen för generativa sidor (och planer) kräver inga ytterligare AI- eller meddelandekrediter.

Vilken typ av bilder fungerar bäst för att vägleda UI-genereringen?

Det beror på ditt mål. Om du vet exakt hur du vill att den sista sidan ska se ut är tydliga och detaljerade skisser eller trådramar (oavsett om de är handritade eller digitala) mest effektiva. Om du bara har ett allmänt koncept och vill att agenten ska fylla i detaljerna kan snabba whiteboardskisser eller till och med servettritningar fungera bra.

Kan jag använda generativa sidor med arbetsyteappar eller andra typer av appar?

Nej, generativa sidor stöds för närvarande endast i modellbaserade appar.

Finns det något sätt att återanvända eller klona en generativ sida i olika miljöer?

Ja, generativa sidor är lösningsmedvetna element som kan flyttas mellan miljöer. Endast den senast publicerade versionen av koden och den första prompten underhålls med lösningen. den fullständiga revisionshistoriken finns kvar i den ursprungliga miljön.

Kan jag redigera den genererade koden manuellt?

Ja. Du kan redigera den genererade koden manuellt genom att välja Redigera på fliken Kod . Dina ändringar sparas som en ny iteration. Välj Avbryt om du vill avbryta redigeringarna om du väljer att inte behålla dem.

Är koden som genereras av generativa sidor garanterad att vara produktionsklar och kompatibel med min organisations standarder?

Nr. Agenten gör ett bästa försök att skapa högkvalitativ, produktionsklar kod med metodtips för tillgänglighet och säkerhet i åtanke, men det är ditt ansvar att verifiera utdata. Granska alltid den genererade koden så att den överensstämmer med organisationens standarder, principer och efterlevnadskrav.

Hur ger jag feedback om funktionen?

Det bästa sättet att ge feedback på generativa sidor är att använda tummen upp/ned-knapparna i chattupplevelsen som är tillgängliga efter varje iteration. Vi rekommenderar också starkt att du väljer Ja på Dela relevanta innehållsexempel och ytterligare loggfiler så att vi kan felsöka eller försöka återskapa eventuella problem som du har stött på med funktionen.

Vad gör jag om generativa sidor inte är aktiverade i min miljö?

Bekräfta att din miljö finns i regionen USA.

Relaterade artiklar

• Skapa och redigera generativa sidor med ai-kodgenereringsverktyg
• Vanliga frågor och svar om generativa sidor i modellbaserade appar
• Juridiska villkor