Vibe coding with Power Platform (vibe.powerapps.com)

Power Platform already offers several different approaches to AI-assisted development.

• With Plan Designer, you can build the whole thing by prompting: requirements, user roles, a data model, and finally applications, automations, and agents.
• Power Apps Code Apps allows you to run your own web applications in the Power Platform environment. These can be coded in vibe.
• Generative pages allow you to create an application within a model-driven application. By prompting.
• App Builder, on the other hand, allows you to create apps by prompting the copilot in the chat.

So we definitely need a new way to create AI-assisted apps! And here it comes: Vibe Power Apps.

Vibe Power Apps looks a little different visually compared to other Power Platform products. The main page is divided into three sections

• Home
• Plans​​
• Apps​​

Let’s try it.

Example – Interactive Gantt Chart

Let’s try to implement the same application as before with generative pages.

Our first prompt is the following:

Make page for user to schedule work appointments. I like to have Gantt style view showing work appointments. by default view should show appointments for next 7 days. User can easily add new appointments and edit existing ones (clicking appointment opens the edit form). But user should also be able to drag appointments on gantt view. whole appointment to new location or just drag from the beginning or the end of appointment.

There should be the following tables:
- Work Apointment
- Work Orders

Every work appointment is related to Work Orders.

Make also UI for managing work orders. this can be simple list of work orders. Clicking work order opens for for edit it. User can also create new work orders.

Plan and datamodel

The tool starts by making a plan.

After this, it creates a data model for us.

This seems like a simplified Plan designer. You can’t edit the created plan by typing it yourself (you can by prompting). You can’t edit the tables suggested by the AI ​​in the data model. But you can delete them and replace them with tables you’ve previously created in the dataverse.

App

The application looks pretty much what I hoped for. Significantly better after the first prompt than what I was able to achieve with generative pages.

Work orders are on their own tab.

The application allows you to create new jwork orders and edit existing ones.

Correcting errors

But creating a new work appointment fails. The error doesn’t tell me anything, but I can press the “Fix it” button and the AI ​​will start to figure out what’s wrong.

Finally, the AI ​​states what changes it has made. Now it works!

Except it doesn’t…

After the fifth attempt, I finally realized that the ‘Fix it’ button will never resolve this error. I ask the AI to create the meeting in a different way

can you do this adding new work appointment totally different way? this is not working now at all

No effect. I give up.

New attempt with the same prompt

Even with the same prompt, each attempt produces a slightly different result. So let’s just try again.

This time the end result is the following.

And now you can add work appointments!

However, appointments never appear in the Gantt view on the home page.

I ask AI to fix this. AI clearly states what it is trying to do and how it went.

The end result works. It still looks terrible.

However, after a few prompts, this is already usable. Appointments are grouped by engineer and can be conveniently rescheduled by dragging.

Can the generated code be modified?

No. The code cannot be edited, and different versions cannot be compared. However, the code is structured in a clear manner.

The tool also doesn’t have an undo functionality, although you can always ask the AI ​​to cancel the changes.

I would trust a proper undo function more.

Publish

In order for others to use the application, the necessary tables must be created and the app must be published. This is done from the top right corner.

After this, you can share the application in the Apps section (or directly from the editor).

This ishow it looks like to the end user. Just like any Power Apps canvas.

And like the canvas in Power Apps, the generic top bar can also be hidden here (hideNavBar=true).

Where is all this stored?

Vibe Power Apps are always created in an environment.

Everything (applications, plans, created tables, etc.) can be found in the default solution for that environment (Common Data Services Default Solution).

Summary

Vibe Power Apps combines the best of Power Apps Code Apps, App Builder, and generative pages.

• You can build solutions on top of Dataverse
• You can let AI create the necessary tables or add existing ones
• The application can be run alone (no need to embed it in model-driven or copilot)
• The end result seems better and it’s faster to build (vs generative pages and App Builder)
• The example application (gantt chart) is clearly faster than the equivalent one implemented with generative pages.
• AI comprehensively explains what it is doing at any given time and why
• If the application ends in an error, you can directly ask the AI ​​to fix the error.
• The created elements are already in the (default) solution , so hopefully we will soon be able to do these directly in our own solutions.

The feature is in preview, so don’t get your hopes up just yet. But these tools are definitely coming and changing the way we build solutions.