CodeScope CodeScope
Start free

Studio guide for non-coders

How to use CodeScope Studio — step by step

Learn the full Studio workflow in plain English: projects, prompts, quick edits, file tools, preview, backups, and publishing.

Start free — no card Browse tutorials

No coding required • Desktop recommended for full editing • 3‑day free trial

CodeScope Studio preview

Pick a simple tutorial

Each lesson takes 2–5 minutes and uses plain English. No jargon.

Start a project and generate

Pick or create a project, then describe your page in plain English.

Quick Edit and Edit Layout

Change text, buttons, images, and layout visually.

Preview in Studio or new tab

Check changes live and open full preview in a separate window.

Use project database

Save variables and API calls for each project.

File System and branding

Upload media once and reuse it for pages, logos, and favicons.

Plans, backups, and publish

Upgrade from Billing, use Pro backups, and download when ready.

Start a project and generate your first page

Pick a project, type what you want, and let Studio build it.

  1. Open Studio and click Projects to create or choose a project.
  2. Name the project so it is easy to find later.
  3. Type one sentence like: “A homepage for a local gym with pricing, testimonials, and a contact form.”
  4. Press Generate and watch the page appear in preview.
Type your idea
Use the prompt box to describe what you need.
See the result
Preview updates as generation completes.

Tip: Include style hints like “modern”, “friendly”, or “minimal” to guide the design.

Use Quick Edit and Edit Layout

Make fast edits first, then open layout editing for deeper changes.

  • Quick Edit on: double-click text, links, and buttons to change wording and links.
  • Replace images: double-click an image and choose one from File System.
  • Save edits: click Save edits after quick changes.
  • Edit Layout: open the layout editor for drag-and-drop positioning and device views.
Tip: In Edit Layout, use Undo/Redo and save regularly.

Preview your project and switch pages

Use live preview while editing, or open a clean project preview in a new tab.

  1. Use the right preview panel to review changes as you generate.
  2. Switch between project pages from the page list when you need to edit another screen.
  3. Click Preview project in More tools to open the project preview in a new tab.
  4. Refresh preview after major edits to confirm the latest version.

Preview links are view-only. Studio editing access remains protected by your account.

Use Project Database (variables + API calls)

Keep reusable data with each project so changes stay consistent.

  • Open Database from More tools.
  • In Variables, save repeated values like business name, contact details, and key offers.
  • In API Calls, store endpoint details tied to this project.
  • Click Save in each tab and reload preview to verify updates.

This keeps project settings in one place instead of scattered notes.

Manage File System and branding assets

Upload once and reuse media across quick edits, layout edits, and brand settings.

  1. Open File System and upload your images.
  2. When quick-editing images, pick files directly from File System.
  3. Use the Branding section to set logo and favicon from File System.
  4. Reuse the same files across pages to stay consistent.

Tip: descriptive filenames make assets easier to find later.

Manage plans, backups, and publishing

Know when to upgrade and how to publish your finished project.

  1. Use Billing in Studio when you are ready to upgrade.
  2. Remember: Backups are Pro only and are not available on the free trial.
  3. If your trial ends, Studio shows a subscribe popup so you can continue the project.
  4. When ready, click Download to export a ZIP of your project files.

You can host those files anywhere that supports standard website files.

Frequently asked questions (plain English)

Do I need to know how to code? ▾

No. You describe what you want, then use visual tools to edit content and layout.

Can I manage more than one project? ▾

Yes. Use the Projects menu to create, rename, save, and load projects.

Are backups included in my free trial? ▾

No. Backups are a Pro feature and are not available during the trial.

Can I use Studio on mobile or tablet? ▾

For full editing, use desktop or laptop. Mobile and tablet show a desktop recommendation and Billing link.

What do I get when I download? ▾

A ZIP with your project pages and assets, ready to open or host.

Quick glossary

  • Quick Edit
    Edit text, links, buttons, and images directly in preview.
  • File System
    Your project media library for reusable images and assets.
  • Backups (Pro)
    Saved restore points for your project history.
  • Download (ZIP)
    A single file with your project pages and assets.

From prompt to product — effortlessly

Use one Studio for projects, edits, assets, preview, and publishing. Upgrade anytime from Billing when you are ready.

Start your 3‑day free trial