Introduction

Thank you for your interest in Layerz and for taking the time to read this guide.

Layerz is an app for iPad, iPhone, and Mac that lets you design an app and turn that design directly into a working app.

There are many ways to design an app, but Layerz takes a different approach from other design tools.

Design tools have traditionally offered a way to draw freely on a canvas. A free-form tool places no limits on the designer's creativity and lets you design anything you want. In app design, however, this is also what creates the gap between the design and the actual product.

A freely drawn design is later translated into code by a developer, and during this process some parts turn out to be impossible to implement, eventually forcing decisions to change the design into something else.

In Layerz, every act of designing happens in the same way the app is actually built, so the design you make becomes the app right away.

To make this possible, opening the editor shows you an iPhone-sized Page, where you place the design elements you want by Drag and Drop. The design elements you add are always kept neatly arranged on the screen — the Page — using methods such as Auto Layout, Stack, and List.

And beyond the designs you create yourself, you can use most of the standard Components that the OS provides for apps. These include basic Components such as Label, Button, and Toggle, as well as more complex Components like Web View and Map View.

With Layerz, you naturally come to understand how an app actually works, and you can quickly produce practical app designs.

App Design

To make designing an app that fits the OS as fast and easy as possible, Layerz lets you use most of the native methodologies and UI Components that the OS provides.

A Page can be defined as a single screen shown on the display.

In Layerz, you can create multiple Pages, design each one independently, and then build the same flow as a real app using Tab Bar, Navigation Push, Modal, and more.

This makes perfect prototyping possible.

Why Layerz Is an iPad App

Layerz is fundamentally an iPad app. But you can use it in exactly the same way on iPhone and Mac.

The reason Layerz is built around iOS is that the design output itself is made up of iOS Components. You can design using many Components directly — including Tab Bar, Navigation Bar, and Toggle Switch — and as new versions of iOS upgrade the design of these Components, those design changes are reflected as-is.

Every feature works 100% on iPhone and Mac as well.

On iPhone, the editing features can be a little inconvenient to use because of the limited screen size, but a powerful advantage is that when you Preview, you get an experience that is exactly the same as running a normal app.

On Mac, you can work more comfortably on a larger screen using a mouse. Mac also offers a Run mode in addition to Preview, so you can run the native iOS app directly on the Mac.

Building an App with Layerz

In Layerz, an app is three things brought together in one place — Design, Data, and Behavior. And it runs instantly, with no build step.

• Design — Build screens by placing native UI components on a Page.
• Data — Define the information your app handles and bind it to the screen. → What is Data
• Behavior — Define "when this happens, do this" without code, using Action Flow. → What is Action Flow
• Connect — Communicate with real APIs to work with live data. → Importing OpenAPI / Swagger