Getting Started

Lopaka.app is a browser-based editor for designing embedded user interfaces and generating code for supported display platforms.

This guide covers the fastest path from signing in to editing your first project.

Sign in

Open lopaka.app and continue with one of the available sign-in methods:

• Email magic link
• GitHub
• Google

After authentication, Lopaka takes you to the Projects page. This is your main workspace for managing cloud projects.

Projects page

The Projects page shows all of your saved projects and their screens.

From here you can:

• Create a new project
• Open an existing project
• Filter projects by platform, title, display size, or favourites
• Add more screens inside a project

If your account has no projects yet, Lopaka prompts you to create the first one.

Create a new project

Click New Project on the Projects page to open the project wizard.

The wizard asks for the main project settings:

1. Title: the name shown in your projects list
2. Platform: the target framework or device family. See Platforms for more details.
3. Screen Size: choose a preset display, or enable the Custom switch to enter your own width and height
4. Background: pick the default screen background color when the selected platform supports it
5. Publish to Gallery: enable this option to make the project visible to other users in the gallery

When you confirm, Lopaka creates the project with an initial screen named Screen 1 and opens it in the editor.

Edit project settings

From the Projects page, click the icon next to a project to open Project settings.

Continue from here

Once your first project is ready, the next steps are usually:

• Open the project in the editor
• Export the generated code
• Share the project with others