# Using AI Wiz in the Page Editor

If you are looking for ideas regarding the design/layout or content of a page, AI Wiz will be your best friend!

AI Wiz uses [Generative Artificial Intelligence (AI)](https://en.wikipedia.org/wiki/Generative_artificial_intelligence) to generate content based on instructions in plain english.

Generative AI makes use of [large language models (LLMs)](https://en.wikipedia.org/wiki/Large_language_model) and [generative pre-trained transformers (GPT)](https://en.wikipedia.org/wiki/Generative_pre-trained_transformer) to output very effective content that can be used as a starting point or reference when you are designing a page for your app.

The page editor AI Wiz can be accessed from the [page element library](https://docs.zingy.ai/app-editor/page-editor-tour#page-element-library) under the **`AI Wiz`** category.

<div align="left"><figure><img src="https://3401585094-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FmnBepgycwgisXr9ya1N4%2Fuploads%2Faan1rRjhfOfXyfoAUAd3%2Fimage.png?alt=media&#x26;token=baeef3dd-3f7b-4492-8500-e7e563a6c74b" alt="AI Wiz in Page Editor" width="209"><figcaption><p>AI Wiz in Page Editor</p></figcaption></figure></div>

Choose the 'Create' button to specify what you want in the screen that follows.

<div align="left"><figure><img src="https://3401585094-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FmnBepgycwgisXr9ya1N4%2Fuploads%2F5ybKQBX3ptBxCpRRaL5q%2Fimage.png?alt=media&#x26;token=6e553069-58e9-4d7e-849f-d8ae781d6935" alt="" width="563"><figcaption></figcaption></figure></div>

A new element appears in the library under the AI Wiz category. The element is grayed out until the processing completes and is shown in green once ready.

<div align="left"><figure><img src="https://3401585094-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FmnBepgycwgisXr9ya1N4%2Fuploads%2FdyMdP8Z4hjFTmubtuuTK%2Fimage.png?alt=media&#x26;token=645d35e5-7c79-46e2-8931-5f9859e65a90" alt="" width="200"><figcaption></figcaption></figure></div>

You can drag and drop the new element just like the built-in elements in the library and have these elements referenced by your Page Flow logic.

***

### AI Wiz Examples

The video below shows a simple conference welcome screen layout and content generated by AI Wiz.

{% embed url="<https://youtu.be/m_7mOKCbPYc>" %}
AI Wiz: Conference welcome screen
{% endembed %}

In this second example, we make AI Wiz generate a home screen for a student management software.

{% embed url="<https://youtu.be/b9uqA4u-As4>" %}
AI Wiz: Student management software home screen
{% endembed %}

Lastly, for a more complex example, we make AI Wiz generate the main screen for a project management software.

{% embed url="<https://youtu.be/EgX2lr8Efho>" %}
AI Wiz: Project management software main screen
{% endembed %}

In addition to generating designs and layouts, AI Wiz can also generate write-ups and textual content based on any topic.

e.g. ***short write up on penguins*** produces:

<div align="left"><figure><img src="https://3401585094-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FmnBepgycwgisXr9ya1N4%2Fuploads%2F24DQzKXoEGNrEP15TwiI%2Fimage.png?alt=media&#x26;token=57c08dc9-16bb-489d-beaf-ed67d626d1c9" alt=""><figcaption></figcaption></figure></div>

{% hint style="warning" %}
Note: AI Wiz may produce slightly different content for each run for the same input.
{% endhint %}

{% hint style="danger" %}
Every account gets a limited number of free AI Wiz credits every month. You can however, purchase add-on AI Wiz credits if you need to generate content beyond the free quota.
{% endhint %}
