MODO
LEARN MODO / PRACTICAL GUIDE

Create your first website

Available in the beta codebaseReviewed 2026-10-20
A guide to the current beta, not a release announcement.

These instructions are reviewed against the app source. Final-installer walkthroughs are still pending. Check platform availability and requirements before installing. Windows is an updates list, outside the 1,000 beta places.

Make a simple introduction for a fictional studio called Paper Studio. You will edit the starter page, preview it locally, and save a portable project copy.

Before you start

Have MODO desktop open in English and choose a writable location for a new project. This guide begins at Welcome; installation is outside its scope. You do not need an AI connection, images, or a hosting account.

Create and edit the page

  1. At Welcome, choose New project. Set Project name to Paper Studio and Starting point to Website. Leave Add a free Playground page off for this exercise.
  2. Choose Choose folder & create… and complete the folder selection. Keep this working folder available: MODO saves your edits there.
  3. Open Home in Pages, then choose the Primary frame using Active frame. The website starter includes Desktop, Tablet and Mobile frames.
  4. In Layers, select Title. Double-click the text on the canvas and replace it with Small ideas, carefully made. Finish editing by clicking outside the text.
  5. Select the other starter text layer and replace its content with Paper Studio creates thoughtful websites and visual identities. The current starter includes Italian sample copy; replace both text blocks for this English example.
  6. Select the outer Home frame. In Design, inspect its vertical Stack, Gap, and Frame padding. Keep the existing layout for now; the next guide explains how to adjust it.
  7. In Settings → Targets and versions, find Website. Set Site name to Paper Studio and Language (BCP 47) to en. The interface language does not set the website's language automatically.
  8. Choose Preview to inspect the page in the browser. Return to the editor to make changes.
  9. Wait for Saved locally, then choose File → Save a .modo copy… and save the copy somewhere you can find again.

Check your result

The Home page shows your two English text blocks. Its web language is en, its working folder is saved, and you have a separate .modo snapshot.

Common problems

  • The canvas shows only a free design area: open Home and select its Primary frame.
  • Text changes only on Mobile: you edited a secondary frame. Undo that edit and repeat it on Primary if you want a shared starting value.
  • Preview is blocked: read the reported error or trust requirement. Only grant trust to a project whose source you recognize.
Shared with the app’s offline Help · 0.1.0-alpha.1-docs.2
Need a correction? Tell us