BeginnerFree to start

Build an AI App That Creates Interfaces

Turn an idea into an interactive AI application.

Start with a working example, customize it into your own application, and learn what is happening underneath as you build.

Start now See an example

No AI engineering experience required.

What you’ll build

An AI application that responds with interactive interfaces instead of only text.

A working example

See the workflow before you build it.

Try: “Help me find scholarships for a high-school senior interested in environmental science.”

The app asks useful follow-up questions, presents relevant opportunities, and lets the student explore the results.

Scholarship Navigator

Project preview

Help me find scholarships for a high-school senior interested in environmental science.

Working through the project

Future Earth Scholars

$5,000 · Due Oct. 15

Green Leaders Award

$2,500 · Due Nov. 2

What you can make

Start from the same foundation. Make it yours.

Use the project for your community, organization, business, research, or idea.

Scholarship Navigator

Help students discover and explore opportunities.

Community Resource Finder

Help people navigate local services and programs.

Small Business Assistant

Create intake forms, recommendations, quotes, and customer experiences.

Research Explorer

Turn information or datasets into interactive experiences.

Start with your own idea

What you’ll learn

Understand what is happening underneath.

Finish with a working project and a practical understanding of the choices behind it.

Generate interfaces from natural-language requests

Give AI a defined set of components it can use

Turn structured AI output into interactive UI

Connect user interactions back to the AI

Modify the application for your own use case

Understand basic cost, privacy, and safety considerations

Take the project with you and continue building

What we’ll use

Open tools, explained as you go.

You do not need to know these tools beforehand. The guide introduces each one when you encounter it.

Vercel AI SDK

Connect the model to the application

JSON Render

Turn structured output into components

Next.js

Build and run the web application

Your AI model

Use a supported model of your choice

How the guide works

Learn by doing the real workflow.

Try it

Start with a working generative interface.

Change it

Customize the example and see what responds.

Make it

Build your own and study the technology underneath.

Ready to build?

Turn your idea into an interface.

~60 minutes Beginner Practical project

Start now

Part of the AFAI AI Toolkit · Practical, open resources for everyone