All tracks
Your First 15 Minutes: Watching an Idea Become a Screen
Free · Basics

Your First 15 Minutes: Watching an Idea Become a Screen

From sign-up to your first saved build, the shortest win for someone who arrived today

about 25 min12 steps

What you will have built

Complete the Studio's core flow yourself, from typing a prompt through clarify, blueprint, build, and phone preview to saving, and keep your first creation in My builds.

What you need

  • A VibeCampus accountoptional

    Don't have one yet? That's fine. We create it together in step two of this course. Signing up is free.

1

Fifteen minutes from now, this screen is in front of you

This is not a daydream, it's a preview. A Pilates studio site with a neatly arranged class schedule, trainer profiles with photos, and at the bottom, a booking form that actually accepts input. That is what will be sitting on your screen fifteen minutes from now.

What you need to build it is not coding skill but a single sentence. You write the sentence, the AI writes the code, and along the way you click a few options to steer. Why learn in this order? Because someone who has been through the Studio's flow once, end to end, absorbs every later course at a completely different speed.

So, pretend the timer just started. From the next step on, your hands stay busy.

2

Sign up and your first check-in reward

First, let's get you a seat. Press the Try it now button below and the sign-up screen opens. Email or a social account, one minute, zero cost.

The moment you're in, a check-in reward is waiting. VibeCampus credits you with Vibes, the platform currency, every day you show up, and those Vibes later fuel your builds and plenty of other features. Why grab it from day one? Because the daily check-in is the only reward that disappears if you put it off.

Try it now

Tip

Right after signing up, pick your interests in your profile. Recommendations all over the platform will start bending toward your taste.

3

A 30-second tour of the Studio

Now we walk into the workshop. In the middle of the Studio screen you'll see a large input box. This is where you write your sentences. In other words, the heart of the platform.

Look around the input box. There's a build-type selector for things like web pages, apps, games, and videos, and a build-mode switch for choosing Quick Build or Deep Build. The Prompt helper button is the bell you ring when you have no idea what to write, and Start from a template opens a gallery of 125 finished examples.

For now, just getting the names into your eyes is enough. Each one gets proper treatment in a later course. Why tour first? Because simply knowing where things live cuts the tension of a first build in half.

If you see this, it worked

If you can see the prompt box in the center, with the build type, build mode, Prompt helper, and template buttons around it, you're in the right place.

Try it now
4

Your first prompt: send one sentence

Press the Try it now button below and the Studio input box comes pre-filled with your first prompt. It asks for a booking site for a small Pilates studio, with a class schedule, trainer introductions, and a booking form.

Read the pre-filled sentence out loud once. It says who it's for (a Pilates studio) and what it needs (schedule, profiles, booking form). That is the skeleton of a good prompt. If you like it, send it as is. If you want to change something, edit freely, then press send.

The moment you hit send, the AI takes over. All you did was send one sentence, and now the screen starts getting busy.

Try it now

Heads up

Don't agonize over writing the perfect sentence. Your first prompt is just the opening line of a conversation, and whatever it lacks, the follow-up questions and edit tools in the next steps will catch.

5

clarify: answer the AI's follow-up with a click

After you send a prompt, the AI doesn't jump straight into writing code. First comes clarify, a round of follow-up questions. What mood do you want? How should booking work? The questions arrive as clickable options.

Pick what fits and click. Questions marked Pick all that apply take multiple answers, and if nothing fits, you can type your own. When you're done, press Build it. In a hurry, there's also Skip, just build, but the first time through, answer the questions. Seeing what the AI is curious about is a lesson in itself.

Why does this step exist? Because the same sentence paints a different picture in every head. Clarify closes that gap with a few clicks.

Tip

Add one line in the extra requests box under the options and the result gets noticeably more accurate. Something like 'soft lavender tones, photos with a warm feel'.

6

How to read a blueprint

Once you've answered, the AI shows you a blueprint, a design summary of what it will build and how. Which screens are included, which features will work, what mood it will be dressed in, all laid out item by item.

Your job here is to skim it with an inspector's eye. Is the booking form I asked for in there? Did the schedule survive? If everything checks out, approve it. If something is missing, this is the cheapest moment to say so. Moving a wall on the drawing is always faster than moving it after the house is built.

If you see this, it worked

You'll see a summary of the planned screens, key features, and design direction. Check right now that everything you asked for made it in.

7

What happens while the build gauge fills

Approve, and the build starts as the gauge climbs. This is not idle time. An AI agent is holding your blueprint and writing real code, line after line. On the left of the screen you'll see code streaming by. That is the construction site of your website.

You don't need to understand any of it. Just remember one thing. Every line of that code is yours. VibeCampus gives you the complete source of what you build, so you can download it later and take it anywhere.

If you see this, it worked

When the gauge touches 100%, the running result appears on the right. Code on the left, your actual working site on the right.

8

Preview and phone preview

Your finished site is sitting in the preview on the right. Don't just admire it, touch it. Press the buttons, type a name into the booking form, scroll all the way down. Confirming with your own hands that it truly works is the highlight of this course.

Next, the phone preview. It wraps your site in a to-scale phone frame, and you can even compare iPhone and Galaxy side by side. Most visitors arrive on their phones these days, so how it looks on a phone is effectively its true face.

Heads up

The preview runs inside a security sandbox, so some browser features may be limited. To test properly in full screen, use open in a new tab.

9

Free regenerate and refine: not happy? Go again

It's perfectly normal if the first result isn't 100% to your taste. That's why there are two tools. Free regenerate rebuilds the current result from scratch at higher quality, and refine is a chat where you ask for targeted changes like 'make the button bigger' or 'show the schedule as a table'.

It's okay to get it wrong. Regenerating is free. The people who trust that one sentence and experiment freely improve the fastest. If the whole mood is off, regenerate. If only one part bothers you, refine. That's the whole distinction.

Heads up

Regenerate remakes everything. If there are parts of the current result you love, refining just the weak spots is the safer move.

10

Saving and My builds

When a result you like appears, press save. Saved builds stack up in My builds, and you can reopen any of them at any time to keep editing or to share.

Open My builds with the Try it now button below. The Pilates site you just made should be occupying the first slot. Apps, games, and videos will join it on this shelf, one by one. This is your portfolio and your workshop shelf.

Try it now

Tip

Name your saves specifically. 'Pilates booking v1' will rescue you months from now in a way 'test1' never will, once your builds number in the dozens.

11

Checkpoint quiz: is the flow in your hands?

Right after you send a prompt, what does the Studio do first?

12

Congratulations, and the map ahead

You just completed the Studio's backbone flow: prompt, clarify, blueprint, build, preview, save. Whatever you make from now on, this flow repeats exactly. Today's fifteen minutes are the floor under every build you'll ever make.

The map ahead forks in two. If dev vocabulary still sounds like a foreign language, head to the vocabulary course. If you want to push result quality, head to The Art of the Prompt. Either way, today's Pilates site stays on as the textbook.

And come back tomorrow. Check-in rewards stack daily, and your build shelf can grow daily too.

Remember this

  • The you of fifteen minutes ago and the you of right now are different people. You have completed the full journey from idea to working screen once.
  • The flow you learned today, from prompt through clarify and blueprint to build and save, repeats unchanged in every course. Rebuild it as many times as it takes to make it muscle memory. Regenerating is free, after all.
  • Next you can tear down the vocabulary wall (Dev Vocabulary, Conquered) or sharpen your results (The Art of the Prompt). The first slot in My builds is already filled. Shall we go fill the second?
Try it in the Studio
ClassesNew build