Skip to content
QuantCDN

Try the demo

Quant Studio offers a fully functional demo environment that lets you explore every feature without connecting a GitHub account or creating a project. The demo launches a complete Studio workspace using a pre-configured Astro template with sample content, schemas, and media — giving you a hands-on feel for the platform in seconds.

Start the demo

Section titled “Start the demo”

From the Quant Dashboard, open the Create Studio Project screen and click the Try the Demo card (its CTA reads Launch Demo). No GitHub account, no project, and no configuration needed — the demo loads in your browser.

You will land in a fully working Studio environment with the same tools and interface available in a production project.

What’s included

Section titled “What’s included”

The demo template ships with everything you need to explore Studio’s capabilities:

  • Sample content collections — a post collection with blog entries (including MDX, drafts, and reading-time examples) and a page collection with simple marketing pages
  • Pre-configured Zod schemas — field types including string, date, boolean, enum, tag arrays, and optional image paths, all driving automatic form generation
  • Tailwind CSS styling — a styled Astro site with utility classes you can modify in real time
  • Sample media assets — images and files available in the media browser for use across entries
  • Astro layouts and components — production-style templates demonstrating how content renders in the preview, with data-quant-field annotations for click-to-edit
  • Dynamic route patterns — preview URLs that reflect your site’s routing structure

All Studio features are operational in the demo. You can use the visual editor, AI assistant, schema management, file browser, and media uploads exactly as you would in a real project.

Explore the features

Section titled “Explore the features”

Follow this guided tour to experience the core capabilities of Quant Studio:

  1. Browse collections in the collection browser — see entries organised by collection type, with field summaries and status indicators for each entry.
  2. Open an entry and try the visual editor — edit fields in the form panel and watch the live preview update as you make changes.
  3. Click elements in the preview — select text, images, or other rendered elements to jump directly to their corresponding field editors.
  4. Upload an image in the media browser — drag and drop or browse to upload a file, then insert it into an entry’s image field.
  5. Ask the AI assistant to help — try prompts like “create a new blog post about web performance” or “update the description for the about page” to see the assistant edit content for you.
  6. Browse source files in the code editor — view Astro components, layouts, and configuration files with syntax highlighting in the Monaco editor.
  7. Edit the Tailwind config — modify colours, spacing, or typography values and watch styles update in the preview.

Next steps

Section titled “Next steps”