Each unindented block becomes a component in the editor view and a screen in the presentation view. The text you type on the first line becomes the name of that component/screen.

Untitled

You can reuse blocks by copying them, referencing their name. We’ll explain that in depth on the Composition page.

Screenshot 2024-02-10 at 8.51.36 AM.png

Basic Syntax

Every line follows the same pattern:

“Make or do this ____ with these styles ____ and these properties ____ and call it ____”

Let’s look at some examples:

Untitled

Untitled

These action words are called directives. They are key words that the app knows, that make or do something. What about when we don’t type a directive, like on the lines “Home Page” and “About Page”? That’s the equivalent of just saying “Call it Home Page” — and so WF assumes you want to use the text directive. So these things are actually equal:

Untitled

Dive In!

At this point, you know enough to get started. The best way to learn is by looking at the examples and changing things.

If you want to learn more about the ideas that went into Wireframe Fun you can check out the 10ft. View