Sign in Start free

All learning paths

beginner

Prompting Pages, Layouts, and UI

Describe the interface clearly so the builder creates what you actually mean.

Learn how to prompt AI app builders to create cleaner pages, better layouts, and more consistent UI without fighting the tool. You'll learn the language of layout, component-based prompting, responsive design, reference-based prompting, and how to revise broken UI without starting over.

Sign up I already have an account

One-time · Forever access

4 modules 12 hands-on lessons ~4.5h total

Why this path works

Every lesson is a rep, not a reading.

A real challenge

Every lesson gives you one concrete task. You write the prompt and run it — no passive watching.

AI coach and grader

The coach nudges you without giving the answer away. The grader scores your prompt against a clear rubric until you pass.

Proof you can do it

Track your progress, keep your streak, and earn a signed certificate when you finish the path.

The curriculum

4 modules · 12 lessons

About 1.3 hours of focused practice.

Module 01

UI Prompting Basics

How builders interpret visual instructions — and why vague UI prompts fail.

3 lessons

01Why the builder made that ugly layout6 min
02The language of layout6 min
03Prompt the page, not just the vibe5 min

Module 02

Prompting Pages and Sections

Build cleaner screens by describing pages section by section and as reusable components.

3 lessons

01Describe a page section by section6 min
02Prompt components instead of whole pages6 min
03Responsive prompting without saying "make it mobile friendly"6 min

Module 03

Consistency and Style

Keep the whole app looking like one product — not twelve different ones.

3 lessons

01Keep pages visually consistent6 min
02Use references the right way6 min
03Prompting style without breaking the layout6 min

Module 04

Revising Bad UI

Fix what the builder already made without tearing the whole page down.

3 lessons

01Fix a bad page without rebuilding it6 min
02Fix broken hierarchy, spacing, and alignment6 min
03Capstone: prompt a clean multi-page interface12 min

Other learning paths

Where to go next.

AI App Builder Foundations

Prompt like a builder, not a dreamer

Fixing Bad AI Builds

Turn bad outputs into working builds — without starting over.

AI Automations for No-Code Builders

Build smarter no-code workflows — triggers, actions, approvals, and AI-assisted steps.

Builder Mindset for Vibe Coders

Think like a builder. Prompt like a super user.

Learn how prompts actually work

Real-World Workflows

Prompting for business tasks

Advanced Systems

Building reliable prompt systems

Base44 Prompt Engineering

Vibe-code real systems by prompting well

Getting Started with Lovable

Learn the platform, then prompt it well

Prompting for Base44 Builds

Write clearer prompts for pages, features, revisions, and bug fixes so the builder gives better results faster.

Using Discuss Mode Before You Build

Plan flows, features, and structure before spending credits or touching the live app.

Designing Better UI in Base44

Create cleaner layouts, stronger hierarchy, and more polished screens without fighting the builder.

Fixing Bad Base44 Outputs

Turn messy builds into working apps without starting over.

Planning Data Before Prompting

Think through records, entities, ownership, and relationships before you ask Base44 to generate the app.

Authentication and User Management in Base44

Build sign-up, login, roles, profiles, and protected areas with more confidence.

File Uploads and Storage Systems

Build apps that handle images, PDFs, documents, and user assets the right way.

Emails, Notifications, and Onboarding Flows

Use Base44 to send welcome emails, reminders, alerts, and user follow-ups that keep people engaged.

Building Payment and Subscription Flows

Create paid access, checkout, subscriptions, and upgrade paths that make sense for real products.

Integrations in Base44

Connect external tools and services without losing control of the product experience.

Workflow Automation in Base44

Create approval flows, logic chains, and internal automations that reduce manual work.

Building Internal Tools with Base44

Use Base44 to create dashboards, CRUD systems, admin actions, and operational tools for teams.

Building Client Portals with Base44

Create secure client-facing portals with auth, uploads, statuses, documents, and messaging.

Base44 Superagents

Build AI agents that monitor, decide, and take action across your tools.

Version Control and Safe Iteration

Experiment, compare changes, and roll back safely without losing good work.

Testing and QA in Base44

Validate features, catch problems earlier, and improve app quality before users do it for you.

Analytics and App Growth Tracking

Read product signals, understand user behavior, and improve the app with real feedback.

Real-Time Collaboration in Base44

Build with teammates more effectively using shared workflows, reviews, and safer handoffs.

Responsive Design for Base44 Apps

Make your app feel clean and usable across desktop, tablet, and mobile.

Custom Domains and Launch Readiness

Publish with more confidence using production checks, domain setup, and trust-building basics.

Base44 Backend Platform Essentials

Understand how Base44's backend works for full-stack, mobile, headless, and hybrid products.

Serverless Functions and Custom Logic

Know when the visual builder is enough and when custom backend logic is the right move.

Headless Services and Automation with Base44

Use Base44 as the backend for bots, jobs, webhook receivers, and non-UI products.

Extending Existing Apps with Base44

Add Base44 backend capabilities to an existing stack instead of rebuilding from scratch.

Mobile Backends with Base44

Use Base44 as the backend for real-time mobile apps and secure user data flows.

Security and Data Access in Base44

Protect multi-user apps with stronger auth, access rules, and data ownership patterns.

Accessibility Foundations for Vibe Coders

Ship apps that work for everyone. Learn to spot, prompt, and fix accessibility issues without becoming a WCAG lawyer.

WCAG 2.1 AA Accessibility Audits for Base44 Apps - Advanced

Learn how to audit, fix, and document accessibility issues in Base44 applications so your apps are easier to use, keyboard-friendly, screen-reader-aware, and closer to professional compliance standards.

Prompting in Lovable

Write clear build prompts, revision prompts, and fix prompts that get better results faster.

From Idea to First Working App in Lovable

Turn an app idea into pages, flows, database needs, and a first usable version.

Planning Before You Prompt

Scope pages, features, states, and data before you spend credits.

Lovable UI Foundations

Build cleaner layouts, sections, navigation, empty states, and mobile-friendly pages.

Editing and Iterating Without Breaking the App

Refine existing screens safely instead of rebuilding from scratch.

Working with Images, Assets, and Branding in Lovable

Use logos, public assets, visual references, and brand rules more effectively.

Building with Agent Mode

Use Agent mode for larger tasks, debugging, and more structured execution.

Using Knowledge Files in Lovable

Store project rules, app context, design standards, and architecture guidance so Lovable stays consistent.

Lovable for SaaS Apps

Build dashboards, auth, billing, account settings, and user roles in a way that fits real software products.

Lovable for Client Portals

Create protected client-facing portals with uploads, status tracking, and messaging.

Lovable for Internal Tools

Build admin panels, CRUD flows, filters, search, and operations dashboards with more confidence.

Database Design for Lovable Builders

Think through tables, relationships, ownership, permissions, and records before prompting.

Authentication and User Flows in Lovable

Build sign up, login, profile setup, protected routes, and role-based experiences with more confidence.

Working with Lovable Cloud

Use Lovable Cloud for database, auth, storage, edge functions, secrets, and app hosting.

API Integrations in Lovable

Connect third-party APIs securely and decide what belongs in the frontend versus edge functions.

Payments and Stripe in Lovable

Build subscriptions, checkout, account upgrades, and billing flows that match real product needs.

Collaboration and Team Workflows in Lovable

Share projects, manage workspace roles, and build more effectively with designers, developers, and teammates.

GitHub Sync for Serious Builders

Use version control, backup, collaboration, and local edits as part of a real Lovable workflow.

Security for Lovable Apps

Protect data, manage secrets safely, review findings, and reduce risk before publishing.

Publishing, Domains, and Going Live

Publish your app, connect domains, and launch with more confidence.

SEO and GEO for Lovable Apps

Improve metadata, routing, schema, content structure, and search readiness for both search engines and AI systems.

Analytics and Growth Tracking in Lovable

Use visitor, pageview, bounce rate, source, and device data to improve the app with real signals.

External Deployment and Code Ownership

Decide when to stay on Lovable Cloud, when to sync to GitHub, and when to deploy outside Lovable.

Migrating from Prototype to Production with Lovable

Harden the app, review security, improve architecture, and decide what stays inside Lovable versus what moves outside.

Replit Foundations

Go from blank canvas to your first published Replit app.

Prompting in Replit

Write build, revision, and fix prompts that actually get results.

From Idea to First Working App

Turn a rough idea into a real, usable first version.

Plan Mode, Canvas, and Visual Editing

Plan first, explore visually, then build with less guesswork.

Editing and Iterating Without Breaking the App

Make changes in smaller, safer steps.

UI Foundations in Replit

Build cleaner layouts, structure, and polish.

Replit Agent Mastery

Use Agent and its modes like a senior builder.

Replit Assistant for Fast Iteration

Use Assistant for small edits, quick fixes, and flow.

replit.md, Skills, and Better Context

Give Agent the context it needs to stay consistent.

Building SaaS Apps on Replit

Ship an accounts + product SaaS without overbuilding.

Internal Tools and Admin Systems

Build admin tools your team will actually use.

Client Portals and Shared Workspaces

Give clients a clean, trustworthy private workspace.

Database Design for Replit Builders

Design a data model that won’t bite you later.

Files, Uploads, and App Storage

Ship file-heavy features without breaking trust.

Integrations, Connectors, and MCP

Plug your app into the outside world, cleanly.

Security in Replit

Ship AI-built apps without leaking credentials or data.

Publishing and Deployment Types

Pick the right deployment for every kind of app.

Monitoring, Analytics, and Live Operations

Run a published app like a professional.

Git, GitHub, and Version Control

Treat your Replit project like a real codebase.

Team Collaboration in Replit

Scale from solo builder to a real team.

Building AI Apps with Replit AI Integrations

Ship AI features without juggling provider accounts.

Mobile Apps with Replit and Expo

Ship a mobile experience on top of your web app.

Multi-Artifact Products in Replit

Ship a product, a deck, and a demo video from one project.

From Prototype to Production on Replit

Turn a demo that works into a product that holds up.

Prompt Engineering Foundations

The core skills behind writing prompts that actually work.

How AI Actually Interprets Your Prompt

Understand how models read instructions, context, and intent.

Prompt Revision and Prompt Debugging

Fix weak prompts and rescue bad outputs.

AI Models 101: Which Model to Use and When

Pick the right model for every job — and prompt it accordingly.

Prompt Chains and Multi-Step Prompting

Break big tasks into small prompts that build on each other.

From Prompting to Problem Framing

The best outputs come from framing the right problem first.

Start Prompting Pages, Layouts, and UI today.

Your first lesson takes a few minutes. It's free to try.